[Solar-general] Recomendacion de la W3C y el sitio www.solar.org.ar

Hugo Ruscitti hugoruscitti en yahoo.com.ar
Vie Ene 28 11:36:36 CET 2005


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



Más información sobre la lista de distribución Solar-general