La fuerza del Estandar: XHTML + CSS2

Con esta serie de artículos espero animaros a conocer las tecnologías que han dado lugar a este Weblog, creado desde 0 y que ahora disfrutáis

Empezaremos preguntándonos: ¿Y que es XHTML?
- Básicamente se trata de coger el viejo y maltratado HTM y fijar unas reglas estrictas para devolver la L (Language) a nuestro compañero inseparable en esta gran red de redes

Se trata, por lo tanto, de usar cada etiqueta para el uso que explícitamente se creó. Por ejemplo, un servidor tenía la (mala) costumbre de hacer las típicas cajas de información usando tablas e imágenes dentro de ellas y claro esto, ahora ya no se permitiría…

La idea es que en el XHTML sólo encontremos el CONTENIDO de la web y nada más. Que se dice rápido, pero es algo que sin duda, cuando nos enfrentemos, a ello costará ser fiel… y en realidad yo no lo veo tanto culpa nuestra, sino quizás unos navegadores demasiado “permisivos”, que nos han mal acostumbrado años ha…

Por eso cuando hace pocos días me preguntaba SpankThru: ¿Y no es mejor saber algo de HTML antes de enfrentarte a XHTML?
Pues, evidentemente no. Ya que sufrirás lo mismo que le pasa al conductor que ha cogido el coche por sí mismo (o le ha enseñado otro conductor) que termina cogiendo ciertos malos hábitos, que luego costará sangre y sudor, no cometer

Si seguimos las directrices del W3C obtendremos algo como esto…
- !!¡¡DIOS MIO!!! ¿!¿!HEMOS VUELTO A LOS AÑOS 80!??!?!
- No hombre, no no te pongas nerviosillo, si aun no hemos empezado… xD

El ejercicio que quiero que hagas ahora es que veas el código fuente de la web, que aunque no esté muy bien indentado, verás que todo es perfectamente legible y sobretodo muy liviano. Atrás quedan aquellos HTM de 50Kb, esos mastodontes donde buscar la tabla que se había descuadrado era una tarea de chinos

La verdad que cuando usas esta tecnología te das cuenta de la cantidad de ventajas que rápidamente te da:

• Preguntémonos ¿Que indexará mejor google?
  Una página con miles de tablas y campos donde se mezcla contenido y diseño o…
  El ejemplo anterior, donde además cada etiqueta está cumpliendo su objetivo…
  Evidentemente, google lee ese mismo código que antes vimos y nos indexa antes, más facilmente y nos puntúa mejor… poned en google “David Colmenero” o “D_Skywalk” por si no lo tenéis muy claro aun xD
• Sera más fácil de mantener e incluso añadirle nuevas secciones o contenidos…
• Permitirá que personas con discapacidades puedan acceder sin problema a sus contenidos y la información por lo tanto se convertirá en universal…
• Dada su simplicidad cualquier navegador de mañana o prejurásico puede comprender y mostrarte sin problema el contenido de la web, ej: Visitad la web con Lynks
• Por último, en futuros capitulos veras, que NUNCA MÁS el contenido estropeará o dictará sobre el diseño; ya que como comprobarás ambos serán totalmente independientes. Pero no adelantemos acontecimientos…

- Muy bien todo, pero sigo sin estar del todo convencido: ¿Como meto ahí mis fantásticos diseños?

Pues ahí es donde entrará en juego la segunda parte de estos artículos: CSS2.
Pulsad aquí para comprobar los resultados y fijaos que lo único que cambia entre uno y otro es la línea que define el uso de las reglas CSS:

@import "/diseno/base.css";

Si he conseguido captar vuestra atención y queréis experimentar empezad instalándoos las extensiones de firefox que veas más útiles desde esta web. Personalmente yo uso: Webdeveloper, MeasureIt, Colorzilla y TidyHTML (animáos a usar este y veréis que pocas webs cumplen el estándar escrupulosamente).

Otros fantásticos sitios donde empezar a leer sobre estos temas son:
- blog.levhita.
- 100 Pixels. [LINK DOWN]
- Escuela W3.

Y Finalmente para que veas la potencia de XHTML CSS:

[CONTINUARÁ]

---