Cara Menggunakan Elemen Desain Untuk Meningkatkan Konversi

Ingin meningkatkan konversi situs web Anda? Revisi yang jelas akan mencakup ajakan Anda untuk bertindak, menghasilkan sesuatu yang lebih menarik dan menarik. Atau, mungkin materi pemasaran dan promosi itu sendiri. Lagi pula, jika Anda membuat orang tertarik sebelum mereka tiba di situs Anda, mereka pasti akan berkonversi, bukan?

Sebenarnya, Anda mungkin terkejut mengetahui bahwa semuanya dimulai dengan desain. Tidak diragukan lagi, Anda memahami dasar-dasar sebagai manajer pemasaran atau pemilik usaha kecil. Anda berurusan dengan konsep yang sama saat memilih logo, warna dan tema Anda dan saat melengkapi toko fisik Anda. Semuanya bermuara pada presentasi dan pengalaman yang Anda berikan kepada pengunjung Anda.

Hampir setengah dari konsumen (46,1%) merasa desain adalah cara terbaik untuk memutuskan apakah perusahaan atau merek kredibel atau tidak. Di luar itu, orang akan meninggalkan situs Anda jika jelek – total 38% dari semua pengunjung , tepatnya.

Lalu, apa cara terbaik untuk memastikan situs Anda menarik sekaligus meningkatkan potensi konversi? Jawabannya adalah dengan menghormati prinsip dasar desain: warna, ukuran, ruang, garis, bentuk, tekstur, nilai.

1. Warna

Pada dasarnya, warna digunakan untuk membangkitkan emosi, meningkatkan daya tarik visual, dan menonjolkan elemen penting. Warna yang Anda pilih memiliki efek pada tingkat yang lebih mendalam. Tentu, memilih dua warna untuk tema yang tidak menyatu itu menggelegar, tetapi perasaan dan emosi yang ditimbulkannya bagi pengunjung Anda yang akan menghambat pengalaman mereka secara keseluruhan.

Warna-warna hangat dan aktif seperti oranye dan merah cenderung menimbulkan respons yang lebih hidup. Warna dingin dan pasif seperti biru dan ungu jauh lebih menyenangkan, itulah sebabnya begitu banyak penelitian menunjukkan biru adalah warna kebahagiaan .

Anda harus memperhatikan hal ini saat memilih warna untuk latar belakang Anda, elemen dan aksen visual tambahan, tipografi, dan banyak lagi. Pertimbangkan nada situs Anda, produk, layanan, dan apa yang ingin Anda capai. Jika Anda ingin memberikan kesan yang lebih santai dan menenangkan, warna-warna dingin seperti berbagai warna biru tua akan sangat cocok. Jika Anda ingin menarik perhatian, warna yang lebih cerah adalah pilihan yang jelas, tetapi sekali lagi, yang Anda gunakan akan bergantung pada perhatian yang Anda hasilkan.

Anda dapat membaca lebih lanjut tentang menggunakan psikologi warna untuk meningkatkan tingkat konversi di artikel terperinci ini oleh Neil Patel. Saya suka roda emosi ini oleh Conversioner untuk menggambarkan berbagai pemicu emosional warna:

2. Ukuran

Ukuran, seperti yang Anda ketahui, adalah seberapa kecil atau besar suatu item atau elemen. Ketika datang ke elemen desain, ukuran seringkali tentang hubungan satu item dengan item lain di sekitarnya. Semakin besar suatu elemen, semakin menonjol secara visual. Oleh karena itu, Anda dapat menggunakan ukuran untuk menentukan kepentingan, membangkitkan minat visual, menarik perhatian, memandu fokus hampir seperti alur cerita dan banyak lagi.

Jika Anda ingin memastikan bahwa judul atau judul produk menarik perhatian pengunjung secara instan, gunakan font besar dan menarik yang menonjol dibandingkan dengan yang lainnya di halaman. Ini juga merupakan cara yang bagus untuk meningkatkan konversi tanpa mengubah seluruh desain Anda. Ajakan bertindak Anda, misalnya, dapat ditingkatkan ukurannya sehingga menonjol dari konten biasa Anda.

Jika Anda tidak terbiasa dengan kode, mungkin menakutkan untuk membuat perubahan seperti ini sendiri. Untungnya, jika situs Anda berjalan di WordPress, ada plugin yang akan memudahkan Anda mengubah ukuran heading. Coba plugin gratis Sesuaikan .

3. Ruang

Spasi adalah area kosong di sekitar berbagai elemen termasuk tipografi, margin di sekitar teks, dan banyak lagi. Strategi desain minimal mendukung penggunaan lebih banyak ruang dan menekankan pada komponen visual yang ada. Di satu sisi, itu membuat antarmuka yang bersih yang membantu semuanya menonjol dan terlihat, baik, indah.

Ruang dapat digunakan untuk memisahkan elemen atau kelompok. Itu dapat memecah teks — seperti halnya dengan jeda baris dan paragraf baru — dan bahkan dapat menambah daya tarik visual. Lebih penting lagi, ruang memberikan mata pemirsa istirahat, sehingga untuk berbicara. Karena tidak mencakup sesuatu yang penting atau mencakup untuk dilihat, itu juga dapat digunakan untuk memandu mata atau fokus audiens Anda.

Letakkan ruang yang cukup di sekitar objek, gambar, atau elemen tertentu, dan Anda telah benar-benar mendefinisikan pentingnya. Faktanya, ini sangat penting sehingga berdiri sendiri di antara lautan teks dan konten di situs Anda.

Jika Anda menggunakan WordPress, cari tema yang menyertakan pembuat halaman. Pembuat halaman memberi Anda lebih banyak kontrol atas ukuran dan jarak elemen di halaman arahan Anda. Salah satu favorit saya adalah tema Salient .

4. Garis

Sebenarnya, garis adalah tanda antara dua titik yang berlawanan. Seperti yang sudah Anda ketahui, ada banyak jenis garis, dan mereka datang dalam berbagai ukuran dan bentuk. Anda memiliki garis lurus, garis berlekuk, garis lengkung, garis tebal, garis tipis, dll.

Garis — mirip dengan ruang — adalah komponen universal dari desain modern . Anda dapat menggunakannya untuk berbagai hal, mulai dari yang sederhana hingga lanjutan. Anda dapat menggunakan garis aksen untuk menekankan kata, frasa, atau gambar. Anda dapat menghubungkan elemen bersama-sama menggunakan satu garis terlacak. Tentu saja, itu tidak berakhir di situ.

Strategi terbaik untuk meningkatkan konversi dengan garis adalah menggunakannya untuk menarik perhatian ke CTA atau formulir prospek Anda. Dalam satu studi kasus yang diterbitkan oleh ConversionXL , sebuah firma hukum split menguji sejumlah isyarat visual untuk melihat mana yang berkinerja terbaik dalam studi pelacakan mata. Sebuah panah yang menunjuk ke formulir pembuatan prospek adalah pemenang yang jelas.

5. Bentuk

Bentuk dasarnya, kombinasi tinggi dan lebar saat Anda memecahnya. Di sekolah dasar, dan biasanya bahkan lebih awal, Anda mulai bekerja dengan blok bangunan dasar ini. Ada segitiga, kotak, lingkaran dan bola, segi enam dan banyak lagi. Bentuk aneh atau kurang umum dapat digunakan untuk menarik perhatian — oleh karena itu mengapa tanda berhenti dibentuk seperti itu, dalam kombinasi dengan warna merah cerah, tentu saja.

Bentuk dapat dipecah menjadi tiga jenis penting: geometris, alami dan abstrak.

• Geometris: Segitiga, kotak, persegi panjang, lingkaran, dll.
• Alam: Daun, hewan, pohon, orang, benda, dll.
• Abstrak: Ikon, gaya, representasi grafis, simbol, garis besar, dll.

Anda dapat menggunakan bentuk untuk memperluas daya tarik visual bagian, elemen, atau area. Misalnya, melampirkan ajakan bertindak di dalam tombol atau wadah lain — yang juga merupakan bentuk — adalah cara yang bagus untuk menarik perhatian. Saya suka contoh ini dari Pengoptimal Situs Web Visual :

6. Tekstur

Pada kenyataannya, kita mengenal tekstur sebagai nuansa suatu benda atau permukaan. Apakah kasar seperti beton, atau halus seperti kayu yang dipoles? Dalam desain, ini tidak cukup diterjemahkan karena Anda tidak dapat benar-benar merasakan elemen halaman atau layar. Namun, Anda dapat menunjukkan tekstur melalui tampilan suatu item.

Pola terkenal dari batu bata yang diletakkan, misalnya, dapat digunakan untuk menambah kedalaman dan ketertarikan visual pada warna solid yang lembut. Tentu, ini adalah tekstur tersirat, tetapi berfungsi sama efektifnya , terutama ketika Anda memilih gaya yang sesuai.

Anda dapat menggunakan tekstur seperti batu bata, beton, dan batu untuk menyiratkan kekuatan atau ketergantungan. Anda bisa menggunakan gaya serat kayu untuk memperindah penampilan atau keanggunan. Semuanya kembali ke bagaimana dan di mana Anda menggunakan tekstur visual, dan jenis respons emosional apa yang muncul saat Anda melihat desainnya.

Dalam satu studi kasus, badan amal yang mengumpulkan ponsel bekas menerapkan latar belakang yang kaya tekstur ke formulir pembuatan prospek mereka , dan itu meningkatkan donasi sebesar 53%. Ini adalah trik sederhana yang dapat dilakukan dengan CSS .

7. Nilai

Dalam pemasaran, kami mendefinisikan nilai sebagai sesuatu yang memberi kembali, dengan cara tertentu. Apa nilai yang melekat pada suatu produk atau komponen?

Dalam desain, nilai ditunjukkan melalui terang atau gelapnya suatu area. Gradien — populer dalam desain modern — adalah salah satu cara paling umum untuk menyajikan nilai. Biasanya berkembang dari gelap ke terang, atau padat ke transparan.

Seperti banyak komponen lain di sini, Anda dapat menggunakan nilai atau gradien untuk mengarahkan mata. Lebih penting lagi, mereka dapat digunakan untuk menekankan pentingnya tubuh atau konsep tertentu. Anda dapat menempatkan CTA Anda di bagian gradien yang paling hidup, atau mengelilingi tombol CTA Anda dalam cahaya berwarna untuk membuatnya menonjol.

Dalam contoh di bawah ini, dari desain konsep oleh Denis Absullin di Dribbble , Anda dapat melihat cahaya halus di sekitar tombol CTA untuk menambahkan produk ke troli.

Menempatkan Elemen Desain Untuk Bekerja Untuk Anda

Desain adalah komponen penting dalam keberhasilan sebuah situs web, tetapi tidak harus rumit. Cukup dengan mengingat elemen desain dapat memberikan fondasi untuk situs yang menonjol yang dapat secara efektif mempromosikan merek Anda.