9 Tips Desain CTA Penting untuk Tombol yang Membuat Orang Mengklik

Diterbitkan: 2022-08-27
Waktu Membaca: 10 menit

Ajakan bertindak (CTA) Anda adalah klimaks dari strategi pemasaran Anda. Baik Anda meminta pembelian, mendaftar, atau mengunduh. Semuanya hingga saat ini adalah untuk mendapatkan pelanggan potensial ke halaman arahan Anda. Dan terkadang, Anda hanya punya beberapa kata untuk menutup kesepakatan.

Itulah mengapa tombol CTA Anda adalah elemen desain terpenting situs Anda. Karena dapat mengubah pengunjung pasif menjadi pengguna aktif.

Tombol ajakan bertindak tampak sederhana. Tapi mereka mudah dikacaukan. Atau benar-benar ketinggalan. 9 tips desain CTA ini akan memastikan Anda mendapatkan konversi itu. Plus, banyak contoh bermanfaat:

  1. Jadikan tombol Anda terlihat dapat diklik
  2. Jadilah deskriptif dengan salinan Anda
  3. Ukuran dan ruang dengan benar
  4. Terhubung menggunakan orang pertama
  5. Buat urgensi dan gunakan kata kerja yang kuat
  6. Coba subjudul
  7. Variasi pengujian A/B
  8. Perhatikan versi seluler

Jadikan tombol CTA Anda terlihat dapat diklik

Membuat tombol terlihat 'dapat diklik' terdengar konyol. Tapi Anda tidak akan percaya seberapa sering situs melakukan kesalahan. Dan itu sebagian besar berkaitan dengan garis besar dan warna tombol.

Tren tingkat konversi datang dan pergi. Seperti "tombol hantu" transparan dengan batas tipis dan teks yang memudar menjadi warna latar belakang. Meskipun mereka mungkin terlihat keren, mereka cenderung kurang menarik perhatian. Kebalikan dari apa yang harus dilakukan CTA yang efektif.

Satu-satunya saat desain ini biasanya berfungsi adalah sebagai tombol sekunder:

Tombol hantu tunggal sebagai CTA utama buruk. Menggunakannya sebagai tombol sekunder dari tombol utama adalah praktik yang baik.

Sumber: Gerakan UX

Berikut adalah contoh lain dari tombol CTA yang tidak dapat diklik dengan jelas. Tentu, halaman arahan agensi desain ini terlihat keren. Tetapi Anda akan dimaafkan karena menggulir melewati studi kasus ini:

Tombol CTA yang menyatu menjadi sub-judul kecil di bawah judul utama "Membuat merek super berbasis komunitas pertama di dunia"

Jadi, bagaimana Anda membuat orang mengklik? Untuk tingkat konversi yang lebih tinggi, tombol Anda harus besar, tebal, dan sesuai dengan skema warna pilihan Anda.

Netflix menggunakan warna merah khasnya untuk menarik perhatian Anda. Hampir seperti tanda berhenti:

Netflix menggunakan tombol CTA "Mulai" berwarna merah di samping kotak alamat emailnya.

Ini juga dapat berfungsi untuk memiliki warna yang kontras, sehingga menonjol. Seperti yang dilakukan oleh platform eCommerce BigCommerce di sini:

"7 Strategi Ritel untuk Mengatasi Dataran Tinggi Pertumbuhan" dalam teks putih dengan latar belakang angkatan laut. Tombol CTA biru cerah di sebelahnya dengan teks putih bertuliskan "Unduh panduan".

Ini berlaku untuk teks di dalam kotak juga. Pastikan kontras sehingga Anda dapat membacanya dengan benar.

Gradien juga dapat bekerja dalam skema warna merek yang sama. Mereka memberi nuansa modern dan lebih muda:

Tombol CTA gradien ungu ke ungu dengan teks putih bertuliskan "Mulai" dengan latar belakang biru tua.

Sumber: Senin

Saran saya di sini adalah mencoba dan menjaga agar desain CTA Anda tetap jelas. Melakukan sesuatu di luar kebiasaan mungkin terdengar seperti ide yang bagus, tetapi manusia adalah makhluk kebiasaan. Dan Anda akan kagum dengan berapa banyak yang akan kehilangan intinya.

Jadilah deskriptif dengan salinan Anda

Salah satu taktik pengoptimalan tingkat konversi (CRO) yang paling sederhana adalah copywriting yang hebat. Tapi tidak hanya dengan potongan besar teks. Mikrokopi sama pentingnya dan mencakup detail yang lebih kecil.

Anda biasanya melihatnya di formulir kontak dan bilah pembaruan status media sosial. Seperti Facebook yang terkenal "Apa yang ada di pikiran Anda?" atau "Mulai posting" LinkedIn.

Mikrokopi dapat membantu:

  • Beri tahu pengguna apa yang harus dilakukan
  • Membuat saran
  • Mengatasi masalah
  • Berikan konteks

Salinan tombol CTA Anda adalah contoh lain. Dan itu harus memberi tahu orang-orang apa yang akan mereka dapatkan/apa yang akan terjadi ketika mereka mengkliknya.

Ini dulunya adalah tombol CTA IMPACT. "Download Gratis". Tidak terlalu imajinatif, ya?

Sumber: DAMPAK

Namun dengan membuatnya lebih deskriptif, mereka meningkatkan konversi sebesar 78,5%. “Tunjukkan cara menarik lebih banyak pelanggan” jelas lebih menarik:

Sangat menggoda untuk hanya menulis "Klik di sini". Tetapi ada begitu banyak alternatif yang akan melibatkan pengguna dan semoga menginspirasi tindakan yang diinginkan.

Jadi, apa yang harus Anda tulis? Pertama, Anda perlu mengidentifikasi maksud konversi. Anda ingin menyelaraskan dengan tempat pengguna berada di corong dan dari mana mereka berasal (sumber lalu lintas).

Corong pembelian dan jenis konten yang selaras. Orang asing - tarik dengan blog, konten premium, iklan. Prospek - konversi dengan daftar periksa, infografis, webinar eBook, kursus. Prospek - tutup dengan uji coba, demo, konsultasi, audit. Pelanggan dan Promotor - senang dengan survei, program rujukan, add-on, rilis awal.

Sumber: KlientBoost

Maka Anda perlu menekankan nilai dari apa yang Anda berikan. Dan menangani keberatan apa pun.

Cocokkan perasaan mis. "Saya mencoba, saya terjebak, saya butuh bantuan". Langkah selanjutnya yang dapat ditindaklanjuti, mis. "Cocokkan aku dengan seorang dev". Menangani keberatan mis. "Coba Prisma dalam 5 menit". Buat spesifik mis. "Mulai uji coba 7 hari seharga $7".

Sumber: Contoh Pemasaran

Ini adalah proses yang unik. Dan itu akan tergantung pada niche dan suara merek Anda. Tapi kata-kata apa pun yang Anda pilih, jangan lupa untuk membuat teks tombol tetap pendek dan langsung ke intinya.

Ukuran dengan benar dan gunakan ruang putih

Desain tombol CTA lebih dari sekadar warna. Ukuran tombol adalah detail kecil lainnya yang benar-benar dapat memengaruhi rasio klik-tayang. Dan ruang putih sama pentingnya dengan teks itu sendiri.

Banyak dari ini akan tergantung pada desain web Anda. Ruang negatif (putih) menarik perhatian ke elemen tertentu pada halaman. Anda tidak ingin beranda yang berantakan. Harus ada jalur yang jelas untuk diikuti pengunjung.

Airbnb adalah salah satu contoh terbaik dari ruang negatif yang dilakukan dengan benar. Dan warna yang kontras untuk membuatnya lebih jelas:

Latar belakang hitam dengan judul putih di tengah "Buka pintu Anda ke hosting". Di bawah tombol CTA merah muda yang mengatakan "Coba hosting".

Buffer memiliki sedikit lebih banyak di beranda mereka tetapi mereka masih menyimpan tombol CTA dekat dengan salinan utama. Plus, contoh penggunaan tombol hantu secara efektif. Ini membuatnya sangat jelas apa yang harus dilakukan selanjutnya:

Laman landas penyangga yang bertuliskan "Kembangkan pemirsa Anda di media sosial dan di luar". Tombol CTA utama (Mulai sekarang) berwarna biru dengan teks putih dengan tombol transparan di sebelahnya bertuliskan "Tonton video".

Semakin besar tombol Anda, semakin terlihat. Dan itu perlu menonjol untuk menarik perhatian. Tetapi tidak terlalu banyak sehingga mengambil alih halaman dan merusak UX.

Jika Anda rentan terhadap migrain, berpalinglah sekarang. Berikut ini contoh cara untuk tidak melakukannya:

Halaman arahan yang sangat berantakan dengan teks dan tombol di mana-mana tentang perbandingan liburan pelayaran.

Sumber: Justinmind

Begitu banyak elemen di sini terlihat seperti tombol. Saya bahkan tidak yakin situs ini tahu apa yang diinginkan pengunjung untuk diklik.

Sebaliknya, apa hal pertama yang Anda lihat di halaman arahan Spotify?

Tombol "Go Premium" yang besar, bukan? Begitulah cara mendesain jalur pengguna yang jelas.

Terakhir, apakah ada hal lain yang Anda perhatikan tentang desain CTA untuk contoh yang bagus? Jika Anda melihat lagi, Anda akan melihat sesuatu yang hampir sama dari mereka semua.

Para ilmuwan menemukan bahwa manusia menyukai "bentuk-bentuk dengan lekukan lembut sebagai lawan dari titik-titik tajam". Mereka lebih enak dipandang dan membuat kita merasa lebih damai. Karena itu, tombol ajakan bertindak yang paling efektif adalah persegi panjang dengan sudut membulat.

Sumber: CleverTap

Ini adalah format paling populer karena suatu alasan. Tapi coba opsi yang berbeda. Audiens Anda mungkin lebih suka sesuatu yang lain.

Terhubung menggunakan orang pertama

Desain CTA yang lebih baik dapat dilakukan dengan satu tweak. Terkadang, satu kata.

Dalam copywriting, kita diajarkan untuk menggunakan kata “kamu”. Karena itu membuat pembaca merasa seperti sedang diajak bicara secara langsung. Jadi menurut Anda itu juga berlaku untuk salinan tombol Anda, bukan? Anehnya, tidak begitu banyak.

Unbounce menemukan bahwa mengubah salinan di halaman arahan mereka dari "Mulai uji coba 30 hari gratis Anda" menjadi "Mulai uji coba 30 hari gratis saya " meningkatkan rasio klik-tayang sebesar 90%.

Jadi, mengapa ini? Nah, ketika seseorang merasa terhubung dengan suatu produk, kemungkinan besar mereka akan berkonversi. Ini memberikan sentuhan pribadi tanpa harus tahu apa-apa tentang mereka.

Psikologi pemasaran menunjukkan keputusan pembelian sebagian besar didasarkan pada emosi. Jadi, Anda ingin pengunjung situs Anda merasa bahwa itu adalah pilihan mereka.

Menulis "saya" membantu pengguna memvisualisasikan tindakan yang akan mereka ambil. Ini memberi mereka kendali dan (semoga) mendorong mereka untuk mengambil keputusan.

Plus, itu dapat menunjukkan bahwa mereka akan mendapatkan nilai langsung. Seperti di beranda Crazy Egg:

"Tunjukkan peta panas saya"

Sumber: Telur Gila

1-800 Contacts adalah toko lensa kontak terbesar di dunia. Tapi mereka melakukan hal yang sama. Mereka memastikan tombol CTA mereka ditujukan hanya untuk satu orang:

"Temukan kontak saya / Susun ulang kontak saya"

Sumber: 1-800 Kontak

Tidak banyak perusahaan yang menggunakan teknik ini. Yang berarti itu menonjol ketika Anda melihatnya. Jadi, mengapa tidak mencobanya?

Ciptakan rasa urgensi dan gunakan kata kerja yang kuat

Salinan Anda perlu menciptakan rasa urgensi dan menarik perhatian pengguna. Ini bekerja sangat baik untuk bisnis eCommerce. Menggunakan kata-kata seperti "sekarang" dan "hari ini" dapat membantu memacu tindakan. Karena mereka menyarankan tawaran itu tidak akan ada selamanya.

"Beli sekarang" adalah klasik. Tapi kami bisa melakukan lebih baik dari itu dengan desain CTA kami.

"Mulai lihat hasilnya hari ini! Mulai sekarang"

Sumber: GoSquared

Anda dapat mencoba kata-kata seperti:

  • “Perlakukan diri Anda hari ini”
  • “Buka diskon sekarang”
  • “Unduhan gratis satu kali”

Anda juga ingin membuat penawaran Anda menarik dan memicu rasa ingin tahu. Jadi, mulailah dengan kata kerja yang kuat. Bukan sesuatu yang sepertinya akan menjadi usaha. Itu cara mudah untuk membuat orang menjauh.

Berikut adalah beberapa contoh dari apa yang saya maksud:

Coba ini: Daripada ini:
Menemukan Daftar
Menghubung Kirim
Mengeklaim Membayar
Bergabung Menyelesaikan
Awal Kirim
Menyimpan Menginvestasikan
Mengeksplorasi Kontak
Temukan Mendukung

Sisi kiri terdengar seperti pengguna Anda akan mendapatkan sesuatu dari mengklik. Sisi kanan terdengar seperti mereka harus mengorbankan waktu atau uang.

Anda juga bisa menjadi sangat kreatif. Seperti versi beranda Huemor ini:

Tombol CTA yang bertuliskan "Luncurkan" dan "Jangan tekan" di bawahnya.

Sumber: FastCapital360

Atau halaman arahan lama Humboldt County yang memberikan sentuhan mistis:

Gambar kelinci putih yang bertuliskan "Ikuti keajaiban"

Sumber: ConEmprendimiento

Brainstorm ide dengan tim Anda. Tidak peduli seberapa konyol. Anda akan terkejut dengan apa yang akan Anda temukan dan akhirnya gunakan. Tapi apa pun kata-kata yang Anda pilih, jangan lupa untuk memenuhi janji Anda di ujung yang lain.

Coba subjudul di sebelah tombol ajakan bertindak Anda

Terkadang, orang membutuhkan sedikit dorongan. Dan sedikit teks di bawah tombol CTA Anda dapat membantu. Ini bukan "subpos" biasa. Tapi itu cara termudah untuk menggambarkannya.

Jika kita menganggap teks tombol sebagai judul, subjudul paling populer yang akan Anda lihat adalah "Tidak diperlukan detail kartu kredit". Tapi milikmu bisa mengatakan apa saja. Dan menyenangkan untuk sedikit berkreasi dengannya.

Sering kali, mereka digunakan untuk memberikan kepercayaan pelanggan potensial. Dan mereka dapat mengatasi poin rasa sakit utama yang mungkin dimiliki orang:

"Kenapa tidak? Gratis selamanya"

Sumber: CoSchedule

CoSchedule memahami bahwa pengguna mungkin berpikir ini hanya uji coba gratis. Jadi, “Kenapa tidak? Gratis selamanya” jelas.

Anda juga dapat menggunakannya untuk menambahkan beberapa bukti sosial:

"2.691 perusahaan mendaftar dalam seminggu saja!"

Sumber: Basecamp

Ini memberi Anda kredibilitas instan karena pengguna dapat dengan jelas melihat orang lain sudah mempercayai Anda. Itu juga dapat menginspirasi FOMO karena orang berpikir pasti ada alasan untuk begitu banyak pelanggan.

Jika Anda memiliki penawaran khusus atau nilai ekstra yang menyertai layanan Anda, gunakan subjudul Anda untuk menyorotnya:

"Selain itu, dapatkan panduan gratis dengan pakar SEO"

Sumber: Mozo

Mikrokopi adalah kesempatan bagi suara merek Anda untuk bersinar. Meski hanya satu kalimat. Jadi, jangan takut sedikit nakal jika cocok:

"Dapatkan 17+ ide pemasaran baru yang lebih baik dari yang Anda miliki"

Sumber: KlientBoost

Anda juga bisa spesifik dengan apa yang akan terjadi setelah orang mengklik. Memberitahu mereka:

  • Apa yang akan mereka dapatkan (ide pemasaran baru)
  • Berapa (17+)
  • Dan mengapa mereka harus peduli (mereka lebih baik dari yang Anda miliki)

Gunakan contoh-contoh ini sebagai templat untuk inspirasi. Atau lakukan sesuatu yang sama sekali berbeda. Pastikan itu cocok dengan identitas merek Anda dan bersenang-senanglah dengannya.

Jangan lupa pengujian A/B

Sebagian besar alat CRO bertujuan untuk meningkatkan pengalaman pengguna (UX). Dan Anda mungkin sudah melakukan ini dengan bagian utama halaman web Anda. Tetapi Anda juga harus melakukannya dengan elemen-elemen kecil.

Amazon terkenal pilih-pilih tentang desain tombol CTA-nya. Apalagi dengan penggunaan pihak ke-3. Jadi, pastikan Anda tidak melanggar aturan apa pun dengan aturan Anda.

Setelah itu, sedikit perubahan pada desain tombol Anda dapat berdampak besar. Jadi, bandingkan berbagai jenis tombol CTA. Kemudian variasi uji A/B dari:

  • Warna tombol
  • salinan CTA
  • jenis huruf
  • Penempatan dalam desain halaman
  • Muncul tiba-tiba
  • Formulir kontak
Mengubah warna tombol "Coba sekarang" dari biru menjadi oranye meningkatkan rasio klik-tayang dari 25% menjadi 38%.

Sumber: Snov

Seperti yang saya bahas sebelumnya, terkadang mengubah satu kata saja dapat meningkatkan konversi atau rasio klik-tayang. Tetapi sebelum Anda masuk, Anda perlu memahami bagaimana pengunjung menavigasi situs Anda.

Anda ingin mengetahui hal-hal seperti:

  1. Elemen apa yang mereka coba interaksikan
  2. Dari mana mereka berasal?
  3. Perjalanan pengguna/corong pembelian situs Anda
  4. Motivasi orang untuk berada di sana

Sumber: GIPHY

Setelah Anda mendapatkan informasi ini, Anda dapat bereksperimen dengan hal-hal berdasarkan fakta, bukan tebakan.

Biasanya lebih mudah untuk membandingkan versi A dan B dengan desain CTA. Tetapi Anda dapat meningkatkan ini dan mencoba pengujian multivarian. Sederhana biasanya lebih baik pada awalnya. Dengan begitu, Anda akan memiliki pemenang yang jelas.

Tapi tidak ada yang menghentikan Anda mencoba pemenang itu melawan versi lain setelah itu. Anda harus selalu menguji dan membandingkan. Bahkan ketika Anda telah menemukan sesuatu yang berhasil. Itulah yang dilakukan oleh merek-merek sukses.

Perhatikan versi seluler

Tip cepat untuk menyelesaikan. Elemen desain Anda akan terlihat sangat berbeda di layar ponsel. Anda bekerja dengan tampilan yang jauh lebih kecil dan piksel yang lebih sedikit. Jadi kekacauan menjadi jauh lebih mudah.

Semua yang telah kami bahas menjadi lebih umum di versi seluler Anda. Warna kontras harus lebih menonjol:

Halaman arahan seluler Spotify - latar belakang gradien ungu dengan tombol "daftar" hijau.

Ruang negatif harus menjadi prioritas:

Airbnb menggunakan ruang negatif untuk membantu menonjolkan tombol "cari tahu lebih lanjut"

Dan bahkan subpos Anda mungkin berada di tempat yang berbeda. Karena pengguna seluler mungkin tidak menggulir ke bawah cukup jauh untuk melihatnya di bawah:

"Go Premium dan buka lebih banyak fitur sekarang" ada di atas "tombol Pelajari lebih lanjut" di halaman arahan seluler Pocket.

Berteriak ke CleverTap untuk grafik itu

Lebih banyak pemikiran perlu masuk ke UX Anda secara umum di seluler. Karena seluler menyumbang lebih dari setengah dari semua lalu lintas pencarian global. Anda tidak dapat mengharapkan versi desktop Anda untuk menerjemahkan. Dan sedikit usaha dapat menghasilkan rasio klik-tayang yang jauh lebih tinggi.

Kesimpulan

Desain CTA yang efektif terdiri dari banyak detail kecil ini. Saya sudah mengatakannya berkali-kali, tetapi tweak terkecil bisa menjadi semua yang diperlukan. Bahkan sesuatu yang tidak penting seperti warna atau bentuk garis luarnya.

Pengujian A/B adalah satu-satunya cara yang akan Anda ketahui. Dan Anda bahkan tidak memerlukan alat CRO yang mahal untuk melakukannya. Lacak saja konversi Anda. Membuat perubahan. Dan lihat apakah ada peningkatan atau penurunan dari angka biasanya.

Berikan saja tombol ajakan bertindak Anda perhatian yang layak. Bisa jadi perbedaan antara pelanggan baru atau peluang yang hilang.

Pernahkah Anda melihat desain CTA asli baru-baru ini? Sudahkah Anda membuat perubahan kecil yang meningkatkan konversi? Beri tahu kami di komentar di bawah.