Links e navegação

Neste episódio, as convidadas Cláudia Martin Nascimento e Sandyara Peres focam na acessibilidade em links e navegação, a base da Web desde sua criação. Elas relembram as boas práticas que tornam a navegação acessível para todas as pessoas e mostram como a estrutura de links e menus pode facilitar (ou dificultar) a experiência de quem navega com tecnologias assistivas.
A produção deste podcast não seria possível sem o apoio da Embaixada do Reino Unido, da Secretaria de Governo Digital do Ministério da Gestão e da Inovação em Serviços Públicos e com a parceria do W3C Chapter São Paulo, Movimento Web para Todos e Acesso para todos.



A produção deste podcast não seria possível sem o apoio da Embaixada do Reino Unido, da Secretaria de Governo Digital do Ministério da Gestão e da Inovação em Serviços Públicos e com a parceria do W3C Chapter São Paulo, Movimento Web para Todos e Acesso para todos.

Participantes

Host: Reinaldo Ferraz

Convidadas: Cláudia Martin Nascimento e Sandyara Peres

Produção: Espiral Interativa, Ceweb.br e Comunicação NIC.br

Estúdio de gravação: 3 Telas

Roteiros: Espiral Interativa, Acesso para Todos, Ceweb.br

Recursos de acessibilidade:
Tradução e Interpretação de Libras-Português
Tradutora: Jade Moia
Legendas: Espiral Interativa e Ceweb.br


Termos e expressões utilizados ao longo do episódio

ARIA (Accessible Rich Internet Applications): conjunto de atributos que tornam interfaces mais acessíveis para tecnologias assistivas.

Aria-labelledby: atributo ARIA que conecta um elemento (como um link) a outro texto que serve como descrição.

Atributo “title”: atributo HTML que mostra uma informação textual extra (geralmente ao passar o mouse).

Breadcrumb (trilha de navegação): conjunto de links que mostra o caminho até a página atual dentro do site. Ajuda a pessoa a entender onde está e a voltar para páginas anteriores.

Core business: é a atividade principal de uma empresa — aquilo que ela realmente faz e que gera valor. É o “coração” do negócio. É o motivo pelo qual a empresa existe.

Chatbot: um “assistente virtual” que conversa com a pessoa usuária no site/aplicação para ajudar, tirar dúvidas ou resolver problemas automaticamente.

FAQ (Frequent asked questions): uma parte do site/aplicação onde ficam reunidas as dúvidas mais comuns das pessoas, já com respostas prontas.

Foco (de teclado): indicação visual de qual elemento da página está selecionado quando usamos o teclado. O foco ajuda a saber “onde estamos” durante a navegação sem mouse.

Frame / iframe: é uma “janela dentro da página” que mostra conteúdo de outro lugar, sem você sair do site. Ex: vídeos ou mapas de outras plataformas que você pode visualizar dentro de um site, sem precisar abrir a plataforma original.

Hierarquia de navegação: forma como as páginas e seções de um site são organizadas em níveis, como página principal, seções e subseções.

Leitor de tela: tecnologia assistiva que transforma o conteúdo da tela em áudio ou em informação tátil, permitindo que pessoas cegas ou com baixa visão utilizem sites e aplicativos.

Link (hiperlink): elemento clicável que leva para outra página, seção ou recurso. Para ser acessível, o texto do link deve deixar claro para onde ele leva ou o que faz.

Mapa do site: página que apresenta a estrutura geral do site, listando suas principais seções e conteúdos.

Menu hambúrguer: ícone com três linhas horizontais usado para abrir e fechar menus em sites e aplicativos, especialmente em telas menores.

Navegação: forma como as pessoas se deslocam entre páginas, seções e conteúdos dentro de um site ou sistema.

Navegação por teclado: forma de usar um site apenas com o teclado, sem depender do mouse ou do toque na tela.

Nome acessível: texto que identifica um botão, link ou outro elemento interativo para tecnologias assistivas. É o que o leitor de tela anuncia ao usuário.

Recursos iconográficos: ícones (desenhos) que ajudam a indicar ações. Ex: ícone de download.

Regiões da página (landmarks): áreas estruturais da página, como menu, conteúdo principal e rodapé, que ajudam na organização e facilitam a navegação com tecnologias assistivas.

Semântica (estrutura e marcação semântica): uso correto da estrutura do conteúdo para indicar o significado e a função de cada parte da página, facilitando a compreensão por navegadores e tecnologias assistivas.

Skip link (link para pular conteúdo): link geralmente localizado no início da página que permite ir direto ao conteúdo principal, pulando menus e partes repetidas.

Tecnologia assistiva: recursos e ferramentas que ajudam pessoas com deficiência a utilizar produtos digitais, como leitores de tela, ampliadores de tela e comandos por voz.

Tecla Tab: tecla do teclado usada para avançar entre links, botões e outros elementos interativos da página.

Além dos termos que comentamos aqui, a Norma ABNT 17225 traz uma seção de termos e definições que pode complementar seu entendimento e apoiar você nessa jornada.


Link para transcrição do episódio: https://nic.br/pagina/transcricao-todos-na-web-3/ 

Redes Sociais:
https://www.youtube.com/nicbrvideos/ 
https://x.com/comuNICbr/ 
https://www.telegram.me/nicbr/ 
https://www.linkedin.com/company/nic-br/ 
https://www.instagram.com/nicbr/ 
https://www.facebook.com/nic.br/ 
https://www.flickr.com/NICbr/ 


Veja também:
https://nic.br/ 
https://ceweb.br