Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Roundups

10 razones por las que tu código no se valida (y cómo solucionarlo)

by
Read Time:4 minsLanguages:

Spanish (Español) translation by Valeria Angulo (you can also view the original English article)

La validación del W3C no es muy permisiva a veces, pero te permite ver los errores generados por el código (markup). Muchos errores y advertencias lanzados por el validador son un buen indicador de que tu XHTML no está en muy buenas condiciones y puede que no parezca consistente en diferentes navegadores. Aquí hay 10 problemas de validación furtivos que hacen tropezar a los desarrolladores y cómo evitarlos.

Antes de comenzar, aquí hay algunas buenas prácticas para recordar al usar el validador W3C.

  • No te preocupes por las advertencias: si el validador dice que tiene 12 errores y 83 advertencias, solo preocúpate por los errores por ahora.
  • Elimina los errores uno a la vez: avanza hacia abajo en la lista, de arriba hacia abajo, eliminando los errores uno a la vez. Los navegadores leen el HTML de arriba a abajo, por lo que los errores se muestran de la misma manera.
  • Vuelve a validar el código después de cada corrección: a menudo, un error puede causar varios errores en la página. Alternativamente, algunas "correcciones" pueden causar más errores, si se hacen incorrectamente. Revalidar después de cada intento puedes garantizar que está solucionando completamente el problema.

Con esos consejos básicos fuera del camino, echemos un vistazo a algunas de las razones por las que tu código de marcado no se está validando.

1. Una etiqueta div sin cerrar

Una de las razones más comunes por las que los diseños no se validan. Nunca deja de sorprender la frecuencia con la que este es el culpable de un diseño original. Las etiquetas div sin cerrar son uno de los errores de diseño más comunes y también uno de los más difíciles de diagnosticar. El validador no siempre apunta a la etiqueta div sin cerrar adecuada, por lo que no siempre es fácil encontrar la aguja en el pajar.

2. Una etiqueta embed no autorizada

A principios de los 90, los navegadores como Microsoft y Netscape empezaron a reconocer declaraciones de fuentes únicas que nunca fueron estandarizadas. Desgraciadamente, esto significa que el validador del W3C sigue sin reconocer algunas etiquetas HTML importantes, como "embed", a pesar de que su uso está muy extendido en la actualidad. Si realmente quieres conseguir esa validación estricta del DOCTYPE, tendrás que deshacerte del embed.

Si realmente quieres tener un marcado válido y medios incrustados, intenta usar el método Flash Satay.

3. Declaración incorrecta del DOCTYPE

Un error frecuente es no declarar un DOCTYPE, o declarar el DOCTYPE incorrecto en la cabecera del documento. Como regla general, el DOCTYPE estricto es la validación más alta a la que se debe aspirar. La validación estricta significa que tus páginas web tienen la mejor oportunidad de mostrarse correctamente en todos los navegadores. Este es el aspecto de una declaración estricta:

4. Barra diagonal final

Si tu sitio no se valida correctamente, es muy probable que la razón sea la falta de una barra diagonal en algún lugar de tu código. Es muy fácil pasar por alto algo como una barra diagonal, especialmente en elementos como las etiquetas de imagen. Por ejemplo:

Esto no se validará con un DOCTYPE estricto. Agrega un '/' antes de que termines la etiqueta img en todos los casos para resolver el problema.

5. Alinear

Estarás bien usando la etiqueta "align" si tu DOCTYPE está configurado en Transicional, pero si has tomado el camino más alto y has elegido una validación estricta, verás errores. Align es otra etiqueta depreciada que ya no debería usarse en el código markup. En lugar de alinear, intenta usar float o text-align para desplazar el elemento.

6. JavaScript

Si has declarado un DOCTYPE estricto, deberás envolver etiquetas CDATA alrededor de tu código JavaScript. Este aspecto de la validación ha hecho tropezar a muchos desarrolladores, ya que los sitios tienden a usar JavaScript en línea para cosas como anuncios y scripts de seguimiento. Si tienes que incluir JavaScript, simplemente agrega estas etiquetas antes y después:

7. Las imágenes siempre necesitan atributos "alt"

Si aún no lo has notado, las imágenes son un obstáculo potencial importante para una buena validación. Además de las barras diagonales, también requieren etiquetas alt que describan imágenes, es decir, alt = "Imagen de vampiro aterradora".

Los motores de búsqueda también confían en esta etiqueta alt para ayudar a identificar imágenes en la página, por lo que es una buena práctica agregar las etiquetas alt de todos modos.

8. Entidades desconocidas

Las entidades son otro pequeño inconveniente que tiende a obstaculizar la validación. En lugar de utilizar elementos como el símbolo "&", es una buena idea utilizar caracteres codificados correctamente. Aquí hay una lista completa de entidades de caracteres codificadas correctamente para usar en el marcado XHTML.

9. Mal anidamiento

El anidamiento es cuando tienes elementos dentro de elementos, así:

Es bastante fácil confundirse, y la mezcla es el orden de los elementos anidados. Por ejemplo, empezando la etiqueta strong antes de la etiqueta div, pero cerrando la etiqueta div primero. Esto puede no alterar el aspecto del diseño, pero definitivamente evitará que tu código de marcado se valide.

10. No hay etiqueta 'title'

Aunque puede parecer un problema obvio, muchos desarrolladores (incluido yo mismo), siguen dejando fuera la etiqueta 'title' en la sección 'head' de vez en cuando. Si ves el error "missing a required sub-element of HEAD", entonces sabes que te falta una etiqueta title.

Si te ha resultado útil este post, por favor, vota por él en Digg.

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.