Técnicas para as WCAG 2.0

Ir para o conteúdo (Pressione a tecla Enter)

-

H49: Utilizar a marcação semântica para assinalar texto especial ou realçado

Aplicabilidade

HTML e XHTML.

Esta técnica está relacionada com:

Notas de Apoio para o Agente de Utilizador e para a Tecnologia de Apoio

O Firefox 1.0 (Windows) e superior, o Opera 7.54 (Windows) e superior, o Mozilla 1.7.3 (Windows) e superior geram automaticamente aspas em torno dos elementos q, mas o Internet Explorer 6 para o Windows não.

Descrição

O objectivo desta técnica é demonstrar como a marcação semântica pode ser utilizada para marcar texto especial ou realçado, de modo a poder ser determinado de forma programática. A utilização da marcação semântica para marcar texto especial ou realçado também fornece estrutura ao documento. Os agentes de utilizador podem assim tornar a estrutura perceptível ao utilizador, por exemplo, utilizando uma apresentação visual diferente para diferentes tipos de estruturas ou utilizando uma voz ou inclinação diferentes numa apresentação em auditório.

A maioria dos agentes de utilizador irá distinguir visualmente o texto que tenha sido identificado utilizando a marcação semântica. Algumas tecnologias de apoio fornecem um mecanismo para determinar as características do conteúdo que tiver sido criado utilizando a marcação semântica adequada.

Exemplos

Consulte os exemplos apresentados de texto semântico.

Exemplo 1

Este exemplo mostra como utilizar os elementos em e strong para realçar o texto. Os elementos em e strong foram concebidos para indicar realce estrutural que possa ser apresentado de várias formas (alterações no estilo do tipo de letra, alterações na entoação da fala, etc.).

Código Exemplo:

                                 ...What she <em>really</em> meant to say was, &quot;This is not ok, 
 it is <strong>excellent</strong>&quot;!... 

Exemplo 2

Este exemplo mostra como utilizar o elemento blockquote para marcar citações extensas que possam necessitar de quebras de parágrafo. Também demonstra como utilizar o elemento cite para especificar uma referência.

Código Exemplo:

<p>The following is an excerpt from the <cite>The Story of my Life</cite> by Helen Keller</p>
 <blockquote>
   <p>Even in the days before my teacher came, I used to feel along the square stiff boxwood
   hedges, and, guided by the sense of smell, would find the first violets and lilies.  
   There, too, after a fit of temper, I went to find comfort and to hide my hot face 
   in the cool leaves and grass.</p>
 </blockquote>

Exemplo 3

Esta é a utilização do elemento q para marcar uma citação mais abreviada. As aspas são fornecidas em torno do elemento q, uma vez que muitos agentes de utilizador ainda não suportam este elemento e, por conseguinte, não o apresentam correctamente (consulte as notas do agente de utilizador). As regras CSS para suprimir a geração automática de aspas são fornecidas para os agentes de utilizador que suportam o elemento q, para os impedir de gerar aspas automaticamente para além das aspas fornecidas pelo autor, resultando em conteúdo de aspas duplas. No futuro, quando o elemento q for mais suportado, a necessidade de fornecer aspas e de suprimir as aspas geradas pelo browser irá desaparecer.

Código Exemplo:

q:before { content: ""; } 
q:after { content: ""; } 

Código Exemplo:

                                 <p>Helen Keller said, "<q>Self-pity is our worst enemy and if we yield to it, 
we can never do anything good in the world.</q>"</p>

Exemplo 4

Os efeitos superior à linha e inferior à linha são criados utilizando os elementos sup e sub .

Código Exemplo:

                                 <p>Beth received 1<sup>st</sup> place in the 9<sup>th</sup> grade science competition.</p>
<p>The chemical notation for water is H<sub>2</sub>O.</p>

Recursos

Os recursos são indicados apenas a título informativo, não implica que tenham sido aprovados.

Testes

Procedimento

  1. Verifique se o conteúdo inclui informações transmitidas através de variações na apresentação do texto.

  2. Verifique se foi utilizada a marcação semântica apropriada (tal como em, strong, cite, blockquote, quote, sube sup) para assinalar o texto que transmite informações através de variações no texto.

Resultados Esperados