Olá pessoal, vamos começar nosso curso de HTML e hoje vamos falar sobre o que é uma Tag HTML (Hypertext Markup Language) que desempenham um papel crucial.

Esses elementos fundamentais são a espinha dorsal de qualquer página web, estruturando o conteúdo e permitindo a comunicação eficaz entre o navegador e o usuário.

Exploraremos o que são as tags HTML, sua importância e como são essenciais para a construção de páginas web dinâmicas e interativas.

O que são Tags HTML?

As Tags HTML consistem em códigos inseridos no texto para definir a estrutura e o layout de uma página. Cada tag possui uma função específica e contribui para a apresentação visual e organização do conteúdo.

Estrutura Básica das Tags HTML:

As tags HTML geralmente seguem uma estrutura básica, composta por uma tag de abertura ‘< >‘, conteúdo e uma tag de fechamento ‘< / >‘. Por exemplo, a estrutura básica de um parágrafo em HTML seria:

Este é um exemplo de parágrafo em HTML

Aqui, <p> representa a tag de abertura, e </p> é a tag de fechamento. O conteúdo entre essas tags é o texto que será exibido na página.

Atributos das Tags HTML:

Além do conteúdo entre as tags, muitas tags HTML podem conter atributos. Os atributos fornecem informações adicionais sobre a tag e podem influenciar o comportamento ou estilo da página. Por exemplo, a tag de imagem (`<img>`) pode ter o atributo `src` para especificar o caminho da imagem:

Principais Tags HTML

As tags HTML desempenham um papel crucial no SEO (Search Engine Optimization). Os motores de busca, como o Google, utilizam as tags para entender a estrutura e o conteúdo de uma página e vamos falar disso em outro artigo.

Neste momento vamos falar sobre as principais ou as tags mais usadas para se criar um site ou sistema para web, não focando a parte de SEO

Tags apropriadas e bem otimizadas podem melhorar a classificação nos resultados de pesquisa, tornando o conteúdo mais visível para os usuários.

Titulos ‘h1’ a ‘h6’:
As tags de cabeçalho variam de ‘h1’ a ‘h6’, indicando a importância e hierarquia do texto. Motores de busca consideram os cabeçalhos ao avaliar a relevância do conteúdo.

Título Principal
Subtítulo

‘a’ (Âncora ou Link):
A tag de âncora é usada para criar links. O atributo href define o destino do link.

Visite o Exemplo

‘img’ (Imagem):
A tag de imagem é usada para incorporar imagens. O atributo src especifica o caminho da imagem e o atributo alt fornece uma descrição para acessibilidade.

‘table’ (Tabelas):
As tabelas são uma ferramenta eficaz para apresentar dados tabulares e dispor o texto e os gráficos em uma página HTML, em outras palavras podemos dizer que as tabelas lembram muito uma planilha do excel, e esta é a estrutura padrão para criação de uma tabela.

Cabeçalho 1
Cabeçalho 2
Cabeçalho 3
Linha:1 Célula:1
Linha:1 Célula:2
Linha:1 Célula:3
Linha:2 Célula:1
Linha:2 Célula:2
Linha:2 Célula:3
Linha:3 Célula:1
Linha:3 Célula:2
Linha:3 Célula:3

Tag HTML para formatação de texto

‘ul e li’ (Listas):
Uma lista ordenada é uma lista de itens e as vezes as listas de itens são marcadas com números.A lista mais comum é a lista não-ordenada definida pela tag ‘ul’. O Elemento HTML ‘ol’ cria também uma lista mas separa os itens por numero como vemos no exemplo abaixo:

<-- Lista com marcadores -->

	
Arroz
	
Feijão
	
Leite


<-- Lista Numerica -->

	
São Paulo
	
Rio de Janeiro
	
Minas Gerais

‘p, b, i’ (paragrafo, negrito, italico):
Sempre que quisermos que um trecho de um texto seja visto como parágrafo, devemos colocar tal texto entre as tags ‘p’. A tag ‘b’ faz com que o texto entre esta tag fique em negrito, a tag ‘i’ deixa o texto em italico e ‘u’ deixa o texto sublinhado (u vem da palavra underline) como vemos no exemplo abaixo:

O Lorem Ipsum é um texto modelo da indústria tipográfica e de impressão.

Outras Tags HTML

 !! 
 

 !!  

 !!  

 !!  

 !! 
 


 

Em nosso próximo artigo falaremos mais sobre as Tags do HTML que são usadas principalmente por conta do SEO e otimização dos sites.