Digital Studio

Guia

Navegação do website: ajude a encontrar a página certa

6 min de leituraNavegação do website

Três cartões de páginas ligados entre si sobre um mapa de percursos dobrado, com um caminho destacado até um destino.

Ilustração conceptual da Digital Studio.

Uma boa navegação ajuda o visitante a reconhecer o ponto de partida certo, escolher uma página útil e perceber o que fazer a seguir. Comece pelas perguntas que as pessoas fazem à sua empresa, atribua-lhes destinos claros e teste os percursos num telemóvel e com o teclado. Um menu mais curto só ajuda se as páginas importantes continuarem fáceis de encontrar.

Esta lista destina-se a empresas que preparam um novo website ou analisam o atual. Utilize-a para tomar decisões com a equipa de design antes de aprovar um cabeçalho visualmente acabado. O resultado útil é um mapa breve e acordado das necessidades dos visitantes, das páginas e das ligações.

Comece pela tarefa do visitante

Escreva entre três e cinco situações nas palavras dos seus clientes: «Preciso de saber se trabalham na minha zona», «Quero comparar os vossos serviços» ou «Já sou cliente e preciso de apoio». São exemplos a adaptar, não um limite fixo. Reveja pedidos reais e pergunte a quem lhes responde em que pontos os visitantes encontram dificuldades.

Para cada situação, registe o público, a pergunta, a página que responde e a próxima ação útil. Um potencial cliente pode precisar de compreender um serviço antes de contactar; um cliente atual pode procurar apoio imediato. Fazer ambos passar pelo mesmo formulário comercial cria um desvio evitável.

Separe a tarefa do visitante da organização interna. O nome de um departamento só faz sentido na navegação se os clientes o compreenderem. Se duas equipas propõem «Soluções», pergunte o que uma pessoa esperaria encontrar em cada ligação. Registe os nomes e destinos acordados no briefing do projeto do website.

O cabeçalho é apenas uma parte da navegação. As ligações no conteúdo podem levar uma pergunta à sua resposta no momento em que surge. Esta tabela ajuda a escolher o lugar adequado para cada acesso.

Onde colocar um acesso de navegação
Necessidade do visitantePonto de partida útil
Um motivo principal para procurar a empresaUma ligação clara na navegação principal
Comparar vários serviços relacionadosUma página geral; acrescente um submenu se facilitar a escolha
Consultar um pormenor durante a leituraUma ligação descritiva na página relevante
Consultar políticas ou informações gerais da empresaUma ligação no rodapé, complementada por ligações contextuais quando necessário
Encontrar muitos elementos conhecidos pelo nomePonderar uma pesquisa em conjunto com uma estrutura que se possa percorrer

Não existe um número universal de opções de menu. Avalie os nomes reais, o espaço disponível e as diferentes tarefas. O contacto pode merecer uma posição de destaque mesmo que outra secção receba mais visitas. Não esconda um destino essencial para cumprir um limite visual.

Faça corresponder o nome ao destino

Substitua nomes vagos como «Descubra» por palavras que expliquem a escolha: «Serviços de manutenção», «Zonas de intervenção» ou «A nossa equipa». Estes exemplos servem algumas empresas, não todos os websites. Pergunte a alguém externo ao projeto o que espera encontrar ao escolher cada opção, sem mostrar previamente a página de destino.

A explicação da WAI sobre a finalidade das ligações mostra como o texto ou o contexto associado devem esclarecer o objetivo. Prefira nomes compreensíveis isoladamente.

À chegada, o título da página deve confirmar a escolha. «Manutenção de escritórios» não deve abrir, sem explicação, uma página chamada «A nossa experiência». Em páginas mais profundas, pondere um percurso de navegação se ajudar a compreender a hierarquia. Deve representar a estrutura do website, não o histórico do visitante.

A navegação repetida deve manter a sua ordem relativa entre páginas, como explica a WAI sobre navegação consistente. Acorde nomes comuns, incluindo traduções, em vez de editar cada cabeçalho separadamente.

Verifique o menu móvel e o percurso com teclado

Analise o menu funcional num ecrã estreito com as traduções mais longas. Abra-o a partir de um artigo, de uma página de serviço e da página de pedido de contacto. É possível distinguir as opções e fechar o menu sem perder a orientação? Uma captura da versão para computador não responde a estas perguntas.

O guia da WAI sobre apresentação de menus aborda o foco visível, o texto ampliado e estados reconhecíveis para além da cor. Verifique a implementação.

Ponha o rato de lado. Percorra a navegação com Tab e Shift+Tab, ative as ligações com Enter e verifique os botões do menu com Enter e Espaço. O foco não deve desaparecer atrás de um painel fechado. Se o menu abrir numa janela modal sobreposta, peça uma demonstração da gestão do foco e do fecho.

Os submenus devem funcionar com teclado e toque e ter um acesso alternativo pela página superior; consulte o tutorial da WAI sobre menus pendentes. Se a opção superior também abrir uma página, torne inequívocas a ligação e a ação de abrir o submenu. Peça uma demonstração das duas ações.

O tutorial da WAI sobre estrutura de menus explica as regiões de navegação identificadas e a identificação programática da página atual. Assim, as tecnologias de apoio podem interpretar a estrutura visível.

Um exemplo que pode adaptar

Imagine uma empresa de manutenção de edifícios. Este é um exemplo hipotético, não um resultado de um cliente. O cabeçalho proposto contém «Soluções», «Experiência», «Recursos» e «Vamos conversar». Uma nova responsável de escritórios quer confirmar se a empresa faz manutenção regular na sua localidade antes de pedir uma conversa.

O percurso seria: apresentação dos serviços → manutenção de escritórios → zonas de intervenção → pedido de contacto. Um cabeçalho revisto poderia mostrar «Serviços», «Zonas de intervenção», «Sobre nós» e «Contactos». A página de manutenção teria uma ligação direta à cobertura geográfica e, depois, uma opção de contacto. Os clientes atuais teriam um acesso ao apoio com um nome distinto.

Teste o mapa antes de discutir cores. Apresente a alguém a situação da responsável sem indicar a opção esperada. Registe a primeira ligação escolhida, os nomes que suscitam dúvidas e se o destino responde à tarefa. Se a pessoa procurar as zonas em «Sobre nós», explore essa expectativa antes de acrescentar outro nível ao menu.

Mantenha um registo breve das decisões em vez de uma nota geral como «melhorar a navegação». Use uma linha por tarefa: página inicial, destino esperado, escolha real, motivo da hesitação, alteração proposta e responsável. Uma primeira escolha errada pode indicar palavras confusas, uma ligação em falta ou uma página que não responde à pergunta. Não presuma que o problema está apenas no menu. Repita a tarefa depois da alteração e registe o que continua pouco claro. Comece também a partir de uma ligação partilhada para um serviço: deve ser possível orientar-se sem ter passado primeiro pela página inicial do website.

Peça a verificação de ligações reais <a href="…"> com texto descritivo. As recomendações de ligações da Google explicam ligações rastreáveis e textos âncora úteis.

Para a descoberta através de motores de pesquisa e IA, o nosso ponto de partida prático é a mesma estrutura compreensível: temas explícitos, ligações claras e conteúdo útil nos destinos. Trata-se de uma abordagem editorial, não de uma promessa de indexação, posicionamento ou presença numa resposta de IA. Um percurso legível não determina o que outro serviço seleciona.

Lista de aprovação para a empresa

  • Cada tarefa prioritária tem um destino acordado e um próximo passo.
  • Os nomes do menu descrevem as páginas que abrem, em todos os idiomas publicados.
  • Uma pessoa consegue tentar as tarefas prioritárias sem orientação; as dúvidas ficam registadas.
  • Os percursos móveis e com teclado foram demonstrados em páginas funcionais.
  • Os submenus, os sinais da página atual e o fecho do menu foram verificados.
  • As páginas importantes têm ligações internas funcionais; existe um plano de redirecionamento para os URL alterados.
  • Uma pessoa mantém o mapa de navegação quando mudam os serviços ou as páginas.

Esta é uma verificação de aprovação focada, não uma certificação de acessibilidade. O tutorial da WAI sobre menus oferece orientações adicionais de implementação. Se também mudar a estrutura de páginas, utilize a lista para a renovação do website para planear o trabalho completo.

Leve as tarefas dos visitantes e a lista atual de páginas para a conversa sobre o projeto. Conheça o serviço de websites da Digital Studio ou comece o briefing do seu website pelos percursos mais importantes para os seus clientes.

Comece o briefing do seu website