| |
Año 4 - Boletín Nro 87 - viernes 7 de octubre de 2005 |
Aproximación a los Estándares y Accesibilidad Web
POR ESCAEL A. MARRERO ÁVILA - www.zunzun.cu
Miembro del Consejo Asesor de ProyectoWeb
Los comienzos
Alrededor de 1989 en los laboratorios del CERN (Centro Europeo para la Investigación Nuclear) comienza a gestarse un proyecto que revolucionaría el mundo, el del hipertexto global, su promotor Tim Berners-Lee era el artífice de lo que años más tarde seria el World Wide Web.
Desde el momento de su nacimiento el WWW se basa en tres estándares:
1. URL (Localizador Universal de Recursos). Cadena de caracteres con la cual se asigna una dirección única a los recursos de información disponibles en Internet.
2. HTTP (Protocolo de Transferencia de Hipertexto). Sistema mediante el cual se envían las peticiones de acceder a una página web, y la respuesta a la misma.
3. HTML (Lenguaje de Marcación de Hipertexto). Es un lenguaje de marcas diseñado para estructurar textos y presentarlos en forma de hipertexto.
El resultado de estos protocolos es visualizado en programas conocidos como Navegadores Web, que en un principio eran muy simples y sólo permitían la presentación de texto, pero como la tecnología, en especial la informática, avanza a pasos agigantados, rápidamente se incluyen los gráficos. Se destaca en este aspecto el Netscape Communications que, ya en el temprano 1994, añade características adicionales como contenido dinámico, música y animación, elementos que están presentes en casi todos los navegadores actuales. Hoy en día se permiten, incluso, servicios en tiempo real tales como Chat, radio web, y webcams en directo.
Además el número de dispositivos que actualmente accede a la Web crece de manera acelerada, por sólo mencionar algunos tenemos: teléfonos celulares e inteligentes, asistentes digitales personales (PDA), sistema de televisión interactivo, sistema de respuesta de voz, puntos de información e incluso algunos pequeños electrodomésticos pueden acceder a la Web.
La rápida evolución de los navegadores, servidores web y demás aplicaciones permite este desarrollo, aunque en muchas ocasiones se realiza sin tener en cuenta los estándares, lo que trae como consecuencia que los nuevos implementos no puedan ser visualizados o lo sean de forma incorrecta en todas las computadoras. Así surge uno de los grandes problemas de la web actual: la INACCESIBILIDAD.
El Consorcio World Wide Web
El Consorcio World Wide Web (W3C) se funda en 1994 por Tim Berners-Lee en colaboración con el CERN, como un consorcio dedicado a generar consenso en relación con las tecnologías Web y como opción de normalización ante el creciente desorden del WWW. Se trata de una asociación internacional formada por organizaciones, miembro del consorcio, personal y el público en general, que trabajan conjuntamente para desarrollar estándares Web. Su misión: Guiar la Web hacia su máximo potencial a través del desarrollo de protocolos y pautas que aseguren el crecimiento futuro de la Web.
El W3C crea Estándares Web y Pautas para alcanzar su objetivo. En sus primeros diez años, ha publicado más de 80 estándares, como por ejemplo las Recomendaciones. Su trabajo se basa en desarrollar tareas de educación y difusión, y en el desarrollo de software, ofreciendo a su vez un foro abierto para hablar sobre la Web.
Su objetivo fundamental es que la Web alcance su máximo potencial, para ello las tecnologías Web deben ser compatibles entre sí y permitir que cualquier hardware y software utilizados para acceder a la Web puedan funcionar conjuntamente. El W3C hace referencia a este objetivo denominándolo "interoperabilidad Web". Al publicar estándares abiertos (no propietarios) para lenguajes Web y protocolos, el W3C busca evitar la fragmentación del mercado y, por lo tanto, de la Web.
Tecnología Web al alcance de todos
Existe un amplio debate acerca de la accesibilidad y la inaccesibilidad a la Web. A nivel mundial las posibilidades de acceso están desigualmente distribuidas por las diferentes regiones y países y dependen de un sinnúmero de factores, entre otros, electrificación, extensión de las redes telefónicas en sus diversas formas, disponibilidad de computadoras, conectibilidad, etc. El W3C es parte de la lucha, precisamente, de una Web al alcance de todos.
El W3C amplía su campo de influencia a través de la difusión de las Tecnologías Web que hacen posible que sus beneficios lleguen a los países subdesarrollados. El trabajo realizado en áreas como la accesibilidad Web, la internacionalización y la independencia de dispositivo, es especialmente importante en la labor que realiza el W3C por alcanzar una Web para todos.
En el área Iberoamericana debemos destacar el trabajo que realiza el Seminario SIDAR (Seminario Iberoamericano sobre Discapacidad y Accesibilidad en la Red), en la difusión de los estándares y la accesibilidad así como en las traducciones de las Recomendaciones y Pautas del W3C.
Cómo debe ser una Web Estándar
Un sitio construido bajo los Estándares Web debe ser limpio, basado en CSS, (mecanismo para mostrar en pantalla, imprimir o incluso para pronunciar información -mediante un lector de pantalla-, del contenido presente en la Web), accesible, usable y amigable para el usuario y los motores de búsqueda.
Código correctamente estructurado
Hacer una perfecta DTD (Declaración del Tipo de Documento) al inicio de nuestros documentos, es vital para lograr una internacionalización de nuestra Web. Recordemos que la Web es el principal medio para difundir la información a nivel regional y global. Por tanto, la Web ha de funcionar bajo cualquier circunstancia, en cualquier país, con cualquier idioma y cultura. Una buena internacionalización permite garantizar su uso universal incluyendo todos los idiomas y culturas.
Un ejemplo de esto lo podemos encontrar en el lenguaje de marcado HTML o XHTML al inicio de un documento:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">
Una forma de solucionar problemas de codificación es servir todas las páginas en un conjunto de caracteres, por ejemplo UTF-8, él mismo es un sistema estándar Unicode para el alfabeto de varios idiomas. UTF-8 puede representar los caracteres de una amplia variedad de idiomas.
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
A la hora de diseñar un sitio Web es vital la codificación de datos, para que la Web trabaje internacionalmente y especificar el idioma del contenido con el objetivo de asegurar la adecuada presentación del mismo.
Otro de los aspectos a tener en cuenta es revisar nuestro código, usando un Validador de (X)HTML y un Revisor de CSS, garantizando así una revisión de los mismos por un sistema creado por el W3C con este fin. Tener un código válido significa tener un porcentaje de seguridad de que nuestra Web está siendo accesible.
Analizar con detalle si es necesario el uso de elementos HACKS en el CSS para lograr una presentación adecuada, es otro de los pasos a seguir en nuestro camino a una Web Estándar. Recordemos que es posible que en futuras versiones de los navegadores, éstos no puedan funcionar de forma adecuada de ocurrir diferenciaciones de uso tecnológico entre desarrolladores y usuarios, trayendo como consecuencia una incorrecta visualización de la información y por lo tanto hacerla inaccesible.
En este mismo camino encontramos la utilización de JavaScript en nuestras páginas. Los navegadores Web tienen la opción de deshabilitar este elemento lo que impediría poder visualizar una información que reciban con esa tecnología. Si, debido a nuestro diseño, es absolutamente necesario el uso de JavaScript debemos dar la opción de acceder a la información también sin él.
Hay una costumbre mundialmente establecida que va en contra de lo planteado en las pautas del W3C: el uso de tablas para maquetar. Esto es erróneo dado que las mismas se crearon para presentar contenido de forma tabular y no necesariamente para conformar un sitio. Además, entre las consecuencias que de ese uso tiene están las grandes dificultades que origina a la hora de posicionar un sitio Web; se debe tener en cuenta, por ejemplo, que el afamado Google, cuando penetra en un sitio para indexar su contenido, deja para el final la información que está dentro de las tablas.
Por último, y no por ello menos importante, debemos estructurar correctamente nuestro código. Todo debe ubicarse en un orden semántico, por ejemplo, el uso de los encabezados (H1, H2, H3, etc.) anidados correctamente; no utilizar un H3 en un nivel superior al H1; tampoco hacer abuso de elementos DIV ni de CLASS o ID en los mismos; si tenemos una lista de productos, por ejemplo, utilizar las etiquetas que han sido establecidas para ello como UL, OL, DT, etc.
Separar forma de contenido
Desde el surgimiento de las hojas de estilo (CSS) este concepto cobró especial relevancia ya que le dio a los diseñadores Web la posibilidad de utilizarlas para imprimir en pantalla todo el estilo deseado sin necesidad de tocar el código (X)HTML para lograr el mismo efecto.
Es de suma importancia destacar que en el fichero que tiene el contenido (por ejemplo, .HTM o .HTML), es decir la información, no debe presentarse ningún código destinado a darle forma al mismo. Para ello tenemos el .CSS que es el encargado de cumplir con esta función.
Debemos llevar esto hasta el punto de no utilizar ninguna etiqueta FONT, COLOR, BORDER, etc, ni imagen en el (X)HTML para decorar, solamente dejaremos en el mismo, aquellas que están destinadas a dar información.
La utilización de hojas de estilo nos facilita, además, el cambio rápido de diseño de nuestro sitio con solo hacerle modificaciones al CSS. Imaginemos que tenemos un sitio con cientos de páginas con el diseño en el propio (X)HTML, y queremos cambiarle el color de los enlaces, sería muy tedioso ir página por página cambiando cada uno de los enlaces al nuevo color deseado. Sin embargo, si lo tuviéramos enlazado a un fichero .CSS con sólo realizarle un pequeño cambio al mismo resolveríamos el problema.
Algunos diseñadores plantean que maquetar un sitio siguiendo las pautas del W3C les crea una limitante a la hora de diseñar y que todos los sitios realizados con la misma se parecen. Sin embargo, parecería que quienes así se manifiestan no conocen a profundidad esas tecnologías. Existe una variedad de sitios que son verdaderos jardines de diseño empleando solamente (X)HTML y CSS. Entre ellos tenemos a CSSZENGARDEN y CSSBEAUTY entre los más destacados.
Por último el peso de nuestras páginas se reduciría de manera asombrosa al utilizar esta tecnología ya que eliminamos etiquetas innecesarias.
Accesibilidad
La accesibilidad en la Web es el acceso universal a los recursos disponibles en ella, independiente del tipo de hardware, software, infraestructura de red, idioma, cultura, localización geográfica y capacidades de los usuarios.
El W3C realiza una labor educativa y de concientización en relación con la importancia del diseño accesible de páginas Web, uno de los más graves problemas de la Web actual. Hay que tener en cuenta que un sitio accesible debe serlo tanto para las personas sin ningún tipo de dificultad como para aquellos con discapacidad, física o intelectual. Tampoco debemos olvidar que el usuario puede estar desenvolviéndose bajo circunstancias externas difíciles como ruidos, demasiada o poca iluminación, entre otros aspectos que afectan la accesibilidad a la información.
El uso apropiado de atributos ALT para las imágenes es de vital importancia para la accesibilidad de un sitio. Recordemos que las imágenes presentes en nuestro código (X)HTML ilustran el contenido, es decir, transmiten información al usuario sobre la función que cumple la misma en nuestra página. Esta descripción no debe ser muy extensa y cuando sea necesario ampliarla debemos utilizar el atributo LONGDESC.
Utilizar unidades de medidas relativas EMS o Porcentajes, en vez de medidas absolutas, por ejemplo PX, PT es fundamental, ya que el usuario tiene la posibilidad de aumentar o disminuir la letra de una página cuando tenga deficiencias visuales o una resolución de pantalla muy grande o muy pequeña. Es vital el uso de medidas relativas en aquellos lugares que se necesite mantener la proporción de la página al aumentar o disminuir el tamaño de la fuente.
Los formularios, por su parte, son el mecanismo de interacción y comunicación más habitual en los sitios Web. Son un elemento clave que influye en el buen funcionamiento de la página o aplicación, por eso es muy importante que sean accesibles y usables. Se plantea que se debe asociar las etiquetas con sus respectivos controles, por ejemplo: la etiqueta LABEL con su respectivo FOR. El LABEL es utilizado para identificar el texto asociado a los campos del formulario mediante el atributo FOR. Esto permite que los lectores de pantalla asocien correctamente esa etiqueta a su correspondiente campo:
<label for="nombre">Nombre<input type="text" name="nombre"></label>
El campo se identifica con el atributo ID, que coincide con el atributo FOR de la etiqueta LABEL a la que se asocia.
Otra recomendación por ejemplo, es la división de bloques largos de información en grupos más pequeños y manejables. Para ello se utilizan los atributos OPTGROUP para los elementos OPTION dentro de un SELECT:
<select id="perfil" name="perfil">
<optgroup label="Tecnología">
<option>Sistemas</option>
<option>Desarrollo web</option>
<option>Consultoría</option>
<option>Formación</option>
</optgroup>
<optgroup label="Comunicación">
<option>Diseño y creatividad</option>
<option>Comercial - Marketing</option>
<option>Atención al cliente</option>
<option>Publicidad</option>
</optgroup>
</select>
Por último todos los controles de formulario deben estar agrupados con FIELDSET y LEGEND.
Con vistas a mejorar la accesibilidad de las tablas y recordando que no se deben utilizar para presentar contenido, sino solamente para datos tabulares cuando éste sea el caso, esas tablas deben ser completamente accesibles. Para lograrlo se presenta un Título o Subtítulo mediante el atributo CAPTION:
<table>
<caption>enero 2005</caption>
<tr>
<th>Lunes</th>
<th>martes</th>
...
</table>
Otra de las cuestiones a tener en cuenta es la opción de proporcionar resumen para las tablas mediante el atributo SUMMARY de la etiqueta TABLE, el mismo debe ser breve y explicativo del contenido de la tabla:
<table summary="Calendario del mes de junio ">
<caption>Junio 2005</caption>
<th>Lunes</th>
<th>martes</th>
...
</table>
Por último, y no menos importante, es el uso de encabezamientos apropiados para las tablas utilizando la etiqueta <th> en vez de la etiqueta <td> en donde sea necesario.
Una vez realizados los pasos fundamentales en nuestra tabla, conseguiremos que los lectores de pantalla y los navegadores en modo texto como Lynx puedan interpretar correctamente la información que en ella se presenta.
Por otro lado los colores deben ser contrastados, sobre todo los colores de fondo y primer plano posibilitando que sean percibidos por personas con deficiencias en la percepción del color o que utilicen pantallas en blanco y negro, o navegadores en modo texto.
Además se debe asegurar que toda la información transmitida a través de los colores también esté disponible sin color. Por ejemplo, cuando pida intervención de los usuarios, no escriba "por favor, seleccione uno de los ítems indicados en azul". En su lugar, asegúrese de que la información está disponible a través de otros efectos de estilo (por ejemplo un efecto de fuente) y a través del contexto (por ejemplo, vínculos de texto detallados).
Por último el W3C ha desarrollado las denominadas Pautas de Accesibilidad al Contenido en la Web (WCAG), siglas en inglés. Son en total 14 pautas, cuya función primordial es guiar el diseño de páginas Web para hacerlo accesible, reduciendo de esta forma las barreras de la información. Dichas pautas proporcionan soluciones de diseño y ejemplos de cómo una página puede ser inaccesible. Para alcanzar este objetivo el W3C ha creado puntos de verificación con sus correspondientes niveles de conformidad para lograr que los diferentes grupos de usuarios accedan a la información del sitio Web sin dificultades.
Las pautas también describen cómo hacer páginas Web accesibles sin sacrificar el diseño. En este aspecto se repite el debate de si el W3C pone límites a la creatividad del autor en cuanto a diseño. Por el contrario, seguir las pautas ofrece una flexibilidad difícil de alcanzar por otros medios a la vez que lleva la información a mayor número de usuarios, lo que se traduce en mayor posicionamiento, visibilidad, etc.
Usabilidad
La usabilidad es un aspecto indisoluble de la semántica de la Web. Es la facilidad de uso, ya sea de una página Web, una aplicación informática o cualquier otro sistema que interactúe con un usuario.
Uno de los aspectos ineludibles es que el usuario sepa en todo momento en que punto de nuestra Web se encuentra, mediante una técnica conocida como breadcrumbs o migas de pan. Mediante una adecuada jerarquía visual se alcanza a través de ubicar y estructurar correctamente los elementos de navegación en un orden simple de izquierda a derecha, forma de leer en Occidente.
Aspectos tales como distinción de títulos en etiquetas establecidas para ello como los conocidos H1, H2, H3, etc, no deben faltar en una Web Estándar y el discutido uso de los vínculos subrayados es básico en el entendimiento y facilidad de uso de una Web. En este punto se debe aclarar que aunque no sea absolutamente necesario tener un vínculo subrayado, por motivos de diseño, sí es imprescindible informar claramente al usuario que se esta en presencia de un enlace mediante controles del Mouse y teclado logrados con CSS (uso del elemento a:hover), o destacar otra técnica equivalente. Los enlaces que han sido visitados deben ser definidos en un color diferente, para ello tenemos el elemento CSS a:visited o si preferimos no establecemos ningún valor para este elemento y lo dejamos en predeterminado.
El uso del Mapa del Sitio es una herramienta verdaderamente útil ya que nos da una visión global del mismo, además de ayudar al usuario a encontrar rápidamente lo que está buscando o a informarle en qué lugar se encuentra si se ha perdido.
Conclusiones
En este artículo se ha tratado de dar una visión global de los Estándares y la Accesibilidad Web, qué pasos debemos seguir para lograr que nuestra información llegue al mayor número de usuarios y sobre todo desarrollar un medio en el cual sea posible el intercambio universal de información, sin barreras ni fragmentación tanto para los humanos como para las máquinas.
Deseo concluir con unas palabras de Tim Berners-Lee cuando ante una pregunta de hacia dónde se encaminaba la Web respondió:
"Personalmente he apostado por la Web Semántica; este concepto se fundamenta en la idea de disponer los datos en un formato que pueda ser comprendido de forma natural por las propias máquinas que tejen la Web..."
Y más adelante concluyó:
"También creo que el mundo en vías de desarrollo tiene el potencial para establecer una forma completamente distinta de Internet que podría sustituir a la Red tal como la conocemos. Pienso que debemos preguntarnos desde un punto de vista tecnológico si toda la tecnología Internet no ha sido una invención de Occidente para Occidente..."
Pero existen otras posibilidades. En este artículo se demuestra cómo un uso adecuado de la tecnología permite utilizar la Web de forma más comunicativa y al alcance de todos.
El camino hacia el desarrollo de una Web que lleve nuestras realidades a todos los rincones del mundo está abierto y despejado, solamente nos toca a nosotros emprender la marcha.
Webs Consultadas
1. Entrevista a Tim Berners-Lee 
2. World Wide Web
3. ¿Qué es el Consorcio World Wide Web (W3C)?
4. Sobre el W3C – Objetivos
5. Fundación Sidar - Acceso Universal Seminario SIDAR
|
|
|
Suscribirse al Boletín
