HTML5 | Herramienta de verificación de etiquetas abiertas

Nota: Cuando algunas etiquetas no se cierran correctamente, se puede producir un efecto de bola de nieve en el que se muestra que muchas etiquetas no están cerradas. La mayoría de las veces, el culpable se encuentra en la mitad inferior de la lista de errores, en el medio o después de la lista. último elemento en la lista de errores, y corregir las etiquetas abiertas daría como resultado que todo el documento pase la verificación (suponiendo que la entrada proporcionada sea un código HTML5 válido). Si el código es largo, a veces puede resultar útil dividirlo en fragmentos más pequeños para limitar las etiquetas que no están cerradas.

Optimice su codificación HTML con nuestra herramienta de vanguardia que detecta fácilmente etiquetas abiertas, lo que garantiza que su código permanezca libre de errores y que sus páginas web se muestren perfectamente. Pegue su código en el área de arriba para averiguar si hay etiquetas HTML5 sin cerrar.

HTML5 es el último estándar de lenguaje de marcado de hipertexto y ofrece funciones y capacidades avanzadas para crear contenido web moderno.

Mantener un código HTML libre de errores con etiquetas correctamente cerradas es crucial para un rendimiento sólido de SEO, mejorar la accesibilidad del sitio web y garantizar una experiencia de usuario perfecta.

Etiquetas HTML

HTML presenta etiquetas cerradas automáticamente para elementos concisos como imágenes ('<img>') y etiquetas normales que encierran contenido, como párrafos ('<p>'), lo que proporciona formas versátiles de estructurar. contenido web.

Etiquetas autocerradas

• '<area />': define un área en la que se puede hacer clic dentro de un mapa de imagen.
• '<base />': especifica una URL base para las URL relativas de un documento.
• '<br />': inserta un salto de línea dentro del texto o contenido.
• '<circle />': Define una ruta circular dentro de SVG (Gráficos vectoriales escalables).
• '<col />': Especifica propiedades de columna para tablas HTML.
• '<embed />': incorpora contenido externo, como multimedia o complementos.
• '<hr />': Crea un salto temático o una línea horizontal.
• '<img />': incrusta una imagen en el documento.
• '<input />': Define un elemento de entrada del usuario.
• '<link />': vincula recursos externos como hojas de estilo o íconos.
• '<meta />': proporciona metadatos sobre el documento.
• '<param />': Especifica parámetros para complementos dentro de elementos de objeto.
• '<path />': Define una ruta vectorial dentro de SVG (Gráficos vectoriales escalables).
• '<source />': Especifica múltiples recursos multimedia para elementos multimedia.
• '<track />': Proporciona pistas de texto para elementos multimedia como '<video>' o '<audio>'.
• '<wbr />': Define una oportunidad de salto de palabra dentro del texto.
• '<command />': Define un botón de comando dentro de un menú.
• '<keygen />': Genera un par de claves para formularios utilizados en criptografía.
• '<menuitem />': Define un elemento dentro de un '<menu>'.
• '<frame />': Define una subventana (obsoleta en HTML5).

Etiquetas regulares

• '<p>': define un párrafo.
• '<h1> to <h6>': Títulos de diferentes niveles.
• '<strong>': Representa una gran importancia.
• '<em>': Representa texto enfatizado.
• '<mark>': Resalta el texto como referencia.
• '<abbr>': Define una abreviatura.
• '<blockquote>': Representa una cita en bloque.
• '<ul>': Define una lista desordenada.
• '<ol>': Define una lista ordenada.
• '<li>': Representa un elemento de la lista.
• '<dl>': Define una lista de descripción.
• '<dt>': Representa un término en una lista de descripción.
• '<dd>': Representa una descripción en una lista de descripciones.
• '<a>': Define un hipervínculo.
• '<nav>': Representa enlaces de navegación.
• '<audio>': incorpora contenido de audio.
• '<video>': inserta contenido de vídeo.
• '<form>': Define un formulario HTML.
• '<textarea>': Crea una entrada de texto de varias líneas.
• '<select>': Crea una lista desplegable.
• '<button>': Define un botón en el que se puede hacer clic.
• '<table>': Define una tabla HTML.
• '<thead>': Define el encabezado de una tabla.
• '<tbody>': Define el contenido del cuerpo de una tabla.
• '<tr>': Define una fila de la tabla.
• '<th>': Define una celda de encabezado de tabla.
• '<td>': Define una celda de datos de tabla.
• '<caption>': Proporciona un título para una tabla.
• '<div>': Define un contenedor genérico.
• '<span>': define texto con estilo en línea.
• '<header>': Representa un documento o encabezado de sección.
• '<footer>': Representa un documento o pie de página de sección.
• '<section>': Representa una agrupación temática de contenido.
• '<article>': Representa un contenido independiente.
• '<aside>': Representa contenido relacionado tangencialmente con el contenido circundante.
• '<button>': Define un botón en el que se puede hacer clic.
• '<details>': Representa un widget de divulgación.
• '<summary>': Proporciona un resumen de un elemento '<details>'.
• '<object>': incorpora contenido o recursos externos.
• '<iframe>': incorpora un contexto de navegación anidado.
• '<canvas>': Incrusta gráficos mediante secuencias de comandos.
• '<svg>': Incorpora gráficos vectoriales escalables.
• '<math>': incorpora ecuaciones matemáticas.
• '<time>': Representa un tiempo o rango específico.
• '<address>': Representa información de contacto.
• '<code>': Representa texto de código de computadora.
• '<pre>': Representa texto preformateado.
• '<fieldset>': Agrupa elementos de formulario relacionados.
• '<legend>': Proporciona un título para '<fieldset>'.
• '<ruby>': Representa anotaciones para tipografía de Asia Oriental.
• '<rt>': Representa la pronunciación de los caracteres en un elemento '<ruby>'.

Tenga en cuenta que las listas anteriores solo incluyen algunas de las etiquetas HTML comunes con y sin cierre automático (normales), pero hay muchas más etiquetas disponibles en HTML5 para diversos fines.

Glosario

• Verificar código HTML para etiquetas no cerradas: el botón que ejecuta el proceso de verificación.
• Línea: el texto que precede a los números de línea, donde se detectaron las etiquetas que no tienen contrapartes de cierre.
• No se detectaron etiquetas sin cerrar.: El mensaje cuando todas las etiquetas HTML están cerradas correctamente.
• Pegue su código HTML aquí...: El área donde va el código HTML, para verificar las etiquetas no cerradas/faltantes.
• La siguiente etiqueta no parece estar cerrada: En caso de que haya una etiqueta no cerrada en el código.
• Las siguientes etiquetas no parecen estar cerradas: En caso de que haya dos o más etiquetas no cerradas en el código.

Conclusión

Cerrar correctamente las etiquetas HTML es de suma importancia en el desarrollo web. Cada etiqueta sirve como una instrucción crucial para que los navegadores interpreten y representen el contenido con precisión. No cerrar las etiquetas puede provocar problemas de diseño no deseados, malas interpretaciones del contenido y experiencias de usuario inconsistentes en diferentes dispositivos y navegadores. Esta meticulosa atención al detalle no sólo garantiza una interfaz de usuario perfecta y visualmente agradable, sino que también admite accesibilidad y optimización de motores de búsqueda. Al seguir la mejor práctica de cerrar etiquetas HTML, los desarrolladores salvaguardan la integridad de su código, fomentando sitios web confiables, accesibles y fáciles de usar que transmiten información de manera efectiva y al mismo tiempo mantienen una presentación visual consistente.