Como criar um site para sua marca

Criar o próprio site é ótimo para deixar sua marca pessoal ou empresa acessível e transmitir sua mensagem ao o mundo, seja ela qual for. Ele representa um marco importante na criação de uma presença pública — o lançamento do site oficializa a ideia para que todos vejam. Continue lendo para conferir dicas essenciais no design de sites e, assim, criar uma presença on-line eficaz com tranquilidade.

Selecione as cores, a tipografia e os gráficos do seu site

Elementos estéticos, como paleta de cores, ícones e fontes, são as bases da sua marca on-line. Veja o que chama a atenção do seu público e crie um web design chamativo para ele. No fim das contas, esses elementos de design padronizarão a sua marca e a deixarão mais marcante.

Escolha uma paleta de cores

A cor pode dar automaticamente aos visitantes do seu site uma noção da sua marca, seja ela ousada e colorida, silenciosa e calma, ou algo no meio. Ao abrir uma empresa on-line, dê uma olhada nas paletas de cores que a concorrência usa e, assim, achar oportunidades de diferenciar sua marca e seus produtos. Teste diferentes combinações de cores para ver como elas dão vida à sua marca. Mantenha a simplicidade e não exagere, mas se divirta com as combinações.

Leia nosso guia completo para escolher as cores da marca

Selecione as fontes do site

No design de sites, saber usar a tipografia é tão importante quanto a fotografia e as imagens. Fontes bem escolhidas dizem muito ao seu público sobre a sua marca, além de serem importantes na acessibilidade e na legibilidade on-line. A fonte script ou serif, por exemplo, é mais fácil de ler e recomendada para textos maiores, como um título. Já a fonte sans serif é útil nos textos de corpo e outros textos longos. 

Não há regras rígidas sobre quando ou onde usar uma determinada fonte. Porém, é importante testar os textos e garantir que os visitantes do site tenham facilidade para ler o conteúdo do site.

Confira nosso guia completo para escolher as fontes

Escolha ícones úteis e nítidos

Ícone é a representação visual de uma palavra ou ideia. Ele é incrivelmente útil nos sites, onde os usuários precisam de informações rápidas para navegar pelo conteúdo.

Setas nos dois lados de uma imagem, por exemplo, indicam uma galeria de fotos nas quais as pessoas podem clicar. Da mesma forma, um botão de chamada para ação (CTA) indica às pessoas que clicar nele significa fazer algo decisivo - ação conhecida como “conversão”.

Faça um design com a experiência do usuário (UX) em mente

Experiência do usuário (UX) é a experiência geral de alguém ao clicar no seu site. Uma boa experiência do usuário é determinada pela facilidade da navegação no site e se as pessoas encontram o que precisam, não importa onde estão no site. O planejamento da UX segue quatro estágios.

1. Pesquisa

Para começar, identifique comportamentos, gostos e as atuais barreiras que o público-alvo tem para fechar a compra. Quanto mais você entender o público, mais você pode moldar o site para atraí-lo. Você também pode pesquisar a concorrência direta e ter uma ideia do conteúdo que eles oferecem ao público deles - e o que o seu público pode esperar de você.

2. Wireframe

Em seguida, crie um visual geral, ou “representação aramada”, de todo o site. Assim como a planta de uma casa, a representação aramada mostra como diferentes áreas do seu site se interligam para você definir o tamanho do site. Com a representação aramada, você pode decidir, por exemplo, que o site só precisa de três páginas, como "Sobre", "Loja" e "Contato"; ou descobrir que precisa de páginas separadas para produtos, projetos de portfólio ou outras informações.

Ao criar a representação aramada, você também pode posicionar, estrategicamente, botões de CTA para incentivar as pessoas a navegar, comprar, aprender mais ou realizar outra ação em prol das suas metas de negócios.

Confira o guia para criar um wireframe para o seu site

3. Testando

Terminada a representação aramada, mostre-a para as pessoas e peça feedback. Você pode lançar uma versão fechada do seu site e convidar membros do seu público-alvo para testá-lo. Solicite feedback sobre o visual em geral, a facilidade em navegar e a simplicidade na compra. Ao incorporar o feedback deles, você evitar problemas na hora de lançar o site.

4. Implementação

Na etapa final, coloque em prática tudo o que você aprendeu na fase de testes. Implementação significa concluir o mapa do site, desenvolver a representação aramada, corrigir as falhas e garantir que todo o conteúdo final esteja pronto para o lançamento.

Confira nossos princípios essenciais de design

Faça um site responsivo para versão móvel

Como muitas pessoas acessam a Internet pelo aparelho móvel, o design do site precisa ter responsividade móvel, de forma que seja tão fácil de usar no celular, tablet, no desktop e no laptop. O design chamado "mobile-first" prioriza telas menores: ele reduz o conteúdo ao essencial, cria menos páginas, mantém os arquivos pequenos e apresenta mensagens concisas, por exemplo. Ao começar pequeno, fica mais fácil adaptar o design do site para as telas maiores do desktop. 

Muitos templates de site também têm recursos integrados de design responsivo para que o site fique igual nas telas de todos os tamanhos. Com um template de site do Squarespace, o seu site se adapta automaticamente a telas de diferentes tamanhos. Graças ao recurso "arrastar e soltar", o Editor Intuitivo do Squarespace usa grades para você editar a versão móvel do seu site separadamente da versão para desktop - e sem código. Assim, você pode fazer qualquer atualização das melhores práticas para criar uma rolagem mais concisa e eficaz na versão móvel, mas sem abrir mão da integridade do seu site para desktop. 

O design de um site "mobile-first" começa com a criação de uma “hierarquia visual do conteúdo”. Faça uma lista dos conteúdos em ordem de importância e decida o que vale a pena incluir no seu espaço limitado. O logotipo e os botões de CTA, por exemplo, devem ser prioridade, pois garantem o reconhecimento da marca e a conversão do cliente.

O site "mobile-first" também tem uma classificação mais alta nos resultados dos buscadores, pois eles leem primeiro a versão móvel dos sites. Portanto, ao otimizar o seu site para celular, ele também é otimizado para os buscadores.

Crie uma página de destino que envolva o cliente 

Página de destino é a primeira página que os visitantes veem ao acessarem o seu site após clicarem em um anúncio ou e-mail; ou via buscadores, como o Google. Ela não precisa ser a página inicial, que atua como o hub de navegação do seu site. A página de destino deve estimular a ação imediata do cliente - e faz isso de duas maneiras:

• Gerando leads. A página de geração de leads coleta dados sobre os visitantes do site; para isso, ela oferece incentivos como uma assinatura de newsletter por e-mail; código de desconto; conteúdo para download, como um e-book gratuito; ou outros recursos, em troca de informações pessoais, como nome e endereço de e-mail.

• Incentivando o clickthrough. A página de destino com clickthrough estimula a conversão do usuário com um botão que leva diretamente ao local (no seu site) que oferece serviços, como uma página com a visão geral de um produto ou uma página de agendamentos.

Seja qual for a página de destino do seu site, você pode aprimorá-la — teste dois designs diferentes e veja qual deles gera mais conversões. Por exemplo: você pode enviar visitantes oriundos da campanha de um produto nas mídias sociais para uma versão da página de destino, enquanto outra campanha leva a outra.

Seja como os usuários acessarem a página, garanta que o texto e o design do seu site incentivem uma ação específica, seja para que as pessoas informem um endereço de e-mail, comprem um produto ou leiam o conteúdo do seu blog. Use imagens chamativas e CTAs claros para atrair a atenção dos visitantes e direcioná-los para a ação desejada assim que eles chegarem ao site.

Considere contratar um web designer

Se você quiser colaborar na visão do seu site, considere contratar um designer profissional. Antes de contratar, avalie fatores como a largura de banda, o tempo até a data prevista para lançamento e suas metas e objetivos gerais. 

Um construtor de sites como o Squarespace oferece um site personalizado com qualidade profissional e fácil de configurar, sem a despesa de contratar um profissional. Essa opção também traz rapidez e flexibilidade — você pode iniciar rapidamente, adaptar e atualizar o site facilmente à medida que sua empresa evolui.

Pronto para iniciar o processo de design? Aprenda a criar a página inicial de um site.