3 - Áreas de informação
Instrução para validar os critérios do morga de relacionado a divisão de áreas semânticas de uma interface
Áreas de informação e semântica
Áreas de informação são tags do html que permitem dar uma semântica/significado e função a alguns elementos da interface, usar esse tipo de convenção torna o produto mais acessível.
Perfis atendidos: Deficiência visual, motora e cognitiva.
Morga
7 - dividir áreas de informação. As divisões mais comuns são “topo”, “conteúdo”, “menu” e “rodapé”.
Instruções gerais
Usar as áreas de informação correta é fundamental para usuários de leitores de tela obterem maior agilidade durante a navegação, além de dar consistência às composições das interfaces e semântica de conteúdo que favorecem o SEO - Search Engine Optimization.
Exemplos de áreas de informação
<header>
Contém informações introdutórias para uma página ou para uma seção dela.
<nav>
É utilizada para seções da página que contenham links para outras páginas ou seções, como o menu principal, por exemplo.
<section>
Representa uma seção genérica ou uma seção que contém uma aplicação. Funciona de maneira parecida com a elemento <div>, separando seções do documento.
<article>
Representa uma seção da página independente, como uma postagem em um blog, um comentário em um fórum, entre outros.
<aside>
Contém conteúdo relacionado à área principal do documento.
<footer>
É utilizada para demarcar o rodapé da página ou de uma seção do conteúdo.
Itens de verificação
Verificação com o Wave
Header e navigation
Footer a navigation
Referências
Last updated