As tags semânticas do HTML são elementos que conferem significado ao conteúdo, permitindo uma melhor compreensão tanto para os desenvolvedores quanto para os mecanismos de busca.
Elas ajudam a estruturar o conteúdo de forma mais clara e organizada, contribuindo para a acessibilidade e usabilidade do site.
Foram utilizadas tags semanticas nesse site, abaixo apresentamos cada uma delas.
O elemento < body > do HTML representa o conteúdo de um documento HTML. è permitido apenas um < body > por documento.
O elemento HTML < header > representa um grupo de suporte introdutório ou navegacional. Pode conter alguns elementos de cabeçalho mas também outros elementos como um logo, seções de cabeçalho, formulário de pesquisa, e outros.
O Elemento HTML de Navegação < nav > representa uma seção de uma página que aponta para outras páginas ou para outras áreas da página, ou seja, uma seção com links de navegação.
O elemento HTML < ul > (ou elemento HTML de Lista desordenada) representa uma lista de itens sem ordem rígida, isto é, uma coleção de itens que não trazem uma ordenação numérica e as suas posições, nessa lista, são irrelevantes. Caracteristicamente, os itens em uma lista desordenada são exibidos com um marcador que pode ter várias formas, como um ponto, um círculo, ou um quadrado
O elemento HTML < li > (ou a Lista dos Itens de um elemento HTML) é usado para representar um item que faz parte de uma lista. Este item deve estar contido em um elemento pai: uma lista ordenada < ol >, uma lista desordenada < ul > , ou um menu (< menu > (en-US)) e representa uma única entidade dessa lista
O elemento < a > em HTML (ou elemento âncora), com o atributo href cria-se um hiperligação nas páginas web, arquivos, endereços de emails, ligações na mesma página ou endereços na URL. O conteúdo dentro de cada < a > precisará indicar o destino do link.
O elemento HTML < section > representa uma seção genérica contida em um documento HTML, geralmente com um título, quando não existir um elemento semântico mais específico para representá-lo.
O Elemento HTML < article > representa uma composição independente em um documento, página, aplicação, ou site, ou que é destinado a ser distribuido de forma independente ou reutilizável, por exemplo, em sindicação. Este poderia ser o post de um fórum, um artigo de revista ou jornal, um post de um blog, um comentário enviado por um usuário, um gadget ou widget interativos, ou qualquer outra forma de conteúdo independente.
O elemento HTML < figure > representa conteúdo autocontido, potencialmente com uma legenda opcional, que é especificada usando o < figcaption > elemento. A figura, sua legenda e seu conteúdo são referenciados como uma única unidade.
O elemento HTML < aside > representa uma seção de uma página que consiste de conteúdo que é tangencialmente relacionado ao conteúdo do seu entorno, que poderia ser considerado separado do conteúdo. Essas seções são, muitas vezes, representadas como barras laterais. Elas muitas vezes contem explicações laterais, como a definição de um glossário; conteúdo vagamente relacionado, como avisos; a biografia do autor; ou, em aplicações web, informações de perfil ou links de blogs relacionados.
O elemento HTML < details > é usado como uma ferramenta de onde o usuário irá obter informações adicionais.
O elemento HTML de Rodapé < footer > representa um rodapé para o seu sectioning content (conteúdo de seção) mais próximo ou sectioning root elemento (ou seja, seu parente mais próximo < article >, < aside >, < nav >, < section >, < blockquote >, < body >, < details >, < fieldset >, < figure >, < td > (en-US)). Normalmente um rodapé contém informações sobre o autor da seção de dados, direitos autorais ou links para documentos relacionados.
"O HTML semântico é a forma de deixar o site com suas informações bem explicadas e compreensíveis para o computador, ajudando até mesmo em sua busca no Google e facilitando o entendimento de leitores de acessibilidade. Com o HTML semântico, ficou muito mais fácil de interpretar páginas."
Esta é uma citação tirada de geekhunter
"O HTML semântico tenta transmitir significado através das palavras e as tags em uma página. tente pensar desta maneira: o conteúdo da página são as palavras que você fala. A marcação HTML fornece a estrutura, a entonação, as pausas e até mesmo a aparência do seu rosto. Basicamente, as marcações são a metade da sua mensagem."
Esta é uma citação tirada de kadunew
"A parte que mais deve se atentar ao fazer a estruturação de seu HTML é o SEO, já que os dois andam grudados um no outro se quiser fazer uma página com relevância. Lembrando que os robôs de busca possuem algumas capacidades bem menores que um leitor de tela, então atente-se aos links, parágrafos e palavras-chave, já que a localização influencia em seu impacto."
Esta é uma citação tirada do Linkdin de Pedro Parreiras
Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro, quos consectetur perspiciatis minus maxime dolore repudiandae ullam commodi hic cum?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro, quos consectetur perspiciatis minus maxime dolore repudiandae ullam commodi hic cum?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro, quos consectetur perspiciatis minus maxime dolore repudiandae ullam commodi hic cum?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro, quos consectetur perspiciatis minus maxime dolore repudiandae ullam commodi hic cum?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro, quos consectetur perspiciatis minus maxime dolore repudiandae ullam commodi hic cum?