Lista de comprobación de estándares web
He traducido la "checklist" original de A Web Standards Checklist, en MaxDesign.
Antes de empezar, aclaremos conceptos:
- ¿Qué son los estándares web?
La expresión 'estándares web' puede significar cosas diferentes según para quién. Para algunos no es otra cosa que construir sitios web sin tablas, para otros se trata de hacerlo usando código válido. De cualquier manera, el concepto es mucho más amplio que esto. Los estándares web podrían ser definidos como:- La adherencia a los estándares (HTML, XHTML, XML, CSS, XSLT, DOM, MathML, SVG, etc.) y la búsqueda de las mejores prácticas (código válido, código accesible, código semánticamente correcto, URLs amigables para el usuario, etc.).
En otras palabras:- Un sitio construido de acuerdo a los estándares de la web debe ser magro, limpio, basado en CSS, accesible, usable y amistoso con los motores de búsqueda.
- Acerca de la lista
No se trata de una lista cerrada. Probablemente hay muchos puntos que podrían ser añadidos. Simplemente es un punto de partida. Entre sus usos prácticos, incluye:- Demostrar la amplitud de los estándares web.
- Como una herramienta práctica para los desarrolladores durante la fase de la producción de sitios web.
- Como una ayuda para los desarrolladores que están interesados en la migración hacia estándares web.
La lista se divide en 6 categorías:- Calidad del código
- Grado de separación entre el contenido y su presentación
- Accesibilidad para usuarios
- Accesibilidad para dispositivos
- Usabilidad básica
- Gestión del sitio
La lista de comprobaciones:
- Calidad del código
1. ¿Usa el sitio un correcto Doctype?
2. ¿Usa el sitio un juego de caractéres (charset)?
3. ¿El sitio utiliza código (X)HTML válido?
4. ¿El sitio utiliza código CSS válido?
5. ¿Usa el sitio cortes (hacks) en el código CSS?
6. ¿Usa el sitio 'clases' o 'ids' innecesarias?
7. ¿Está el código bien estructurado?
8. ¿Contiene el sitio algún enlace roto?
9. ¿Cómo responde el sitio en términos de velocidad y peso de sus páginas?
10. ¿Tiene el sitio errores de JavaScript? - Grado de separación entre el contenido y su presentación
1. ¿Utiliza el sitio CSS para todos los aspectos de la presentación (tipografía, colores, márgenes, bordes, etc.)?
2. ¿Están todas las imágenes decorativas dentro del código CSS, o aparecen en el código (X)HTML? - Accesibilidad para usuarios
1. ¿Se utilizan los atributos "alt" para todas las imágenes descriptivas?
2. ¿El sitio utiliza unidades relativas en lugar de absolutas para el tamaño del texto?
3. ¿Se rompen algunos aspectos de la disposición si se aumenta el tamaño de fuente?
4. ¿El sitio utiliza menús de salto visibles?
5. ¿Usa el sitio formularios accesibles?
6. ¿Usa el sitio tablas accesibles?
7. ¿Hay suficientes brillos / contrastes de color?
8. ¿Está usado el color sólo para la información crítica?
9. ¿Existe un retraso en la respuesta de los menús desplegables 'dropdown' (para los usuarios con habilidades motoras reducidas)?
10. ¿Son todos los enlaces descriptivos (para usuarios invidentes)? - Accesibilidad para dispositivos
1. ¿Funciona el sitio aceptablemente en los navegadores modernos y los más viejos?
2. ¿El contenido es accesible con el CSS desactivado o no soportado?
3. ¿El contenido es accesible con las imágenes desactivadas o no soportadas?
4. ¿El sitio funciona en navegadores de texto tales como Lynx?
5. ¿El sitio funciona bien cuando está imprimido?
6. ¿El sitio funciona bien en los dispositivos de mano?
7. ¿El sitio incluye metadatos detallados?
8. ¿El sitio funciona bien en un rango de los tamaños de la ventana del navegador? - Usabilidad básica
1. ¿Existe una jerarquía visual clara?
2. ¿Son los niveles del encabezamiento fáciles de distinguir?
3. ¿El sitio dispone de una navegación fácil entender?
4. ¿El sitio utiliza una navegación consistente?
5. ¿Los enlaces están subrayados?
6. ¿Utiliza el sitio un lenguaje consistente y apropiado?
7. ¿Dispones de un mapa del sitio y una página de contacto? ¿Son fáciles de encontrar?
8. Para los sitios grandes, ¿hay una herramienta de búsqueda?
9. ¿Hay un enlace a la página principal o de entrada en cada página del sitio?
10. ¿Los enlaces visitados se definen claramente con un color único? - Gestión del sitio
1. ¿El sitio tiene una página de error 404 significativa y de ayuda que funcione a cualquier profundidad en el sitio?
2. ¿El sitio utiliza URLs amigables?
3. ¿Tus URLs funcionan sin "www"?
4. ¿Dispone el sitio de un favicon?