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:
<br /> <hr /> <meta name="author" content="Tu nombre" /> <link rel="stylesheet" type="text/css" href="style.css" /> <input name="ejemplo" type="text" /> <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:
<strong><em><u>Coloco las tags como quiero porque soy mas chulo que tu.</strong></u></em>
debería ser así:
<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:
<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 …
<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í …
<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.













11 comentarios en “Errores comunes XHTML en WordPress”
Información Bitacoras.com…
Si lo deseas, puedes hacer click para valorar este post en Bitacoras.com. Gracias….
Lo de las imágenes es el típico “error” de vago… osea yo…
Saludos
Lo de las imágenes también puede ser con el tag alt pero sin una descripción: alt=”"
Aunque lo mejor es siempre ponerle algún texto que describa la imágen por si acaso se rompe, porque por ejemplo en FF no veríamos absolutamente nada si la imágen no está, pero al tener el texto veríamos eso (con IE se ve la famosa X roja)
Edit: bueno, no me toma lo que puse como ejemplo de código, pero creo que se entendió =P
[...] Errores comunes XHTML en WordPresayudawordpress.com/errores-comunes-xthml-en-wordpress/ por Khaos hace pocos segundos [...]
en “Orden de las Tags” no veo la diferencia entre los ejemplos
Anda, me lo ha corregido el WP
Ahora lo cambio, gracias por el aviso
¡Hala, ya está descabalado!
ya me parecia… yo siempre trato de tenerlo ordenadito a todo
jeje. saludos!
Otro articulo delicioso. Gracias, soy una bestia dejando etiquetas abiertas y luego lloro porque se ve horrible el blog.
Y mira que a mi me enseñan HTML puro en vez de XHTML en la universidad, bueno yo seguire los estandares y las nuevas tendencias para un mejor desarrollo de la web. Gracias por el dato!
Hola!!!
Podrias explicarme el afan que tiene wordpress por cerrarme y abrirme por todas partes???, es este el tipo de cosas que hacen que mi codigo sea invalido…
Escribe un Comentario
Si quieres aprender como hacer multitud de diseños distintos para WordPress no te pierdas esta estupenda recopilación de 26 tutoriales de diseño de blogs WordPress.
[#3]
Acaba de salir a la luz la nueva versión de WordPress para iPhone 1.3, con soporte completo para el firmware de iPhone 3.0. Va
de cojonesestupendamente. Altamente recomendable esta actualización, que tienes en iTunes.[#1]
Me avisa Kike Alonso de un nuevo plugin que permite que los comentarios que dejen tus amigos de Friendfeed al respecto de un post de tu sitio WordPress aparezcan también en tu post como comentarios normales, algo realmente interesante pues permite, con algunos clientes de escritorio e iPhone, comentar en blogs sin dejar de usar la aplicación de mensajería.
[#6]
Último mensaje de: zonademagia
En el foro: General WordPress.org
Último mensaje de: eumendoza
En el foro: Plugins
Último mensaje de: xMeNux
En el foro: General WordPress.org
Último mensaje de: Anonymousy
En el foro: Instalación / Actualización
Último mensaje de: Merlyn
En el foro: Themes y Diseño
Acceder