Botões e chamadas para ação ocupam relativamente pouco espaço, mas são alguns dos elementos de design mais importantes de qualquer site. Dado o quão importante é, obter botões e ação direta é um grande negócio. No entanto, projetar botões pode ser complicado. Há muitos fatores de design a serem considerados ao projetar um botão – tamanho, cor, ícone, forma, posicionamento e texto – e um botão de call-to-action é ainda mais crítico para acertar.
Neste artigo, abordaremos os conceitos básicos de design de botões para o seu site WordPress. Também consideraremos fatores a serem considerados quando seu botão for usado como parte de um apelo à ação. Por fim, forneceremos o código que você pode usar para criar o botão nesta serie de post e videos.
Três princípios para projetar botões de site eficazes Vamos começar com o básico. Se você deseja criar botões eficazes, precisa seguir algumas práticas recomendadas. Essas práticas recomendadas podem parecer senso comum, mas é porque são. No entanto, se você nunca pensou no design de botões antes, pensará que está violando alguns desses princípios.
Princípio nº 1: Os botões devem se parecer com botões!
Para que o design do site funcione como pretendido, os botões precisam ser fáceis de selecionar.
Embora nem todos gostem do Material Design do Google. O botão deve se destacar. Botões ambíguos podem ter taxas de cliques significativamente mais baixas.
Princípio nº 2: As ações dos botões devem ser limpas Ao projetar botões, as ações associadas a cada botão devem ser claras.
Use o texto ou os ícones nos botões para descrever de forma clara e concisa o que cada botão foi projetado para fazer. Você não precisa fazer isso com texto. Às vezes, os ícones podem ser tão eficazes.
Princípio nº 3: O design do botão deve ser consistente Terceiro, ao criar botões, certifique-se de que todos os botões que executam ações semelhantes tenham um design semelhante.
Arquivo CSS:
Acesse nosso blog ! E Siga-nos em nossas redes sociais Facebook : @johnpiresdev e Instagram: @johnpiresdev.
Manda uma estrelinha la no Github.