Validador HTML
Pega tu HTML o abre un archivo para encontrar errores al instante: etiquetas sin cerrar o mal anidadas, etiquetas de cierre sobrantes, IDs duplicados, elementos obsoletos, falta de texto alternativo y más. Haz clic en cualquier problema para ir a su línea, o pasa el mismo código por el validador oficial W3C Nu HTML Checker.
Última actualización:
La opción W3C envía tu HTML a validator.w3.org (el Nu HTML Checker oficial) para comprobarlo. Usa el comprobador integrado para código privado.
Consejo: pulsa Ctrl + Intro para validar y haz clic en un problema para ir a su línea y columna en el editor.
Cómo usar Validador HTML
- Pega tu HTML en el editor o haz clic en Abrir archivo para cargar un archivo .html.
- Elige el validador: el comprobador integrado (privado e instantáneo) o el W3C Nu HTML Checker (online).
- Haz clic en Validar HTML o pulsa Ctrl + Intro. Con Validar mientras escribo activado, el comprobador integrado se actualiza mientras editas.
- Haz clic en un problema para ir a la línea y la columna exactas; la línea se resalta en el editor.
- Corrige y vuelve a comprobar hasta que el resumen no muestre errores, y luego copia o descarga el informe si lo necesitas.
Errores HTML comunes y cómo corregirlos
| Mensaje | Qué significa | Solución |
|---|---|---|
Unclosed element div | Un elemento que necesita etiqueta de cierre nunca se cerró, así que todo lo que viene después pasa a ser su contenido. | Añade </div> donde termina el elemento; un editor con plegado de código hace que el hueco sea fácil de ver. |
Stray end tag span | Una etiqueta de cierre no tiene ningún elemento abierto que le corresponda, a menudo por una errata o un copiar y pegar. | Elimínala o añade la etiqueta de apertura que falta. |
End tag a seen, but element b was never closed | Las etiquetas se solapan, p. ej. <a><b>…</a></b>. | Cierra primero los elementos interiores: <a><b>…</b></a>. |
Element div not allowed as child of element span | Contenido de bloque (flujo) dentro de un elemento en línea (de frase). | Cambia el elemento exterior por un div, o el interior por un span. |
Element div not allowed as child of element ul | Las listas solo pueden contener directamente elementos li. | Envuelve el contenido en <li>. |
Duplicate ID intro | Dos elementos comparten un id, lo que rompe anclas, etiquetas, CSS y scripts. | Haz que cada id sea único, o usa una clase para los estilos compartidos. |
An img element must have an alt attribute | Los lectores de pantalla y los buscadores necesitan una alternativa de texto. | Describe la imagen o usa alt="" si es decorativa. |
The center element is obsolete | HTML de presentación de los años 90 que HTML5 eliminó. | Usa CSS: text-align:center o margin:0 auto. |
| Named character reference was not terminated by a semicolon | A una entidad como © le falta su ;. | Escribe ©, o & para un ampersand literal. |
Errores, avisos y consejos
Los errores son infracciones del estándar HTML: los navegadores seguirán mostrando la página, pero deben adivinar cómo repararla y pueden construir un árbol de documento distinto del que pretendías, lo que puede romper selectores CSS, JavaScript y lectores de pantalla. Los avisos señalan marcado válido que probablemente no es lo que querías, como una sección sin encabezado o un campo de formulario sin etiqueta. Los consejos son buenas prácticas opcionales, como declarar <meta charset="utf-8"> y una etiqueta viewport.
El documento HTML5 válido mínimo es breve: <!DOCTYPE html>, un elemento <html lang="en">, un <head> con <meta charset="utf-8"> y un <title> no vacío, y un <body>. Si la entrada no tiene doctype ni etiquetas html, head o body, se comprueba como un fragmento y se omiten las reglas a nivel de documento, así que puedes validar un fragmento o un componente por separado.
Preguntas frecuentes
¿Qué comprueba un validador HTML?
Compara tu marcado con las reglas del HTML Living Standard: si cada elemento está permitido donde aparece, si las etiquetas se abren y cierran en el orden correcto, si están presentes los atributos obligatorios como alt en las imágenes, si los IDs son únicos y si no se usan elementos ni atributos obsoletos. Los navegadores reparan en silencio el HTML no válido, a menudo de formas distintas, así que la validación detecta los problemas antes de que se conviertan en fallos de diseño, accesibilidad o SEO.
¿Qué diferencia hay entre el comprobador integrado y el validador del W3C?
El comprobador integrado se ejecuta localmente en tu navegador, así que no se sube nada y los resultados aparecen mientras escribes. Cubre los errores más comunes. La opción W3C envía tu HTML al Nu HTML Checker oficial en validator.w3.org, que implementa la especificación completa, incluido cada valor de atributo; úsalo para una comprobación final de las páginas públicas.
¿Por qué me aparece 'No p element in scope but a p end tag seen'?
Un párrafo no puede contener elementos de bloque. Cuando el analizador encuentra un div, una lista, una tabla o un encabezado dentro de un p, cierra el párrafo automáticamente, así que tu </p> posterior no tiene nada que cerrar. Usa un div como elemento exterior o termina el párrafo antes del bloque.
¿Tengo que cerrar todas las etiquetas en HTML5?
No. Los elementos vacíos como br, img, input y meta nunca tienen etiqueta de cierre, y algunos elementos tienen etiquetas de cierre opcionales, como p, li, td, tr, option, html, head y body. Todos los demás elementos, como div, span, a, section y ul, deben cerrarse explícitamente, y en el orden inverso al que se abrieron.
¿<br/> o <img ... /> no son válidos?
Sí son válidos. Una barra final en un elemento vacío está permitida y simplemente se ignora, así que el validador solo muestra un consejo. En los elementos que no son vacíos, como <div/>, la barra también se ignora, lo que significa que el elemento queda abierto y suele tragarse el contenido que viene después, por eso se indica como error.
¿Un HTML válido mejora el SEO?
Los buscadores pueden leer la mayor parte del HTML no válido, y Google ha dicho que la validación no es un factor de posicionamiento directo. Aun así, los errores importan de forma indirecta: un title que falta, una etiqueta sin cerrar que oculta contenido, la falta de texto alternativo o una estructura de encabezados rota pueden afectar a cómo se indexa y se muestra una página y a cómo la usan las personas con tecnologías de apoyo.
¿Puede validar archivos PHP, React o plantillas?
Solo el HTML que generan. El código del servidor como <?php ... ?> o las etiquetas de plantilla como {{ ... }} no son HTML, así que ejecuta la página y valida el código fuente generado (Ver código fuente de la página en tu navegador) en lugar de la plantilla.
¿Se prueban todas las herramientas de FreeToolCabin para comprobar su calidad y precisión?
Sí. Cada herramienta del sitio pasa pruebas automáticas en navegadores reales para comprobar que el resultado es correcto y que no hay errores. Si encuentras un fallo o tienes una sugerencia, escríbenos a [email protected] y lo revisaremos.