Conheça as principais tags de HTML

Veja quais são as principais tags para programar seu site

principais-tags-html

Com o crescimento e velocidade do mundo digital, ter um site para o seu negócio é, hoje, tarefa obrigatória. Possuir uma presença marcada na internet garante um alcance maior e mais possibilidades de novos negócios.
Mas é importante que o seu site seja bem estruturado e fácil de ser usado. É durante a programação do site que sua estrutura e usabilidade são determinadas. Para desenhar a usabilidade de seu site, considere as Leis de Nielsen. Para a estrutura de seu site, confira abaixo as principais tags de HTML.

O que é HTML?

HTML, do inglês HyperText Markup (Marcação de Hipertexto), é um tipo de linguagem de programação de sites. É a partir de tags, marcações técnicas inseridas em um corpo de texto, que a diagramação e informações visuais de um site passam a existir.
O HTML é uma das linguagens mais usadas na programação de sites. Ao lado dela, linguagens como Java, C, C++, Python, entre outras, são muito conhecidas e utilizadas, muitas das vezes em conjunto de outras linguagens.

principais-tags-html-o-que-e

Como usar uma tag?

As tags inseridas são sempre compostas por duas partes: a tag inicial e tag final.
tag inicial:
tag final:
Entre as tags iniciais e finais, as informações relacionadas a tag devem ser inseridas.
informação relacionada
É importante ficar atento aos inícios e finais de tag, pois as ações por elas desempenhadas são delimitadas a partir dessas marcações.
A má execução de início e final de tag pode fazer com que uma informação receba uma função por engano, como parte de um texto que não deveria estar em negrito receber tal destaque.

Principais tags de HTML

São inúmeras as tags utilizadas em HTML. No entanto, há marcações que são usadas mais frequentemente na programação de sites. Acompanhe nossa seleção de tags fundamentais para a boa estruturação de seu site.

Tags Estruturais

Essas marcações possuem a função de criar hierarquias e estruturas as informações contidas em um site.

html

Delimita um documento html. Deve estar no início e final de um corpo html.

head

Responsável pela criação do cabeçalho do site. Essas informações serão exibidas na parte superior de sua página.

title

Dá título a sua página. Esse será o título exibido na aba de seu navegador e, quando salvo, na aba de favoritos.

body

Instaura o corpo do documento, as informações exibidas pelas páginas, de fato. Ele deve estar presente no início e fim da redação do conteúdo da página.

heading tags

Elas criam uma hierarquia entre títulos e intertítulos de um conteúdo textual, podendo alcançar até seis níveis de hierarquia.
As heading tags são formadas pela letra h e pelo número de sua hierarquia no texto, podendo variar de 1 a 6, em que 1 é mais importante do que 6.
Cada página deve ter apenas um h1, o título da matéria inserida. As demais marcações (h2, h3, h4, h5, h6) podem ser inseridas à vontade, devendo apenas seguir a ordem de suas hierarquias.

principais-tags-html-cacarteres

Formatação de caracteres

Essas marcações possuem a função de editar e personalizar caracteres e textos contidos em um site.

em

Destaca textos em itálico.

strong

Destaca textos em negrito.

u

Destaca textos com sublinhado.

strike

Destaca textos riscando-os.

small

Destaca o texto ao tornar seu tamanho menor do que o habitual.

big

Destaca o texto ao tornar seu tamanho maior do que o habitual.

font

alterna o tamanho, cor e tipo
Altera o tamanho, cor e tipo das fontes (letras) inseridas. Exigem comandos suplementares, destacados abaixo:

size: altera o tamanho da fonte, podendo variar de 1 a 7.

color: altera a cor da fonte. A informação da cor deve ser inserida no formato #RRGGBB, correspondente a escala de cores RGB.

face: altera o tipo da fonte.

principais-tags-html-outros

Outros

Algumas outras tags que podem ser úteis em seu site.

br

Insere uma quebra de linha.

address

assinatura/autor
Insere informações referentes a assinatura do autor do texto inserido.

img

Insere uma imagem no corpo do texto que, por sua vez, pode ter comandos complementares para a sua estruturação.

src: insere uma url ou link.

align: alinha a imagem em top (topo), middle (meio), bottom (fundo),left (esquerda) e right (direita).

O Professor Célio Guimarães do Instituto de Computação da Unicamp preparou um material introdutório sobre linguagens de marcação em HTML que serve como um ótimo complemento para essa leitura.

Este artigo te ajudou? Comente e compartilhe conosco suas dúvidas e sugestões.


Comente o que achou