No Inicio...
Antes de tudo, realmente estou no inicio da minha carreira como programador. E tenho feitos muitos erros, admito. Isso por si não é um problema tão grande. O ponto é que eu estava insistindo em um erro sem saber.
Quando estava aprendendo a criar as minhas primeiras páginas HTML fui ensinado a trabalhar com as mais diversas <tags>
, e dentre elas as listas, <ul>
e <ol>
.
O erro
Foi então que eu comecei a desenvolver minhas páginas e em toda lista que eu precisava fazer em vez de colocar tag <li>
de List Item, eu colocava <ln>
.
O problema aqui é que essa tag não existe no HTML. Ou seja, durante todo esse tempo eu estava usando um elemento HTML que só existia nos meu códigos e que não gerava qualquer diferença para a estrutura dos mesmos.
Uma visão de fora
Segui assim até essa semana, quando durante uma discussão sobre os códigos junto aos meus colegas de estudos, um deles me perguntou o que era aquela tal <ln>
, e eu não soube responder.
Essa duvida inundou o meu pensamento, pois mais ninguém sabia se realmente existia essa tag. Perguntei para alguns outros conhecidos no mundo da TI que possuem bem mais experiência do que eu, e dois deles me deram as seguintes respostas:
Pode ser que tenha alguma equivalência em versões anteriores do HTML.
-- Bruno de Lucca
Por padrão, no HTML puro, sem frameworks ou similares, quando você nomeia uma tag, ele a considera como uma
<div>
genérica comdisplay:block
.
-- Leonardo Airam Vieira
Foi aí que notei meu erro, e obtive uma explicação do porque ainda sim funcionava o código.
Mas mesmo errando se adquire conhecimento
No entanto, durante a minha busca, utilizei o queridinho do momento, o ChatGPT, para saber se realmente existia a <ln>
.
Porem encontrei outro recurso. Alem das famosas <ul>
e <ol>
com suas <li>
, "descobri" sobre as tags <dl>
, <dt>
e <dd>
, cuja estrutura semântica é a seguinte:
<dl>
<dt>Termo 1</dt>
<dd>Definição 1</dd>
<dt>Termo 2</dt>
<dd>Definição 2</dd>
<dt>Termo 3</dt>
<dd>Definição 3</dd>
<dl>
- A tag
<dl>
é usada para criar a lista de definições. Ela deve ser usada como o elemento pai que contém todas as definições da lista. - A tag
<dt>
é usada para representar o termo ou item que está sendo definido. Ela deve ser usada como um elemento filho da tag<dl>
. - A tag
<dd>
, por sua vez, é usada para representar a definição do termo ou item. Ela deve ser usada como um elemento filho da tag<dl>
, após o<dt>
correspondente.
Essa estrutura de lista é utilizada principalmente para dicionários ou artigos que utilizam Termos que necessitam de uma explicação, ou como a própria tag indica, uma definição externa ao conteúdo apresentado.
Um exemplo prático seria o seguinte:
<dl>
<dt>HTML</dt>
<dd>HyperText Markup Language, ou Linguagem de Marcação de HyperTexto,
utilizado para estruturar a maior parte das
páginas Web na internet.</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets, ou Folha de Estilo em Cascata,
utilizado para "decorar" e estilizar as páginas HTML.</dd>
<dt>JavaScript</dt>
<dd>Uma linguagem de programação utilizada em páginas web para
gerar interações com o usuário e
se comunicar com servidores, etc.</dd>
</dl>
Conclusões
Sendo assim, um pequeno erro que já nem lembro mais como se iniciou, me gerou uma dúvida, e essa dúvida me trouxe dois novos conhecimentos sobre o HTML:
- Que
<tags>
inexistentes são lidas como<divs>
; e - Existe um conjuntos de tags expecificas para a criação de uma lista de definições dentro HTML.
Logo, vejo que eu realmente tenho muito o que aprender, porém, mesmo os mais experientes não sabem de tudo.
Top comments (2)
Duas coisas realmente muito massas que surgiram da nossa conversa: aprendi essa da tag inexistente virar
div
(isso explodiu minha cabeça) e sobre adl
,dt
edd
! Muito obrigada por ter compartilhado!Caramba Html vive me surpreendendo. Sempre aparece uma coisa que não sabia e nosso código fica menos rico e semântico por não usar. Parabéns mano e obrigado por compartilhar 👏🏻👏🏻