Pinceladas da WebMovido a: XHTML, CSS, PHP e WebStandards

Quando estamos desenvolvendo um site, é habitual e recomendável utilizar-mos links para pular entre seções para aqueles que utilizam leitores de tela possam navegar rapidamente entre as várias seções da página sem ter que esperar que a mesma seja lida totalmente. Por exemplo, é recomendado criar-mos links que saltem do menu ao conteúdo para que o mesmo não seja lido várias vezes dentro de um mesmo site.

Esses links ficam invisíveis para aqueles que usam navegadores normais. A técnica mais usada é a propriedade display:none.

.oculto {
    display:none
}

Logo, o HTML fica da seguinte forma:

<a class="oculto" href="conteudo">Ir ao conteúdo</a>

Só que existe um problema que alguns leitores de tela não lêem conteúdo oculto com essa propriedade, e outros lêem normalmente, quer dizer, o link está alí para proporcionar ajuda as pessoas e não é lido. Existe uma outra técnica para acabar com esse problema que visa garantir uma maior compatibilidade. Ao invés de display:none, usamos o seguinte:

.oculto {
    position: absolute;
    top: -1600px;
}

Simples, agora você tem a certeza de que o conteúdo estará disponível a todos os leitores de tela.