Qual é a parte mais importante de um site? O conteúdo? As imagens? Como ele é estruturado? Ou o conjunto de recursos que definem a sua usabilidade e facilidade de navegação? Se você analisar os sites de diferentes perspectivas, todas essas opções estão corretas. Mas um recurso crucial, que diferencia seu site dos demais, não pode ser esquecido: o cabeçalho.
O cabeçalho do site é como uma coroa na cabeça de uma pessoa. Demonstra autoridade, significado e torna o usuário uma personalidade mais proeminente. Um design de cabeçalho deve ser uma combinação de recursos visuais e funções e, na maioria das vezes, é a parte mais bem planejada de um site.
Neste artigo, falaremos sobre o que é um cabeçalho de site e por que ele é importante. Também listaremos as melhores práticas e dicas para criar um cabeçalho para sua página.
O que é um cabeçalho de site
Imagem retirada do site Oriana Castro
O cabeçalho do site fica na seção superior do seu site, daí a palavra “cabeçalho”. Ele tem vários propósitos, especialmente voltado aos usuários online. Em primeiro lugar, é uma seção onde o logotipo de uma empresa é colocado (às vezes o nome também é incluído). Em segundo lugar, possui um conjunto de menus que os usuários podem usar para navegar pelo site. Por fim, ele serve como um “caminho” que indica onde as páginas do seu site estão e como chegar até elas.
Esta seção é geralmente idêntica a todas as páginas; no entanto, em alguns modelos o cabeçalho do site é ligeiramente diferente na página inicial. Isso porque a intenção é dar destaque para as outras áreas do site.
Recursos comuns de um cabeçalho de site
Os cabeçalhos do site são geralmente compostos por vários elementos. Existem cabeçalhos fixos que permanecem na mesma posição e nunca se movem, independentemente de qual página da web o usuário esteja visualizando. Há também cabeçalhos flutuantes que dão a ilusão de estar seguindo você enquanto você navega pela página.
Antes de adicionar recursos comuns a um cabeçalho, você deve primeiro identificar o tipo de cabeçalho que você deseja. Você quer um fixo ou um flutuante? Para ajudá-lo a escolher o melhor para o seu site, considere o seguinte:
- Classificação do site (e-commerce, portfólio online, serviços, etc.);
- Objetivo de marketing;
- Metas do site (por exemplo, aumentar a taxa de conversão);
- Estrutura e organização do conteúdo.
Confira abaixo alguns recursos comuns de cabeçalho de site que você vê com frequência em diversas páginas da web:
- Logotipo
Um cabeçalho geralmente tem o logotipo do site ou da empresa. O objetivo de adicionar um logotipo no cabeçalho é estabelecer a sua identidade. Além dos objetivos da marca, adicionar um logo também cria distinção e reconhecimento.
O logotipo geralmente é colocado no canto superior esquerdo do cabeçalho. Outra opção é adicionar o nome da sua empresa no lugar do logo. Dependendo das suas preferências, você pode até mesmo adicionar os dois. Apenas certifique-se de que cada um tenha espaço suficiente para ser visualizado e lido.
- Navegação
Imagem retirada do site Peckham Coal Line
Navegação é o menu que contém links para pular de uma página para outra. Isso é o que os visitantes usarão para navegar pelo seu site. Você também pode usar menus suspensos se houver páginas diferentes na mesma categoria.
Quer saber como criar um recurso de navegação perfeito? Falaremos mais sobre isso nas próximas seções.
- Carrinho de compras
Esse recurso é muito útil, especialmente se você tiver um site de comércio eletrônico. O carrinho de compras permite que os usuários confiram quais itens foram adicionados aos seus carrinhos. Por isso, se você estiver lançando uma loja online, não se esqueça de adicionar um recurso de carrinho de compras no cabeçalho do site.
- Pesquisa
É difícil não notar uma caixa de pesquisa no design de cabeçalho do site. Esse recurso é muitas vezes simbolizado pela imagem de uma lupa, e permite que os usuários consigam realizar pesquisas na página. Ao contrário da navegação, a pesquisa segmenta especificamente determinadas palavras em seu site. Geralmente, ela é colocada no canto superior direito do cabeçalho do site. Adicionar esse recurso tornará a experiência do usuário muito melhor.
- Perfil de usuário
Para o plano de fundo do seu cabeçalho, muitas vezes é preciso adicionar um recurso de perfil de usuário. E para que serve isso? Você pode adicionar esse recurso se estiver lançando um site que precisa de membros, como uma loja online ou uma plataforma de rede social. Além disso, ele dá ao utilizador muito mais controle sobre as suas preferências.
Importância de ter um excelente cabeçalho de site
Confira a seguir alguns benefícios de possuir um ótimo cabeçalho:
1. Ajuda na otimização de mecanismos de pesquisa
Ter o melhor cabeçalho significa que você precisa se esforçar para direcionar seu tráfego. Tráfego de alta qualidade é a chave para melhores leads e, potencialmente, maior receita.
2. É ótimo para usuários de dispositivos móveis
Navegar em sites pode ser mais difícil usando telas menores. Adicionar um cabeçalho tornará a experiência muito mais fácil na navegação móvel.
3. Torna as páginas da web mais fáceis de localizar
Com um cabeçalho, os usuários sabem exatamente onde estão. Se eles quiserem mudar para uma seção diferente, tudo o que precisam fazer é verificar as opções disponíveis no cabeçalho do site.
Dicas sobre como fazer um bom cabeçalho do site
Deseja criar um excelente cabeçalho? Dependendo do que você pretende alcançar com o seu site, será preciso seguir algumas práticas. Existem também algumas dicas que podem ou não funcionar na sua página. Lembre-se: os cabeçalhos do site devem depender da estrutura e dos objetivos da página web, e não o contrário.
1. Simplifique, mas dê destaque a um recurso específico
Dê uma olhada no cabeçalho do site Pet Milestone Cards. É muito simples e direto. Sequer possui elementos que o separam do resto da página inicial.
O logotipo foi adicionado no cabeçalho do site — no canto superior esquerdo — enquanto o restante dos menus está bem espalhado na parte superior.
Imagem retirada do site Pet Milestone Cards
Mas se você analisar o botão "Comprar agora" (“Buy now” em inglês), verá que ele está em amarelo, o que o destaca do restante do conteúdo. Olhando apenas para o cabeçalho do site, é evidente que o objetivo deles é aumentar as vendas dos produtos.
Portanto, certifique-se de enfatizar certos recursos do seu cabeçalho que o ajudariam a alcançar seus objetivos.
2. Adicione um menu suspenso para páginas com conteúdos semelhantes
No começo do artigo falamos sobre navegação. Além de usar links na parte superior do site, você também pode adicionar um menu suspenso para cada navegação.
Imagem retirada do site Fighting Pretty
Um bom exemplo de menus suspensos são os usados pelo Fighting Pretty. Como você pode ver na imagem acima, os menus podem ser estendidos para visualizar páginas específicas. Basta passar o mouse sobre cada um deles e você verá o restante das informações.
O site Fighting Pretty também utilizou outros princípios de um excelente cabeçalho. Eles adicionaram
3. Uma imagem de fundo cativante e um cabeçalho do site minimalista
Normalmente, colocar uma imagem de cabeçalho para incrementar os recursos visuais não é uma boa ideia. Mas, às vezes, você pode tornar seu cabeçalho mais simples, menor e menos perceptível para dar lugar a uma ótima imagem de fundo.
Este é um dos casos em que os visuais excedem a função. Dê uma olhada na imagem abaixo. O cabeçalho do site VenCat contém apenas quatro links. É preto, com um tamanho de fonte pequeno — mal notamos que ele está lá.
Um dos motivos para escolher o uso dessa prática é porque a intenção é desviar a atenção dos usuários para partes mais importantes do site.
Imagem retirada do site VenCat
A VenCat Capital é uma empresa de consultoria corporativa e de investimentos cujo foco é identificar, buscar e financiar diversos tipos de projetos. Como podemos ver acima, a imagem é composta pelo nome do site no centro da página.
Se você deseja fazer algo semelhante com o cabeçalho do seu site, lembre-se de usar uma imagem que compense o cabeçalho pequeno.
4. Opte por algo simples, mas funcional
O site da Repurposeful UK é excelente à sua maneira. Com um cabeçalho de site extremamente simples, é fácil dizer que eles valorizam a função, a conveniência e a facilidade mais do que a estética.
Cada menu no cabeçalho do site é separado em blocos que o usuário pode ver com facilidade. Também é grande o suficiente para ser acessível e fácil de notar.
Imagem retirada do site RePurposeful UK
Como você pode ver na imagem acima, eles adicionaram o logotipo da empresa no local perfeito. No lugar de símbolos, usaram textos específicos para nomear cada menu.
O título apoia-se adequadamente sobre a imagem principal da página inicial. O contraste entre o fundo colorido e o cabeçalho branco do site cria uma aparência equilibrada.
Não é surpresa nenhuma que um site pode ajudá-lo a se destacar da concorrência. Ele também representa sua autoridade, marca e identidade como site. Por isso, é importante criar um ótimo cabeçalho para otimização de mecanismos de pesquisa, melhor tráfego e uso de dispositivos móveis.
Ao implementar as dicas e práticas mencionadas neste artigo, você certamente terá um cabeçalho extraordinário. Não perca tempo e tenha a melhor experiência na criação de um site com a Strikingly. Crie sua conta sem pagar nada e comece agora mesmo a criar um cabeçalho de site excepcional.