Os sites de com\u00e9rcio eletr\u00f4nico ganham dinheiro quando as pessoas clicam no bot\u00e3o de checkout. Seu trabalho como gerente de com\u00e9rcio eletr\u00f4nico ou profissional de marketing \u00e9 fazer com que o maior n\u00famero poss\u00edvel de pessoas clique nesse bot\u00e3o. Todos os seus esfor\u00e7os de marketing on-line apontam para suas chamadas \u00e0 a\u00e7\u00e3o em seu site.<\/p>\n\n\n\n
Com tanto peso sendo colocado em um \u00fanico bot\u00e3o, \u00e9 importante gastar muito tempo para garantir que seus bot\u00f5es de checkout estejam fazendo seu trabalho e incentivando os visitantes a prosseguir com o processo de checkout.<\/p>\n\n\n\n
Ent\u00e3o, como voc\u00ea faz isso? A maneira mais eficaz de otimizar seus bot\u00f5es de checkout \u00e9 escolhendo bot\u00f5es com tamanho, posicionamento e cor adequados. Embora o tamanho e o posicionamento sejam vitais no processo de convers\u00e3o, alterar a cor dos bot\u00f5es de checkout pode ser um ajuste r\u00e1pido que afeta drasticamente as taxas de convers\u00e3o do seu site.<\/p>\n\n\n\n
Muitas pr\u00e1ticas recomendadas quando se trata de sele\u00e7\u00e3o de cores para sites de com\u00e9rcio eletr\u00f4nico est\u00e3o enraizadas na ci\u00eancia. Estudos de psicologia das cores revelam que certas cores propagam sentimentos diferentes nos consumidores . <\/p>\n\n\n\n
Seus bot\u00f5es de call to action e checkout est\u00e3o pressionando os bot\u00f5es psicol\u00f3gicos certos para seus clientes?<\/p>\n\n\n\n
Ou eles est\u00e3o afastando esses cliques valiosos? Nesta postagem, exploraremos algumas cores comuns para bot\u00f5es de com\u00e9rcio eletr\u00f4nico e falaremos sobre outras maneiras de melhorar a experi\u00eancia de compra com apenas algumas mudan\u00e7as simples de cor.<\/p>\n\n\n\n
Psicologia das cores<\/p>\n\n\n\n
Vamos explorar a psicologia por tr\u00e1s de algumas cores individuais e explorar como elas podem ser ben\u00e9ficas para (ou podem at\u00e9 j\u00e1 estar beneficiando) sua loja de com\u00e9rcio eletr\u00f4nico.<\/p>\n\n\n\n
Vermelho<\/p>\n\n\n\n
O vermelho \u00e9 uma cor apaixonante e cria um senso de urg\u00eancia. Um \u00f3timo exemplo dessa cor em uso est\u00e1 na Target.<\/p>\n\n\n\n
Sem surpresa, o vermelho \u00e9 a cor de destaque do site, como evidenciado pela navega\u00e7\u00e3o. Ao visualizar seu carrinho, voc\u00ea tamb\u00e9m ver\u00e1 um bot\u00e3o de checkout vermelho. A urg\u00eancia est\u00e1 espalhada por todo o site, at\u00e9 o bot\u00e3o de checkout.<\/p>\n\n\n\n
Outra raz\u00e3o pela qual voc\u00ea pode querer usar o vermelho \u00e9 o fato de que ele desperta a fome no consumidor . Pense em algumas das maiores cadeias de alimentos da Am\u00e9rica: McDonald’s, Burger King, Wendy’s, KFC, Pizza Hut, In-N-Out, Chili’s e Applebees. Todos eles apresentam marcas proeminentes ou pelo menos parcialmente vermelhas.<\/p>\n\n\n\n
Na verdade, o logotipo do Chili’s \u00e9 uma grande pimenta vermelha… o qu\u00e3o \u00f3bvio voc\u00ea consegue? Essa tamb\u00e9m \u00e9 a abordagem adotada pela Edible Arrangements.<\/p>\n\n\n\n
Eles t\u00eam vermelho polvilhado como a principal cor de chamada para a\u00e7\u00e3o em seu site, na esperan\u00e7a de fazer o cliente desejar seus produtos. Eles j\u00e1 parecem deliciosos, mas adicionar esse senso de urg\u00eancia pode ajudar a motivar o cliente a fazer uma compra agora.<\/p>\n\n\n\n
Amarelo<\/p>\n\n\n\n
Como o vermelho, o amarelo chama a aten\u00e7\u00e3o.<\/p>\n\n\n\n
Mas ao contr\u00e1rio do vermelho, o amarelo oferece aos clientes uma sensa\u00e7\u00e3o de alegria e calor em vez de urg\u00eancia . O amarelo \u00e9 usado pelos sites principalmente por dois motivos: 1. Para aliviar fardos O amarelo \u00e9 visto como uma cor agrad\u00e1vel. Web designers usam amarelo para o bot\u00e3o de checkout para fazer o consumidor se sentir melhor sobre suas compras. Voc\u00ea pode ver isso em a\u00e7\u00e3o no site de roupas infantis Crazy8. As m\u00e3es que est\u00e3o comprando para seus filhos pequenos s\u00e3o um \u00f3timo mercado para atingir com o amarelo, pois oferece a elas uma sensa\u00e7\u00e3o de calma e prazer enquanto navegam em seu site. Isso n\u00e3o \u00e9 algo que eles provavelmente experimentar\u00e3o em casa! <\/p>\n\n\n\n
2. Contraste Amarelo \u00e9 uma cor de destaque. \u00c9 facilmente contrastado com praticamente qualquer outra cor. O site mais popular para usar amarelo no bot\u00e3o de checkout \u00e9 a Amazon.<\/p>\n\n\n\n
O site, que \u00e9 maioritariamente branco, adiciona um toque de cor aqui e ali, mas \u00e9 o bot\u00e3o amarelo que mais se destaca! Isso permite que o usu\u00e1rio encontre facilmente a pr\u00f3xima etapa: prossiga para o checkout. O amarelo pode ser uma cor poderosa se usado com modera\u00e7\u00e3o.<\/p>\n\n\n\n
No entanto, voc\u00ea deve ter cuidado: quando usado em excesso em todo o site, pode afastar os clientes. O amarelo pode ser muito brilhante e avassalador, e \u00e0s vezes o associamos a ser \u201ccauteloso\u201d (como uma luz amarela em um sem\u00e1foro). Para usar o amarelo com sucesso, ele deve ser limitado apenas a elementos espec\u00edficos com chamadas para a\u00e7\u00e3o.<\/p>\n\n\n\n
\u00c9 por isso que \u00e9 mais comum apenas o bot\u00e3o de checkout.<\/p>\n\n\n\n
Verde<\/p>\n\n\n\n
Vermelho, amarelo e verde. As tr\u00eas cores associadas a um sem\u00e1foro. Para aqueles designers que n\u00e3o querem usar vermelho para o bot\u00e3o de chamada para a\u00e7\u00e3o, eles provavelmente ir\u00e3o optar pelo verde.<\/p>\n\n\n\n
Isso ocorre porque eles acreditam que, se um usu\u00e1rio vir vermelho, ele \u201cparar\u00e1\u201d. Verde \u00e9 a cor coloquial para ir! Por esse motivo, o verde \u00e9 usado como bot\u00e3o de checkout de muitos sites. A American Eagle \u00e9 um desses exemplos, exibindo um bot\u00e3o verde lim\u00e3o tanto para \u201ccheckout\u201d quanto para a aplica\u00e7\u00e3o de c\u00f3digos de cupom.<\/p>\n\n\n\n
Embora alguns sites prefiram desviar a aten\u00e7\u00e3o dos c\u00f3digos de desconto, a AE opta por torn\u00e1-los t\u00e3o vis\u00edveis quanto o bot\u00e3o de checkout, o que pode ajudar a criar uma sensa\u00e7\u00e3o de lealdade ou felicidade do cliente. \u00c9 uma estrat\u00e9gia bem pensada, embora talvez n\u00e3o seja para todos. O varejista de vitaminas Vitacost tamb\u00e9m conta com o verde para motivar os clientes a adicionar itens ao carrinho.<\/p>\n\n\n\n
Mas, como a AE, eles optam por usar essa cor viva para motivar compras adicionais – procure a op\u00e7\u00e3o \u201ccomprar os dois juntos\u201d no canto inferior direito. Isso pode motivar os clientes a agrupar produtos e comprar mais do que antes. Como o verde tamb\u00e9m \u00e9 visto como uma cor que simboliza a natureza e a sa\u00fade, \u00e9 comumente usado em sites e com marcas que oferecem benef\u00edcios \u00e0 sa\u00fade, como varejistas de vitaminas, lojas de produtos naturais e assim por diante.<\/p>\n\n\n\n
O verde pode ajud\u00e1-lo a se sentir bem ao fazer sua compra, j\u00e1 que voc\u00ea est\u00e1 ajudando a si mesmo ou ao meio ambiente.<\/p>\n\n\n\n
Cores e tamanhos contrastantes<\/p>\n\n\n\n
Enquanto alguns sites se inclinam para o vermelho e o amarelo para o bot\u00e3o de checkout por conta dos aspectos psicol\u00f3gicos que a cor traz, outros web designers acreditam na arte do contraste para chamar a aten\u00e7\u00e3o do consumidor. Um estudo do Journal of Product Innovation Management revelou que os consumidores tendem a ser mais rapidamente atra\u00eddos por produtos que se destacam de outras cores pr\u00f3ximas. Acontece que o mesmo pode ser dito para os bot\u00f5es de checkout.<\/p>\n\n\n\n
Trabalhe com seu esquema de cores existente para criar bot\u00f5es de checkout que se destaquem de outros elementos do seu site. Muitos sites populares usam essa abordagem. A Amazon e o Walmart seguem esse caminho com seus sites.<\/p>\n\n\n\n
Por exemplo, o Walmart usa grandes frases de chamariz laranja em seu site. Isso contrasta drasticamente com o esquema de cores azul e branco pelo qual sua marca \u00e9 conhecida. Quando os varejistas \u201cBig Box\u201d como o Walmart est\u00e3o fazendo do contraste um grande foco de seu site, \u00e9 algo que definitivamente est\u00e1 funcionando bem.<\/p>\n\n\n\n
Voc\u00ea pode ver essa t\u00e1tica em a\u00e7\u00e3o em um grande n\u00famero de outros sites, incluindo eBay, American Eagle, Kohl’s e assim por diante.<\/p>\n\n\n\n
\u201cTeste, teste, 1-2-3\u201d<\/p>\n\n\n\n
Voc\u00ea fez as altera\u00e7\u00f5es nos bot\u00f5es de adicionar ao carrinho e finalizar a compra, mas n\u00e3o tem certeza se a devolu\u00e7\u00e3o ser\u00e1 o que voc\u00ea est\u00e1 planejando. Como voc\u00ea verifica qual bot\u00e3o o consumidor prefere? Existe alguma maneira de realmente saber se suas mudan\u00e7as s\u00e3o eficazes?<\/p>\n\n\n\n
E quanto \u00e0 possibilidade de realmente afastar os clientes? <\/p>\n\n\n\n
Gra\u00e7as ao Google e suas infinitas ferramentas, tenho uma resposta para voc\u00ea. As Experi\u00eancias de conte\u00fado do Google permitem que voc\u00ea compare o desempenho de diferentes p\u00e1ginas da web usando um grupo aleat\u00f3rio de seus visitantes.<\/p>\n\n\n\n