Buenas, quería felicitarlos por modificar el sitio de SoLAr y buscar validar el sitio ante la W3C. Aunque creo que la modificación es parcial, la recomendación de la W3C define varias pautas para lograr una Web accesible y correcta. Durante varias horas intenté aplicar la recomendación a una copia de la página principal de www.solar.org.ar, y mientras lo intentaba escribí un listado de cambios: http://www.loosersjuegos.com.ar/ejemplo_solar/index.html http://www.loosersjuegos.com.ar/ejemplo_solar/solar.tgz Quienes utilicen Mozilla/Firefox pueden alterar la estética del sitio seleccionando el menú "view->page style". Importante: los archivos están editados desde GNU/Linux con el editor VIM; puede que algunos editores de texto para Windows no quieran leerlos correctamente, por ejemplo, notepad. Para esos casos les recomiendo algunos programas: - Mozilla Firefox (view->page source) - Metapad - gvim Cambios realizados: 1 - Uno de los objetivos más importantes de la recomendación es separar el contenido (HTML) del diseño (CSS), de forma que el sitio sea accesible por diferentes navegadores y dispositivos (celulares, PDAs, etc.). Para lograr esto se deben cambiar varias referencias a imágenes y tablas (de tablas escribo mas adelante): - En los archivos HTML deben existir referencias estructurales como: "<div id="logo"></div>" en lugar de la imagen directamente: "<img src="logo_encabezado...". ¿Donde esta la diferencia? Cuando queramos cambiar la apariencia del sitio simplemente modificamos la hoja de estilo (CSS) sin preocuparnos por cada archivo HTML. 2 - Estructurar una pagina en varias secciones de información (cabecera, listas de correo, noticias, pie de pagina, etc) recibe el nombre de maquetación, lo correcto es definir estas estructuras utilizando bloques <DIV> que son definidos visualmente en los archivos (CSS), en lugar de tablas que mezclan el contenido con el diseño, son lentas y llevan a utilizar propiedades no recomendadas como bgcolor, border, etc. 3 - Existen diferentes declaraciones de documentos HTML: estrict transitional - permite algunas propiedades anticuadas como 'bgcolor' frameset - permite 'frames' Lo ideal, es generar documentos HTML de tipo estrict y realizar todos los cambios necesarios en favor de una Web correcta y en evolución. 4 - Actualmente el sitio utiliza el DTD transitional, es por eso que la validación se puede lograr utilizando etiquetas 'font' y tablas. Las etiquetas 'font' están en desuso y esperemos que dejen de ser utilizadas pronto, ya que aumentan mucho el tamaño de las páginas y mezclan el diseño con su contenido. 5 - Evitar el uso de JavaScript, existen tecnologías mas adecuadas que no dependen específicamente de un navegador o dispositivo. Además, en la mayoría de los casos las "cualidades" de JavaScript no aportan demasiado, se pueden evitar. 6 - No se deben utilizar archivos GIF por 2 razones: - técnica: el formato PNG supera la calidad (> 8 bit) y tiene soporte para canal alpha. El formato PNG también es recomendado por la W3C como reemplazo del GIF. - conceptual: La FSF (www.gnu.org) explica con detalles el problema de patentes que aquejan al formato y al Software Libre. 7 - Se deben utilizar tamaños relativos para que cualquier usuario, aunque utilice una resolución de 640x480, pueda ver el sitio sin problemas. 8 - El tamaño de la pagina principal en linea es de 46.000 bytes (aprox), pero utilizando HTML + CSS el tamaño es de 16.000 bytes (13.000 de HTML y 3.000 de CSS). ------------------ Por último; se que puede parecer complejo realizar tantos cambios al principio pero creo que, al menos el último punto, muestra una ventaja muy importante de seguir la propuesta de la W3C, y como dije al principio, no se trata simplemente de validar un sitio o hacerlo visible en varios navegadores. La recomendación busca crear una Web cada vez mas accesible, eficiente y evolucionada. Si puedo ayudarles en algo avisen. Los dejo con algunos proyectos que muestran las ventajas de este modelo: www.guadalinex.com (castellano, disto GNU/Linux) www.camaleoncss.com (castellano) www.csszengarden.com (inglés) ===== Hugo Ruscitti www.loosersjuegos.com.ar __________________________________________________ Correo Yahoo! Espacio para todos tus mensajes, antivirus y antispam ¡gratis! ¡Abrí tu cuenta ya! - http://correo.yahoo.com.ar