Estructura y presentación

Un texto oculto puede ser accesible de diferentes formas, dependiendo de cuál es la finalidad del texto y el motivo por el que se oculta.

Así, un texto que se desea ocultar para que no aparezca en la presentación visual de la página pero que siga estando disponible para los lectores de pantalla y otros productos de apoyo deberá ocultarse usando una técnica de CSS compatible con dichos productos de apoyo.

 Por ejemplo, en lugar de usar display:none se puede usar una técnica de posicionamiento absoluto fuera de los márgenes de la pantalla.

Ejemplo de código CSS

 Esta técnica es apropiada, por ejemplo, cuando se incluya en la página información o contenidos específicos para usuarios de lectores de pantalla o productos de apoyo. Por ejemplo, cierta información de ayuda o el texto completo y descriptivo de los enlaces que visualmente siguen un patrón similar (del estilo “leer más”, “más información”, etc.).
 

Por otra parte, si la finalidad es ocultar el texto para todos los usuarios entonces se podrá eliminar del contenido de la página (del DOM) mediante JavaScript, CSS (display:none) o una combinación de ambos. Esta técnica es apropiada, por ejemplo, en menús u otros contenidos desplegables ya que al ocultar parte del contenido se pretende facilitar el uso de la página al limitar la información mostrada a los usuarios en cada momento. En este caso, es apropiado también que dicha información también pueda ser ignorada por los lectores de pantalla y otros productos de apoyo, facilitándoles así el saltar o ignorar bloques de contenido.

Si se utiliza el color como único medio para transmitir información, usuarios con limitaciones visuales basadas en la percepción del color (como por ejemplo, la dicromacia) no percibirán correctamente dicha información. Si utilizamos otros medios además del color, cubrimos todas las necesidades del usuario independientemente de sus limitaciones.

Por ejemplo, en el caso de los vínculos, para diferenciarlos de un texto normal, es común el uso del estilo subrayado como complemento al color azul.

En el caso de gráficos de barras o sectores que muestran diferentes secciones y/o valores asociados a un color, se debe complementar con un rayado o trama único para cada sección o valor.

No se pueden emplear elementos de presentación si se usan como único medio para transmitir información o estructura. Toda la información, estructura y relaciones del contenido transmitidas a través de la presentación debe proporcionarse también mediante elementos estructurales y semánticos.

Así, por ejemplo, para enfatizar un texto se deben utilizar los elementos STRONG o EM, para marcar encabezados los elementos H1-H6 o para marcar citas los elementos Q o BLOCKQUOTE en lugar de usar elementos de presentación como FONT, B o I que únicamente transmiten información visual. Para aplicar o modificar el estilo visual de dichos elementos estructurales y semánticos se deberán utilizar las hojas de estilo.

No, ya que el enlace no sería descriptivo sólo con el icono. Se debe proporcionar un texto que describa el archivo a descargar (indicando por ejemplo el título), y añadir como parte del enlace el icono representativo del tipo de archivo, indicando como alternativa textual de la imagen el formato del archivo.

Es posible usar tablas para maquetar siempre y cuando linearizen correctamente. Es decir, si el orden de lectura del contenido de la tabla es el adecuado. El orden de lectura se corresponde normalmente con el orden del contenido de la tabla en el código de la página. Asimismo, las tablas de maquetación no podrán hacer uso de ningún elemento o atributo propio de tablas de datos (por ejemplo, TH, CAPTION, summary, scope, headers, etc.).

De igual modo, es posible utilizar marcos o marcos en línea para maquetar las páginas de un sitio web, sólo si cada marco tiene un título acorde a su contenido

Sin embargo, y aunque no esté prohibido, sí está desaconsejado el uso tanto de tablas como de marcos para maquetar las páginas, por el coste que supone el mantenimiento de un sitio Web construido con cualquiera de estos dos tipos de elementos al romper con el principio de separación de contenido y presentación.

Maquetar una página mediante hojas de estilo tiene enormes ventajas, entre las cuales podemos citar:

• Facilita el rediseño de las páginas.
• No es necesario cambiar el contenido para mostrarlo en dispositivos diferentes.
• Disminuye el tiempo de carga de las páginas.
• El usuario puede cambiar la presentación según sus gustos o necesidades.

En resumen, el uso de hojas de estilo para maquetar mejora la accesibilidad.