HTML5 | Ferramenta de verificação de tags não fechadas

Nota: Quando algumas tags não são fechadas corretamente, pode ocorrer um efeito bola de neve onde mostra que muitas tags não estão fechadas, na maioria das vezes, o culpado está localizado na metade inferior da lista de erros, no meio, ou após o último elemento na lista de erros, e corrigir as tags não fechadas resultaria na aprovação de todo o documento na verificação (assumindo que a entrada fornecida é um código HTML5 válido). Se o código for longo, às vezes pode ser útil dividi-lo em partes menores, para restringir as tags que não estão fechadas.

Simplifique sua codificação HTML com nossa ferramenta de ponta que detecta facilmente tags não fechadas, garantindo que seu código permaneça livre de erros e que suas páginas da web sejam exibidas perfeitamente. Cole seu código na área acima para descobrir se há alguma tag HTML5 não fechada.

HTML5 é o padrão mais recente de linguagem de marcação de hipertexto, oferecendo recursos e capacidades avançadas para a construção de conteúdo web moderno.

Manter o código HTML livre de erros com tags devidamente fechadas é crucial para um desempenho robusto de SEO, melhorando a acessibilidade do site e garantindo experiências de usuário perfeitas.

Etiquetas HTML

O HTML apresenta tags autofechadas para elementos concisos, como imagens ('<img>') e tags regulares que envolvem conteúdo, como parágrafos ('<p>'), fornecendo formas versáteis de estruturar conteúdo web.

Tags auto-fechadas

• '<area />': define uma área clicável dentro de um mapa de imagem.
• '<base />': especifica um URL base para URLs relativos em um documento.
• '<br />': insere uma quebra de linha no texto ou conteúdo.
• '<circle />': Define um caminho circular dentro de SVG (Scalable Vector Graphics).
• '<col />': especifica propriedades de coluna para tabelas HTML.
• '<embed />': incorpora conteúdo externo, como multimídia ou plug-ins.
• '<hr />': Cria uma quebra temática ou linha horizontal.
• '<img />': incorpora uma imagem no documento.
• '<input />': define um elemento de entrada do usuário.
• '<link />': vincula recursos externos como folhas de estilo ou ícones.
• '<meta />': fornece metadados sobre o documento.
• '<param />': especifica parâmetros para plug-ins em elementos de objeto.
• '<path />': Define um caminho vetorial dentro do SVG (Scalable Vector Graphics).
• '<source />': especifica vários recursos de mídia para elementos multimídia.
• '<track />': fornece faixas de texto para elementos de mídia como '<video>' ou '<audio>'.
• '<wbr />': Define uma oportunidade de quebra de palavra no texto.
• '<command />': Define um botão de comando dentro de um menu .
• '<keygen />': Gera par de chaves para formulários usados ​​em criptografia.
• '<menuitem />': Define um item dentro de um '<menu>'.
• '<frame />': Define uma subjanela (obsoleta em HTML5).

Tags regulares

• '<p>': Define um parágrafo.
• '<h1> to <h6>': Títulos de diferentes níveis.
• '<strong>': Representa grande importância.
• '<em>': Representa texto enfatizado.
• '<mark>': Destaca o texto para referência.
• '<abbr>': Define uma abreviatura.
• '<blockquote>': representa uma cotação em bloco.
• '<ul>': Define uma lista não ordenada.
• '<ol>': Define uma lista ordenada.
• '<li>': Representa um item da lista.
• '<dl>': Define uma lista de descrição.
• '<dt>': representa um termo em uma lista de descrição.
• '<dd>': representa uma descrição em uma lista de descrições.
• '<a>': Define um hiperlink.
• '<nav>': Representa links de navegação.
• '<audio>': incorpora conteúdo de áudio.
• '<video>': incorpora conteúdo de vídeo.
• '<form>': Define um formulário HTML.
• '<textarea>': Cria uma entrada de texto multilinha.
• '<select>': Cria uma lista suspensa.
• '<button>': Define um botão clicável.
• '<table>': Define uma tabela HTML.
• '<thead>': Define o cabeçalho de uma tabela.
• '<tbody>': Define o conteúdo do corpo de uma tabela.
• '<tr>': Define uma linha da tabela.
• '<th>': Define uma célula de cabeçalho da tabela.
• '<td>': Define uma célula de dados da tabela.
• '<caption>': fornece uma legenda para uma tabela.
• '<div>': define um contêiner genérico.
• '<span>': Define texto com estilo embutido.
• '<header>': representa um documento ou cabeçalho de seção.
• '<footer>': representa um documento ou rodapé de seção.
• '<section>': Representa um agrupamento temático de conteúdo.
• '<article>': representa um conteúdo independente.
• '<aside>': representa o conteúdo tangencialmente relacionado ao conteúdo circundante.
• '<button>': Define um botão clicável.
• '<details>': representa um widget de divulgação.
• '<summary>': fornece um resumo para um elemento '<details>'.
• '<object>': incorpora conteúdo ou recursos externos.
• '<iframe>': incorpora um contexto de navegação aninhado.
• '<canvas>': Incorpora gráficos por meio de script.
• '<svg>': Incorpora gráficos vetoriais escaláveis.
• '<math>': Incorpora equações matemáticas.
• '<time>': representa um horário ou intervalo específico.
• '<address>': Representa informações de contato.
• '<code>': Representa texto de código de computador.
• '<pre>': Representa texto pré-formatado.
• '<fieldset>': agrupa elementos de formulário relacionados.
• '<legend>': Fornece uma legenda para um '<fieldset>'.
• '<ruby>': representa anotações para tipografia do Leste Asiático.
• '<rt>': representa a pronúncia de caracteres em um elemento '<ruby>'.

Observe que as listas acima incluem apenas algumas das tags HTML comuns de fechamento automático e não automático (regulares), mas há muito mais tags disponíveis em HTML5 para diversos fins.

Glossário

• Verificar código HTML para tags não fechadas: O botão que executa o processo de verificação.
• Linha: O texto que antecede o(s) número(s) da(s) linha(s), onde foram detectadas as tags que não possuem contrapartes de fechamento.
• Nenhuma tag não fechada foi detectada.: A mensagem quando todas as tags HTML foram fechadas corretamente.
• Cole seu código HTML aqui...: A área onde vai o código HTML, para verificar as tags não fechadas/ausentes.
• A seguinte tag não parece estar fechada: Caso haja uma tag não fechada no código.
• As seguintes tags não parecem estar fechadas: Caso haja duas ou mais tags não fechadas no código.

Conclusão

Fechar corretamente as tags HTML é de suma importância no desenvolvimento web. Cada tag serve como uma instrução crucial para os navegadores interpretarem e renderizarem o conteúdo com precisão. Negligenciar o fechamento de tags pode levar a problemas de layout não intencionais, má interpretação do conteúdo e experiências de usuário inconsistentes em diferentes dispositivos e navegadores. Essa atenção meticulosa aos detalhes não apenas garante uma interface de usuário perfeita e visualmente agradável, mas também oferece suporte à acessibilidade e à otimização do mecanismo de pesquisa . Ao aderir às práticas recomendadas de fechamento de tags HTML, os desenvolvedores protegem a integridade de seu código, promovendo sites confiáveis, acessíveis e fáceis de usar que transmitem informações de maneira eficaz, mantendo uma apresentação visual consistente.