Estruture a página de forma lógica.
Um estilo consistente de apresentação permitirá a localização de mecanismos de navegação mais facilmente e permitirá, também, encontrar mais facilmente conteúdos importantes.
Cada página que entramos na Internet possui um padrão de organização diferente. Em se tratando de pessoas sem problemas de visão, basta uma olhada geral na página para que seja possível compreender como a mesma está organizada.
Em sites ou páginas com estruturas muito complexas, informe sobre a estrutura da página através de uma Descrição Textual do site ou da página.
5.1 Separe camada de estrutura da apresentação
Tente separar completamente a camada de estrutura (elementos HTML) da camada de apresentação (Utilize folhas de estilos - CSS), isto tornará sua página mais leve e limpa, facilitando bastante a manutenção e permitirá que a mesma seja carregada no navegador mais rapidamente.
Bem, isto pode render um livro completo. Pense apenas que nas Declarações de Tipo de Documentos mais modernas como HTML Strict e XHTML Strict é proibido o uso de estilos misturados na linhas dos elementos HTML e no HTML 5 não é uma boa prática.
No início esta separação pode ser um pouco complicado, ainda mais quando você começa a utilizar folhas de estilos para posicionar blocos div em substituição a posicionamentos com tabelas.
Lembre-se, HTML evolui e nós desenvolvedores também devemos evoluir, conhecendo as técnicas mais modernas de desenvolvimento, ou você pretende ser considerado um pré-histórico do HTML?
Um excelente local para você conhecer mais sobre técnicas de uso de folhas de estilos, tanto para apresentação quanto para posiconamento, é o site do Maujor.
5.2 Posicionamento e organização (wireframe)
Defina áreas específicas no seu site de forma que o mesmo fique com uma estrutura consitente, tipo área de cabeçalho, área à esquerda, àrea à direita, área de conteúdo, área de rodapé, etc. Passe a exibir as informações sempre nas áreas pré definadas.
Até o HTML 4 usamos o elemento div para estruturar as áreas das páginas. O HTML 5 introduziu novos elementos na semântica para estruturaçao de páginas como: <header>, <nav>, <article>, <section>, <aside>, <figure><footer>, entre outros.
Procure utilizar alguns recursos de forma padrão, se possível fazendo com que os mesmos apareçam no mesmo lugar em cada nova página exibida, como por exemplo:
- Cabeçalho
- Barra ou menu de navegação;
- O conteúdo principal da página;
- Anúncios e advertências.
- Rodapé
Veja mais detalhes desta semântica em HTML Semantic Elements
Agora pare um pouco, entre em uma página desconhecida e, antes de abrí-la, feche os olhos e tente descobrir como a mesma está apresentada. É praticamente impossível, não é? Como contornar este problema?
Definindo uma estrutura semânticamente correta e alocando os elementos principais do site como cabeçalho, pesquisa, menu, conteúdo sempre mesma posição. Alguns leitores de tela conseguem pular automaticamente elementos repetidos na página carregada, permitindo o acesso direto ao conteúdo que foi modificado.
Se sua apresentação possuir complexidade média ou alta, tente descrever como sua página está estruturada, conforme segue:
Pense! Você está ao telefone e tenta explicar para a pessoa do outro lado como está organizada sua página.
Coloque tudo isto que você falou "ao telefone", de forma organizada, em uma página de texto html puro, e coloque um link alternativo para esta página, chamando-a, por exemplo, de "Descrição Textual do Site". Procure informar da existência desta página logo nos primeiros objetos da página.
Uma boa referência para layout é o site 1linelayouts.
5.3 Navegação
5.3.1 Janelas
Identificar se uma página abriu em uma nova janela ou se esta substituiu a atual do navegador é uma tarefa complicada para o deficiente visual.
Procure definir um padrão para abertura das páginas no seu site carregadas pelo acionamento dos links, preferencialmente abrindo na própria janela, permitindo o retorno a janela anterior através do teclado.
Caso tenha extrema necessidade de abrir uma página em uma nova janela informe no link de acionamento que o mesmo irá abrir uma nova janela.
Alguns desenvolvedores abrem outras janelas _target="blank" para links de sites externos pensando sempre em não fechar a página do seu site, achando que com isto o usuário irá lembrar sempre de voltar ao site original. Ora, o que mantém o usuário no site é a qualidade do conteúdo e facilidade de uso e não o uso de técnicas para forçar o usuário ficar com um site aberto.
Em uma navegação natural o retorno a janela anterior é feito através das teclas BACKSPACE ou ALT+ ← (seta para esquerda).
5.3.2 Menus
Evite ter que acionar mais de 3 (três) links para chegar na informação pretendida.
Utilize as tags <ul><li> para criação dos menus, isto permitirá que o leitor de telas ao focar na lista informe a quantidade de itens existentes.
5.4 Modelo de objetos de documentos (DOM)
Cada item de uma página HTML, um link, um bloco div, uma tabela, um parágrafo, etc é um objeto da página que apesar de visualmente não ser percebido como tal podem ser acessados através do Modelo de Objetos de Documento (DOM - Document Object Model).
Tenha sempre em mente que a navegação entre estes objetos poderá ser efetuada através do teclado, principalmente através da utilização da tecla TAB ou setinhas. O deslocamento do foco nos objetos, por padrão, se dará de cima para baixo e da esquerda para direita, seguindo a estrutura do seu código.
Entendendo um pouco mais sobre DOM - Modelo de Objetos de Documentos no site Tabeless.