Como ter um design de site coerente

Já criaste o teu site, mas ficou muito com a cara do tema que escolheste e não conseguiste transmitir a tua identidade visual? Isso é porque provavelmente não definiste o design da tua marca desde o início e foste personalizando e descobrindo coisas giras que davam para fazer à medida que mexias nas definições. Ficaste com um site, mas com um design pouco coerente…

Não sou nada contra explorar aliás, acho que é mesmo assim que se aprende, ir mexendo e descobrindo coisas novas! Mas no que toca ao teu site, não queres que ele tenha um design feito “à sorte”.

Se queres tomar o controlo do teu site e torná-lo teu, continua a ler para saberes o que tens de fazer.

Procura por inspiração para o design do teu site

Qual é o feeling que queres transmitir com o teu website? Queres transmitir alegria, diversão e jovialidade? Diria que cores brilhantes e tipos de letra modernos seriam uma boa aposta. Cria um álbum no Pinterest e reúne as cores, tipos de letra e o estilo de site que mais tem a ver com a tua marca.

Determina também os tipos de páginas que pretendes ter no teu site. Por exemplo, queres ter uma página de contactos ou uma loja online? Vai guardando exemplos de design de sites com a estrutura que pretendes para o teu site.

Se tiveres isto definido, quando andares à procura de um tema para o teu site em WordPress, já sabes que vais ter de ver se tem páginas com formulário de contacto ou então página de produtos, no caso da loja online.

Cria um Guia da Marca para o design do teu website

Cria um Guia da Marca, ou Brand Guide, que é basicamente um documento onde tens especificado o design do teu site ou seja, os tipos de letra dos títulos, subtítulos e corpo de texto, cores e elementos do design.

Vais ver que te vais sentir muito mais organizado(a)! Eu bem sei que quando comecei a fazer o design do meu me sentia perdida num mar de opções. Ter essa linha guia foi essencial para não perder o foco!

Atenta que não precisas de usar os mesmos tipos de letra e cores do teu tema. Aliás, se o tema for gratuito então o melhor mesmo é mudares isso tudo, porque a probabilidade de haver mais sites parecidos é muito maior!

Usa até 3 tipos de letra

Se não és um(a) pro a design, o melhor mesmo é limitares-te até 3 tipos de letra. Sugiro um tipo de letra fácil de ler para o corpo de texto, um mais chamativo para os títulos e um terceiro, se quiseres, para dar um realce em algumas situações.

No meu site eu uso apenas dois. “Josefin Sans” para os títulos e subtítulos, e vou variando os pesos. Para o corpo de texto uso “Lato”.

Se quiseres até podes usar só um e criar variação no estilo, transformar e decoração. Sites de grandes empresas tecnológicas, como a Apple ou a Microsoft, só usam um tipo de letra em todo o website e variam os outros aspetos que falei atrás.

Adiciona hovers nos links e botões

O estado hover é o comportamento de elementos como por exemplo, links ou botões, quando passas o cursor por cima. Eu vejo tantos websites em que se esquecem de fazer isto e acho que é essencial para a experiência do utilizador.

O utilizador, quando passa o cursor por cima de um destes elementos, espera naturalmente que haja uma reação, que mude de cor, que apareça um sublinhado, que aconteça algo diferente. Algo que diga que clicar ali vai gerar uma ação.

A tua página inicial é que dita o design geral do teu site

A página inicial é o cartão de visita do teu site e é a primeira página que os visitantes veem quando entram no teu site. Portanto, ela deve ter todas as fontes, cores e elementos de design que vais usar ao longo do teu website. Isto porque não queres que o visitante do teu site entre numa página e seja distraído por um design que apareceu de surpresa.

Fontes, cores e elementos de design inesperados vão interromper a experiência do utilizador, fazendo com que ele perca o foco do conteúdo para prestar atenção ao design. Se o teu website tiver sempre a mesma linguagem a nível de design, o visitante só terá de se focar no conteúdo.

O objetivo do teu site é manter o visitante o maior tempo possível, porque assim o Google vê que o teu site tem conteúdo importante e vai promovê-lo na primeira página de resultados.

Dica extra: Certifica-te de que a tua página inicial está adaptada a todos os dispositivos. Depois disto, é só replicares o design nas outras páginas.

Muda as opções do tema e do pagebuilder

Certifica-te de que editas as opções gerais do tema em Apresentação > Personalizar, mas também no pagebuilder, se estiveres a usar algum. No Elementor, tens de clicar no ícone do menu (3 linhas) e depois em “Site settings”. Aí vais conseguir editar as cores da tua marca, as fontes utilizadas para os títulos, subtítulos e corpo de texto, os botões, etc.

É muito chato fazer isto tudo “à mão”… Poderás eventualmente ter de mudar alguns individualmente, mas a maior parte fica automatizado. É só clicares no ícone do globo e selecionares uma das opções que definiste anteriormente (ver imagem).

Espaço negativo ou espaço em branco

O espaço negativo ou espaço em branco, não é nada mais do que espaço vazio. Ele é muito importante porque separa o conteúdo, facilita a leitura e permite que o leitor se consiga focar numa coisa de cada vez.

Espero que estas dicas te tenham ajudado a melhor o design do teu site e que o mesmo tenha ficado mais coerente. Tens mais alguma dica que não falei aqui? Partilha em baixo nos comentários.