Cara Memilih Warna untuk Situs E-commerce Anda

Saya sering bertanya kepada pemilik bisnis e-commerce tentang pilihan warna untuk toko mereka. Sebagian besar jawabannya mirip dengan “Saya suka warna-warna ini dan berpikir itu akan terlihat bagus,” atau “Desainer saya yang membuatnya.” Jika Anda memilih warna, Anda kehilangan peluang besar untuk menyampaikan kepribadian merek Anda kepada pelanggan Anda.

Studi tentang bagaimana warna mempengaruhi pikiran bawah sadar disebut “psikologi warna.” Warna adalah komunikasi. Melalui pengkondisian sosial, kita belajar mengaitkan warna dengan emosi, konsep, tindakan, dan kualitas. Berikut adalah konsep yang paling penting ketika memilih atau mengubah skema warna toko Anda.

1. Gunakan Psikologi Warna untuk Keuntungan Anda

Anda membutuhkan pemahaman tentang perasaan dan emosi yang berbeda-beda. Berikut adalah beberapa interpretasi umum untuk warna dasar. Ada berbagai interpretasi, makna, dan persepsi antara budaya dan konteks.

  • Merah. Perhatian, kegembiraan, kemarahan, cinta, kehangatan, kenyamanan, kehidupan, darah, berhenti.
  • Kuning. Petualangan, kebahagiaan, kompetensi, antusiasme, kekayaan, kecanggihan.
  • Hijau. Keseimbangan, selera yang baik, iri hati, kesehatan, uang, harmoni.
  • Biru. Kejujuran, perusahaan, kualitas tinggi, maskulin, kompetensi, dingin, kesetiaan, kepercayaan, keandalan.
  • Merah Jambu. Cinta, kasih sayang, kecanggihan, ketulusan, romansa, kelembutan.
  • Violet dan ungu. Kreativitas, otoritas, pendayung, royalti, rasa hormat, misteri.
  • Cokelat. Keramahan, ketangguhan, kesedihan, kenyamanan, organik, alami.
  • Hitam. Kesedihan, kecanggihan, mahal, cerdas, mati, melangsingkan.
  • Putih. Kesederhanaan, ketertiban, kepolosan, kemurnian, kebersihan, netralitas.
  • Abu-abu dan perak. Keabadian, kepraktisan, netralitas, penyempurnaan, kontemporer.

2. Gunakan Warna yang Sesuai untuk Pasar dan Produk Anda

Warna tertentu menarik bagi pasar tertentu. Beberapa warna lebih cocok untuk produk mewah sementara yang lain lebih cocok untuk makanan. Psikologi warna bukanlah ilmu pasti, tetapi Anda dapat memanfaatkannya untuk bergerak ke arah umum di situs Anda. Berikut ini beberapa contohnya.

  • Mercedes. Mercedes memiliki palet hitam yang kuat dan sederhana (mahal dan canggih), abu-abu (halus), dan putih (bersih). Asosiasi ini sesuai untuk pelanggan target Mercedes: orang-orang kaya yang mungkin ingin dilihat sebagai orang yang terhormat dan penting.

    Mercedes menggunakan palet hitam, abu-abu, dan putih untuk menunjukkan kecanggihan, penyempurnaan, dan kebersihan.

  • Disney. Situs Disney menggunakan feel yang berbeda, karena target demografinya adalah anak-anak dan orang tua – kebanyakan ibu. Anak-anak cenderung menyukai warna-warna cerah dan sederhana. Wanita cenderung menyukai warna-warna lembut. Disney menggunakan warna-warna cerah dan sederhana untuk menargetkan anak-anak dan orang tua mereka.
  • Victoria’s Secret. Victoria’s Secret menampilkan nuansa merah muda (romansa dan kelembutan), sempurna untuk target pasar wanita yang tertarik pada pakaian dalam dan produk kecantikan.

    Victoria’s Secret menggunakan nuansa pink untuk menyampaikan romansa dan kelembutan.

Perhatikan skema warna dari toko online yang Anda kunjungi. Kemudian, pikirkan tentang rencana yang Anda akan buat di situs Anda sendiri, melalui warna yang Anda pilih.
Perhatikan bagaimana warna-warna tersebut cocok satu sama lain dan bagaimana rasanya. Apakah mereka memberi energi, menenangkan, atau netral? Apakah warna Anda saling bertentangan, atau apakah mereka selaras dengan merek Anda?
Jika Anda tidak yakin, tetap menggunakan warna-warna yang menenangkan  seperti blues, grey, dan white, atau lawan dari warna-warna cerah dan mencolok seperti merah, kuning, dan ungu.

3. Gunakan Efek Isolasi

Efek isolasi, juga dikenal sebagai efek von Restorff, menyatakan warna yang menonjol lebih mungkin diingat. Misalnya, jika seseorang melihat daftar kata yang diketik dalam warna hitam dengan satu kata yang disorot dengan warna ungu, dia kemungkinan akan mengingat kata ungu daripada yang hitam.

Gunakan ini untuk keuntungan Anda dengan memiliki satu warna yang merupakan warna isolasi toko Anda. Gunakan warna itu hanya di tempat-tempat yang Anda ingin ditonjolkan. Misalnya, jika hijau adalah warna isolasi Anda, gunakan hanya pada tombol add-to-cart dan tautan teks yang mengarah pada proses penjualan Anda.

Dengan tetap konsisten dengan pola penggunaan warna ini, Anda melatih pengunjung Anda untuk mengklik ketika mereka melihat warna isolasi Anda. Ini adalah cara yang halus namun kuat untuk menjaga pelanggan Anda untuk melakukan pembelian.

Dell menggunakan warna isolasi hijau untuk memandu pengunjung situs. Dalam contoh di atas, Dell secara efektif menggunakan warna hijau sebagai warna isolasi dengan menggunakannya hanya di tempat yang mengarahkan pengunjung melakukan pembelian.

BarStools.com menggunakan warna isolasi oranye untuk memandu pengunjung situs. BarStools.com memilih oranye sebagai warna isolasi. Ini muncul hanya pada tombol Select Options, Add to Cart, dan Checkout – yaitu, yang mengarahkan pelanggan selama proses pembelian.

4. Pilih Warna Latar Belakang

Putih dan abu-abu terang adalah warna paling baik untuk latar belakang karena memberikan kontras untuk sebagian besar warna tanpa mengganggu tampilan lain. Sebagian besar toko menggunakan warna terang untuk latar belakang mereka.

Latar belakang berwarna terang dapat mengkontraskan warna.

Latar belakang gelap memiliki tampilan yang baik jika Anda memiliki produk dan teks yang sangat cerah.

Gaya ini berfungsi untuk Foot Locker mengingat warna-warna cerah dan bentuk sederhana dari produk-produknya serta demografis target yang maskulin.

Untuk diingat, menjaga situs web Anda tetap bersih dan sederhana dengan menggunakan tidak lebih dari tiga warna utama. Anda dapat menggunakan beberapa corak berbeda dari warna-warna utama ini untuk memberi aksen pada toko Anda.

Saat memilih skema warna Anda, pikirkan di luar warna favorit Anda. Skema warna Anda mengomunikasikan kepada pengunjung Anda tentang nilai-nilai dan kepribadian toko Anda.



 

How to Choose Colors for your Ecommerce Site

I often ask ecommerce business owners about the color choices for their stores. Most of the answers are similar to “I like these colors and thought they would look nice,” or “My designer came up with it.” If that is how you pick your colors, you are missing a huge opportunity to convey the personality of your brand to your potential customers and shape their experience with your store.

The study of how colors affect the subconscious mind is called “color psychology.” Colors are communications. Through social conditioning we learn to associate colors with emotions, concepts, actions, and qualities. For example, Americans associate the color red with the action of paying attention because traffic stop signs and danger signs are generally red. Because of this association, using red text when flashing an error message in your shopping cart is an effective way of getting your customer’s attention.
Here are the most important concepts when choosing or changing the color scheme of your store.

1. Use Color Psychology to your Advantage

You need an understanding of which feelings and emotions different colors evoke. Here are some common interpretations for the basic colors. There are varying interpretations, meanings, and perception between cultures and contexts.

  • Red. Attention, excitement, anger, love, warmth, comfort, life, blood, stop.
  • Yellow. Adventure, happiness, competence, enthusiasm, wealth, sophistication.
  • Green. Balance, good taste, envy, health, money, harmony.
  • Blue. Honesty, corporate, high quality, masculinity, competence, coldness, loyalty, trust, reliability.
  • Pink. Love, compassion, sophistication, sincerity, romance, gentleness.
  • Violet and purple. Creativity, authority, rower, royalty, respect, mystery.
  • Brown. Friendliness, ruggedness, sadness, comfort, organic, natural.
  • Black. Grief, sophistication, expensive, intelligent, death, slimming.
  • White. Simplicity, order, innocence, purity, cleanliness, neutrality.
  • Gray and silver. Timelessness, practicality, neutrality, refinement, contemporary.

2. Use Appropriate Colors for your Market and Products

Certain colors appeal to certain markets. Some colors are more appropriate for luxury products while others are more appropriate for food items. Color psychology is not an exact science but you can leverage it to move in a general direction on your site. Here are some examples.

  • Mercedes. Mercedes has a strong and simple palette of black (expensive and sophisticated), gray (refined), and white (clean). These associations are appropriate for Mercedes’ target customers: wealthy people who presumably want to be seen as distinguished and important.

    Mercedes uses a black, gray, and white palette to show sophistication, refinement, and cleanliness.

  • Disney. The Disney site uses a different feel, as its target demographic is children and parents — mostly mothers. Children tend to prefer bright, simple colors. Women tend to prefer soft colors. Disney’s bright blues (reliability) and muted grays (contemporary, timelessness) appeal to both demographics.Disney uses bright, simple colors to target children and their parents.
  • Victoria’s Secret. Victoria’s Secret features shades of pink (romance and gentleness), which speaks perfectly to its target market of women interested in lingerie and beauty products.

    Victoria’s Secret uses shades of pink to convey romance and gentleness.

Pay attention to the color schemes of the online stores you visit. Then, think about the experience you are creating, on your own site, through the colors you choose.
Notice how those colors fit together and how they feel. Are they energizing, calming, or neutral? Do your colors work against each other, or do they send complementary messages?
If you’re unsure, the safest bet is to stick to calming and reserved colors like blues, gray, and white, as opposed to vibrant and flashy colors like red, yellow, and purple.

3. Use the Isolation Effect

The isolation effect, also known as the von Restorff effect, states that an item — in this case a color — that stands out is more likely to be remembered. For example, if someone looks through a list of words typed in black with one word highlighted in purple, she will likely remember the purple word more than the black ones.

Use this to your advantage by having one color that is your store’s isolation color for your calls-to-action, add to cart, opt-in, and other links. Use that color only in places that you want to stand out. For example, if green was your isolation color, use it only on your add-to-cart buttons and the text links that lead your customers directly through your sales process.

By staying consistent with this color usage pattern, you are training your visitors to click when they see your isolation color — green in this example. This is a subtle yet powerful way of keeping your customers moving toward purchasing. It’s like giving them subconscious trail markers to follow.

Dell uses a green isolation color to guide site visitors.
In the examples above, Dell effectively uses green as the isolation color by using it only in the places that lead visitors down the purchase funnel.

BarStools.com uses an orange isolation color to guide site visitors.
BarStools.com chose orange as its isolation color. It appears only on the Select Options, Add to Cart, and Checkout buttons — i.e., those that move customers along the purchase process.

4. Choose a Background Color

Whites and light grays are best for backgrounds as they provide contrast for most colors without being distracting. Most stores use a light shade for their backgrounds.

Light colored backgrounds can help with color contrast.

Dark backgrounds can work well if you have very bright products and text.

Dark backgrounds work well if you have bright products and text on your site.

This style works for Foot Locker given the bright colors and simple shapes of its products and the masculine target demographic.

As a rule, keep your website clean and simple by using no more than three main colors. You can use a few different shades of these main colors to accent your store, but generally less is more.
When choosing your color scheme, think beyond your favorite colors. Your color scheme communicates to your visitors about the values and personality of your store.