5 Tips Merancang Kemenangan “Tombol Beli”

Jika Anda seorang desainer, atau pemasar online, atau kebetulan Anda memiliki situs web tempat Anda mencoba menjual sesuatu, pada titik tertentu Anda harus merancang "tombol beli" yang tepat. Dan kemudian, Anda akan segera mengetahui bahwa hanya menempatkan a “beli sekarang” teks pada kotak biru tidak cukup jika Anda mengharapkan hasil yang baik.

Untungnya, mendesain "tombol beli" yang tepat tidak begitu sulit setelah Anda mengenal pengetahuan dasar. Ini dia.

Pertama-tama, itu teks pada tombol Anda adalah hal yang paling penting, tetapi ada beberapa fitur lain yang perlu dibenahi. Mengapa saya mengatakan bahwa teks adalah yang paling penting? Bayangkan ini - apa gunanya memiliki tombol yang dirancang dengan indah jika teks di atasnya mengatakan “Pergi ke neraka!”? Kasus ditutup. Salinan yang baik adalah tempat uang dibuat.

Dalam artikel hari ini, kita bahas 5 sifat penting dari "tombol beli" yang tepat. Mari lihat!

1. Gaya keseluruhan

Ini adalah poin # 1 dalam daftar ini bukan tanpa alasan, karena itu adalah sifat yang paling penting.

Yang kamu ingin mengubah tombol Anda menjadi sapi ungu. Ini adalah konsep yang dipopulerkan oleh Seth Godin. Singkatnya, Anda ingin itu luar biasa; maksud saya sesuatu yang luar biasa yang tidak bisa dilupakan. Sesuatu seperti sapi ungu di tengah padang rumput.

Beberapa desainer tidak terlalu pandai dalam hal ini. Sangat menggoda untuk membuat tombol yang mengikat indah dengan warna dan gaya situs web yang didudukinya. Pada awalnya sepertinya ide yang sangat bagus, hanya saja tidak.

Masalahnya adalah tombol seperti itu jauh dari luar biasa. Anda tidak ingin tombol Anda berbaur; Anda ingin itu menonjol. Oleh karena itu, itu harus dibuat sebagai elemen yang benar-benar terpisah yang kebetulan duduk di beberapa situs web, bukan sebagai sesuatu yang harus sesuai dengan situs web itu.

Biarkan saya memberi Anda contoh yang bagus dari tombol seperti ungu-sapi.

Mozilla Firefox

Seperti inilah tampilan halaman unduhan Firefox. Saya ingin Anda memperhatikan satu hal. Tombol di sebelah kiri, tombol unduh, tidak seperti yang lainnya di halaman itu. Itu satu-satunya yang hijau. Ini satu-satunya tempat yang menyajikan logo Firefox. Itu salah satu elemen terbesar di sana. Itu terletak di atas flip.

Semua sifat ini membuat tombol ini sangat terlihat. Itu adalah sapi ungu. Jika Anda mengatakan Anda tidak melihatnya, Anda hanya mencoba untuk mengesankan seseorang.

Pendeknya: Bertujuan memiliki tombol yang luar biasa.

2. Penampilan

Mari kita mulai warna.

Jika Anda ingin menjadi luar biasa gunakan warna yang belum pernah digunakan di tempat lain pada halaman. Sama seperti yang dilakukan orang-orang di situs web mereka. Anda dapat menggunakan alat seperti Perancang Skema Warna untuk menemukan warna yang terlihat bagus dengan skema warna situs web Anda saat ini tetapi masih sangat berbeda.

Dan “berbeda” adalah kata kunci di sini. Jika sebagian besar situs web Anda berwarna biru, Anda tidak ingin tombol beli biru. Anda tidak ingin warna biru. Anda tidak ingin apa pun yang terlihat kebiru-biruan. Anda ingin merah muda, oranye, dll. Saya yakin Anda mengerti maksudnya.

Satu trik lagi. Oranye dikenal sebagai warna yang paling terlihat setelah merah. Tapi, itu tidak membangkitkan semua emosi negatif yang dilakukan merah (hal-hal seperti “berhenti”, “mencari!”, dan “bahaya”). Tombol oranye paling populer di internet dapat ditemukan di amazon.com.

Hal berikutnya yang menjadi fokus adalah ukuran tombol. Nah, apa yang bisa saya katakan, itu harus BESAR. Semakin besar itu semakin baik. (Sekali lagi, contoh Firefox.)

“Bisakah saya membuatnya lebih besar?” adalah pertanyaan yang bagus untuk diajukan selama fase desain. Lakukan banyak.

Haruskah begitu sederhana atau mencolok? Sebuah tombol tidak bisa terlalu mencolok. Lihatlah tombol Firefox sekali lagi. Itu mencolok. Ada rubah oranye di atasnya, namun masih terlihat seperti tombol. Dan itu adalah batas yang tidak bisa Anda lewati. Jika tombol Anda tidak terlihat seperti tidak ada yang akan mengkliknya.

Itu sebabnya tidak ada jawaban sederhana yang lebih baik - mencolok atau sederhana. Anda hanya harus mencari tahu sendiri. Tes selalu terpisah. Buat dua tombol, satu mencolok dan satu sederhana. Gunakan keduanya sekaligus, dan lihat mana yang berkinerja lebih baik. Google Website Optimizer akan membantu Anda dengan itu.

Contoh singkat tombol sederhana.

ThemeFuse

Seperti yang Anda lihat tombolnya tidak menggunakan rubah oranye, tapi masih sangat terlihat. Sebenarnya, ThemeFuse (toko tema WordPress premium, yang merupakan bagian dari saya) menyediakan sesuatu yang disebut shortcode. Antara lain, kode-kode pendek itu membuatnya sangat mudah untuk membuat tombol yang tampak bagus.

Misalnya, hanya dengan satu baris:

[tombol tautan = "domain.com"] Klik di sini untuk membeli produk saya yang luar biasa! [/ tombol]

Saya mendapatkan hasil ini:

3. Fon

Font Sans-serif adalah standar untuk semua jenis tombol. Itu karena font sans-serif sangat mudah dibaca untuk setiap penggunaan online. (Di sisi lain, font serif lebih baik untuk publikasi cetak.)

Anda ingin salinan pada tombol Anda dapat dibaca sebagai mungkin, karena itu adalah bagian paling penting dari teks pada halaman. All-caps bukan ide yang bagus. Kasing campuran bekerja jauh lebih baik. Dengan huruf besar maksud saya huruf pertama dari setiap kata menjadi karakter huruf besar. (Kecuali kata-kata suka “untuk”, “itu”, “dan”, dll.)

(Sumber gambar: Gomediazine)

Beberapa font aman yang dapat Anda gunakan adalah: Arial, Helvetica, Franklin Gothic, Myriad, atau font sans-serif klasik lainnya, sungguh.

Sekarang bagaimana dengan warnanya. Salinan tentu saja harus sangat kontras dengan warna tombol. Anda tidak ingin abu-abu. Anda ingin hitam putih, atau biru putih oranye.

Sekali lagi, teks harus sangat mudah dibaca.

4. Penempatan

Penempatan terbaik tergantung pada desain situs web Anda, yang mungkin tidak mengejutkan. Namun masih ada beberapa aturan yang patut dipatuhi.

Tempatkan di tempat paling jelas mungkin. Jangan mencoba menjadi kreatif di sini. Penempatan harus jelas bagi pelanggan / pengguna.

Setiap kali seseorang mengunjungi situs web mereka berharap melihat hal-hal tertentu di tempat-tempat tertentu. Hal-hal seperti: logo di sudut kiri atas, ringkasan keranjang belanja di sudut kanan atas, klausa hak cipta di catatan kaki, dll. Tugas Anda adalah mencoba mencari tahu tempat apa yang paling jelas untuk tombol beli dan meletakkannya di sana.

Tentu saja, itu harus menjadi tempat yang paling terlihat pada saat yang sama. Ini berarti dua hal:

1. Saya t benar harus ditempatkan di atas lipatan, dan
2. Jangan takut spasi. Whitespace adalah teman dari setiap perancang web yang baik. Ingat, tidak masalah berapa banyak barang yang bisa Anda tempatkan di situs web, yang penting adalah berapa banyak barang yang bisa Anda hapus dari itu.

Anda dapat menempatkan strategi penempatan Anda pada steroid dengan menduplikasi tombol dan juga menempatkannya di bagian bawah halaman. Dengan begitu, ketika seseorang membaca seluruh halaman mereka masih bisa mengambil tindakan di bagian bawahnya.

5. Elemen ekstra

Ini adalah lapisan gula pada kue. Elemen tambahan meningkatkan visibilitas tombol Anda lebih jauh. Contoh elemen: panah, kereta belanja, kacamata pembesar, tanda plus, atau berbagai elemen merek.

Contoh favorit saya - contoh Firefox - menggunakan satu elemen ekstra yang sangat keren - rubah oranye (alias logo mereka).

Aturan praktisnya adalah menggunakan elemen tambahan itu menekankan tujuan tombol. Misalnya, dua panah yang menunjuk ke bawah berfungsi dengan baik untuk tombol unduh. Ikon keranjang belanja berfungsi sangat baik dengan tombol tambahkan ke keranjang (contoh amazon di atas). Kaca pembesar berfungsi baik dengan tombol pencarian. Dan seterusnya.

Anda juga dapat menggunakan beberapa elemen branding. Misalnya hal-hal seperti: ikon RSS standar dengan tombol berlangganan untuk memberi makan, ikon burung dengan tombol ikuti-saya-di-twitter, rubah oranye dengan tombol unduh-firefox, logo Anda sendiri dengan beli-saya- tombol barang.

Berikut ini beberapa contohnya:

Wakeinteractive

Komersialiq

Sedang mencoba

Unlocking.com

Sofasurfer.eu

Unggah

Kekuatan "Gratis"

Satu trik lagi adalah penggunaan kata yang paling kuat dalam bahasa Inggris - GRATIS. Setiap kali sesuatu diiklankan sebagai gratis, orang-orang mulai bertindak tidak masuk akal yang dapat diduga (lihat buku bagus oleh Dan Ariely, "The Upside of Irrationality" untuk mencari tahu apa yang saya maksud.)

Lebih banyak contoh:

Freshbooks

Wufoo

Freeagent.com

Apa berikutnya?

Jika Anda cukup mahir dalam Photoshop atau perangkat lunak serupa lainnya, Anda dapat melanjutkan dan membuat tombol yang bagus sekarang. Cara lain adalah menjadi pemilik yang beruntung dari setiap tema WordPress oleh ThemeFuse, seperti yang saya sebutkan sebelumnya dalam posting ini.

Apa saran Anda untuk merancang tombol beli yang bagus? Saya ingin memperbarui posting ini dengan pendapat Anda.