HTML: o que é essa linguagem de marcação e quais são suas principais tags?

Entenda a fundo o que é HTML. Afinal, é preciso conhecer essa tecnologia e entender suas evoluções para programar para web.

O HTML é um elemento comum de todas as páginas da web, servindo, portanto, como um alicerce para a internet. Trata-se de uma linguagem simples de entender e poderosa historicamente para os avanços que conseguimos com a grande rede.

Pessoas que desejam avançar no mundo de desenvolvimento full stack devem conhecer bem o que é HTML, as tags HTML e a estrutura HTML.

Ao compreender a forma como a linguagem evoluiu e ganhou novos paradigmas e conceitos, é possível dominá-la para criar aplicações web poderosas para vários fins.

Saiba mais sobre esse termo e sobre como estruturar uma página HTML.

HTML: o que é essa linguagem de marcação?

HTML é uma sigla para HyperText Markup Language, ou linguagem de marcação hipertexto. Foi criada por Tim Berners-Lee, quando trabalhava no CERN (Centro Europeu de Pesquisa Nuclear), na Suíça. Lee também criou na mesma época o protocolo HTTP e a World Wide Web, enquanto procurava uma solução para compartilhamento de arquivos no centro.

O HTTP é o protocolo de rede que permite a transferência de arquivos, ao passo que a World Wide Web (WWW) é o sistema que cataloga e permite compartilhar documentos por meio do HTTP.

O HTML é a unidade essencial de todas as construções da web. Toda página na internet começou como um documento HTML, com tags básicas estruturando e formatando esse documento.

O hipertexto do nome diz respeito à capacidade de estabelecer uma relação entre páginas. Como aponta o expert César Martins, Desenvolvedor de Novos Produtos na Tera:

"Hipertexto é qualquer texto com um link, um link que leva de um lugar para outro. A web é construída por milhões de textos desse tipo."

Berners-Lee conseguiu criar uma forma de conectar páginas para estabelecer fluxos de navegação. Sem saber, criou o protótipo do que viria a ser a internet moderna.

Uma característica importante do hipertexto é que ele é representado por conteúdos multimídia, como textos, imagens, vídeos, áudios e links.

Desde que surgiu, o HTML evoluiu por muitos anos até chegar à versão 5. Durante esse processo, surgiram desafios de compatibilidade entre navegadores.

Para lidar com isso, foi criado um comitê responsável por organizar e padronizar a evolução da tecnologia: o W3C.

Qual a função do HTML?

O HTML foi criado para estruturar e organizar documentos, permitindo definir hierarquia, links e formatação básica.

"O HTML define a estrutura de uma página web. Define quais conteúdos serão exibidos e como o navegador deve renderizá-los."

"É importante compreender HTML para criar páginas web, estruturar aplicações e até editar páginas existentes."

Com essa base estrutural, páginas podem ser estilizadas com CSS e ganhar interatividade com JavaScript.

O HTML esclarece a hierarquia visual e semântica de um site, organizando informações de forma clara e acessível.

No HTML5, houve uma ênfase maior na semântica, com novas tags que indicam claramente o papel de cada seção da página.

Linguagem de marcação e linguagem de programação

HTML não é uma linguagem de programação, mas uma linguagem de marcação.

"Linguagens de marcação definem como um conteúdo pode ser exibido."

O principal diferencial é a lógica. Linguagens de programação trabalham com decisões, fluxos e regras. O HTML apenas estrutura e organiza.

Por isso, o HTML atua no lado do cliente, no front-end, sendo amplamente utilizado por desenvolvedores front-end e full stack.

Qual é a estrutura HTML básica?

Uma estrutura HTML básica começa com a declaração do tipo de documento, seguida pelas tags html, head e body.

A tag html envolve todo o documento. A head contém metadados e configurações. A body define o conteúdo visível.

O que são tags HTML?

Tags são os elementos que delimitam e definem o significado de cada parte do documento.

Elas possuem abertura e fechamento, com exceção das self-closing.

As tags podem receber atributos, que configuram comportamento, aparência e referência de conteúdo.

a

Define links entre páginas ou seções.

ul, ol, li

Definem listas ordenadas e não ordenadas.

img

Define imagens e recebe atributos como src, width e height.

p

Define parágrafos e organiza blocos de texto.

H tags

Definem títulos e subtítulos de forma hierárquica.

iframe

Permite incorporar conteúdos externos, como vídeos.

video e audio

Inserem mídias nativas na página.

header, footer, main

Tags semânticas que definem cabeçalho, rodapé e conteúdo principal.

section, aside e nav

Definem seções, áreas laterais e navegação.

Como vimos, o HTML é o elemento essencial de toda página web, sendo fundamental para qualquer pessoa que deseja trabalhar com desenvolvimento web.

Gostou do conteúdo? Esses e outros conceitos fazem parte da aula sobre HTML do curso Full Stack Development da Tera.

{{cta('d7350acf-8c57-4a1a-b1a5-fcb9327fca4f')}}