Errores comunes XHTML en WordPress

Agosto 28th, 2008 by planetawordpress

Una vez que te adentras en las interioridades del código de WordPress, y le pierdes el miedo a aprender y utilizar un poco de código en tu blog, es bastante frecuente no tener en cuenta algunas de las reglas de XHTML.

Y es que la mayoría de los themes WordPress, así como la estructura interna del mismo, utilizan estándares XHTML, similar a HTML pero mas maduro y estable. A pesar de ello, hay algunas reglas a seguir para evitar incurrir en errores que, en ocasiones, pueden arruinar el aspecto de nuestro blog o los artículos que publiquemos. Vamos a ver los mas comunes …

Cierra todas las Tags

XHTML requiere el cierre de todas las tags. Por ejemplo, en HTML puedes abrir una tag <p> y no cerrarla y tu código validará, pero no en XHTML, y es posible que obtengas errores de visualización no deseados. Es por ello que siempre debes cerrar las tags. Siempre se ha recomendado hacerlo pero con XHTML “hay que hacerlo”.

El modo incorrecto de hacerlo sería este:

<p>Esto es un párrafo

Y el correcto este otro:

<p>Esto es un párrafo</p>

Tags con auto-cierre

XHTML hace énfasis en cerrar TODAS LAS TAGS, no solo las abiertas. Hay algunos elementos como los saltos de línea o las imágenes que no tenían tags de cierre en HTML pero tienen auto-cierre en XHTML.

Las Tags que que requieren auto-cierre son estas:

<br> <hr> <meta> <link> <input> <img>

Para aplicar el auto-cierre hay que añadir /> al final. Por ejemplo:

HTML:

  1. <br />
  2. <hr />
  3. <meta name=“author” content=“Tu nombre” />
  4. <link rel=“stylesheet” type=“text/css” href=“style.css” />
  5. <input name=“ejemplo” type=“text” />
  6. <img src=“foto.jpg” alt=“foto” />

Orden de las Tags

Otro error muy habitual es la colocación de los cierres de tags cuando se aúnan varias en un mismo elemento. Por ejemplo:

HTML:

  1. <strong><em><u>Coloco las tags como quiero porque soy mas chulo que tu.</strong></u></em>

debería ser así:

HTML:

  1. <strong><em><u>Coloco las tags para que validen correctamente.</u></em></strong>

Las Tags deben ir en minúsculas

Olvídate de virguerías como <StronG>Esto va en negrita chula porque ella lo vale</StronG> y ponlo correctamente:

HTML:

  1. <strong>Esto va en negrita chula porque ella lo vale</strong>

Las imágenes deben tener un texto alternativo

Y un texto alternativo no es un parlamento ni descripción de lo que se te pase por la cabeza al verla, sino un texto que “describa la imágen”. O sea, que si pones una foto de un atardecer no pongas algo como …

HTML:

  1. <img src=“atardecer.jpg” alt=“Mi amor por ti me recuerda a la penumbra del sol ocultándose en la montaña” />

sino que debes hacerlo así …

HTML:

  1. <img src=“atardecer.jpg” alt=“atardecer en la montaña” />

Bien, pues eso es todo, espero no haberte aburrido, que esto del código es lo que tiene. Y espero que a partir de ahora, cuando vayas a escribir algo de código te acuerdes de estas sencillas reglas XHTML y así, de paso, valides correctamente tu blog.

Comments are closed.