Empezamos con el tema de diseño web, temporalmente.
En esta entrada hablaremos de W3C.
W3C significa "World Wide Web Consultorium", es decir, un consultorio de la WWW. Como tal, tiene herramientas específicas para validar nuestro HTML, CSS... e incluso tiene manuales de referncia de los mismos (incluyendo JS).
Pero, ¿Qué es "validar" un HTML?
Veréis, muchas veces codificamos de manera "no estándar" nuestras web. Esto no significa que estén mal, sino que no es un documento estándar, acorde con las directrices de W3C.
Hoy en día no pasa nada, ya que la mayoría de los navegadores incluyen funciones que "estandarizan" nuestro HTML; pero antaño, no seguir un estándar daba webs muy diferentes dependiendo del navegador.
Bien, ahora no penséis que los estándares son muy complicados... voy a dejar una lista de elementos generales a cumplir para el estándar de la W3C:
- Cerrar los elementos que no tienen etiqueta de cierre:
- Ejemplo:
- <br> no es estándar
- <br /> es estándar
- <meta ...> no es estándar
- <meta ... /> no es estándar
- Si bien no es obligatorio, a mi me gusta dejar un espacio antes del cierre ("/").
- Entrecomillar los atributos
- Ejemplo:
- <div class=clase1> no es estándar
- <div class="clase1"> es estándar
- <img src=./img/css/icon.png> no es estándar
- <img src="./img/css/icon.png> tampoco es estándar (falta cerrar el elemento)
- <img src="./img/css/icon.png" /> es estándar
- Cumplir los requisitos básicos de las diferentes etiquetas:
- <head>
- Tiene que tener el tag "title" dentro
- <img>
- Tiene que tener los atributos "src" y "alt"
- <a>
- Tiene que tener el atributo "src"
- <html>
- Tiene que tener un "charset" definido
- <form>
- Tiene que tener los atributos "name", "action" y "method"
- <input>
- Tiene que tener el atributo "type" y "name"
- <ul>, <ol>
- Tiene que tener el atributo "type"
Creo que no me dejo ningún elemento en el tintero... como veis, no es demasiado complicado cumplir con el W3C (al menos con webs simples o muy poco complejas).
El "problema", por así decirlo, viene cuando programamos en PHP (por ejemplo). El uso de comillas se puede hacer algo caótico, sobretodo si hacemos JavaScript dinámico en el que llamamos a funciones con parámetros en forma de cadena (que va entrecomillada...)
Mi sugerencia: en PHP usad (siempre que podáis) las comillas simples, y los textos entrecomillados usando la doble comilla.
Vale, todo esto es muy bonito, pero, ¿Qué implica al diseño con la W3C? para responder haré una pequeña reflexión:
Continuamente salen nuevos aparatos tecnológicos que implementan, de alguna u otra manera, la tecnología de Internet.
Éstos nuevos dispositivos implementarán unas u otras reglas, y éstas pueden o no paliar una codificación "no estándar".
A continuación hago un ejemplo drástico, para que se vea la diferencia:
- Si haces un documento así:
<body><table><td>HOLA
y lo probamos en chrome, éste lo estructura internamente así (inspeccionando el elemento):
<html><head></head><body><table><tbody><tr><td>HOLA</td></tr></tbody></table></body></html>
Ahora se ve el cambio... ha puesto de todo. Y esto se debe a que los navegadores no vuelcan el código fuente directamente, sino que lo tratan previamente.
Puede que un nuevo navegador no incluya todo esto, por el motivo que sea (menor consumo de recursos, por ejemplo), y entonces... ¿qué pasaría con nuestra web? estaría a merced de los algoritmos del navegador, y la veríamos de vete-tú-a-saber-qué manera.
Sin embargo, en una web estándar W3C, la conversión que hace el navegador es nula, por lo que nos "da igual" cómo trate el código fuente, siempre (en teoría) se verá igual la web.
Éstos nuevos dispositivos implementarán unas u otras reglas, y éstas pueden o no paliar una codificación "no estándar".
A continuación hago un ejemplo drástico, para que se vea la diferencia:
- Si haces un documento así:
<body><table><td>HOLA
y lo probamos en chrome, éste lo estructura internamente así (inspeccionando el elemento):
<html><head></head><body><table><tbody><tr><td>HOLA</td></tr></tbody></table></body></html>
Ahora se ve el cambio... ha puesto de todo. Y esto se debe a que los navegadores no vuelcan el código fuente directamente, sino que lo tratan previamente.
Puede que un nuevo navegador no incluya todo esto, por el motivo que sea (menor consumo de recursos, por ejemplo), y entonces... ¿qué pasaría con nuestra web? estaría a merced de los algoritmos del navegador, y la veríamos de vete-tú-a-saber-qué manera.
Sin embargo, en una web estándar W3C, la conversión que hace el navegador es nula, por lo que nos "da igual" cómo trate el código fuente, siempre (en teoría) se verá igual la web.
Por este motivo siempre intento que las web cumplan el estándar.
Podéis pasar el test aquí: http://validator.w3.org/
Si pasáis el test, os saldrá un enlace para "colgar una medalla" en vuestra web. Con ella los visitantes sabrán que cumplís el estándar (y podéis "fardar" con ella, jeje ;-) )
La próxima entrada la llenaremos con contenido de "maquetar esqueletos a papel".
¡Hasta la próxima!
No hay comentarios:
Publicar un comentario