Começando com HTML e Estrutura de Página

O que é HTML

HTML é a sigla para HyperText Markup Language — em português, “Linguagem de Marcação de Hipertexto”.

Mas o que significa?

  • Linguagem de marcação quer dizer que o HTML marca os pedaços do conteúdo para indicar o que eles são: um título, um parágrafo, um link, uma imagem, etc.
  • Hipertexto é o nome técnico para o que conhecemos como links — aqueles que nos levam de uma página para outra.

Ou seja: o HTML estrutura o conteúdo de uma página da web, dizendo ao navegador como ele deve exibir cada parte.

Vetor de uma pessoa digitando

Por que aprender HTML primeiro?

Porque ele é a base de toda página da web.
Antes de pensar em beleza (CSS) ou interatividade (JavaScript), a estrutura da página precisa existir — e é o HTML que a cria.

Imagine um site como uma casa:

  • O HTML é a estrutura (paredes, telhado, portas);
  • O CSS é a decoração (cores, estilos);
  • O JavaScript é a automação (abrir portas, acender luzes).

Elementos básicos de HTML

Abaixo estão alguns dos elementos mais importantes para quem está começando:


<title>

O <title> define o título da aba do navegador.

É também o título que o Google mostra nos resultados de pesquisa.

<title>Introdução ao HTML</title>

Dica: escreva títulos curtos e diretos, com palavras-chave do conteúdo da página.


<meta>

As metatags não aparecem visualmente no site, mas são lidas por navegadores e buscadores.

A mais comum é a meta descrição:

<meta name="description" content="Página introdutória sobre HTML para alunos iniciantes.">

Essa descrição ajuda o Google a mostrar um resumo do seu site nos resultados da busca.


<h1> – Título Principal

O <h1> é o título mais importante da página.

Cada página deve ter apenas um <h1>, que descreve claramente o seu conteúdo.

<h1>Começando com HTML</h1>

O Google dá muito peso ao <h1> na hora de entender sobre o que a página fala.


<p> – Parágrafo

Usado para escrever blocos de texto:

<p> HTML é a linguagem usada para estruturar páginas da web.</h1>

É o elemento mais usado quando se escreve conteúdo textual.


<a> – Link

O <a> é o elemento que cria links:

<a href="https://www.w3.org/">Visite o site do W3C>

O href é o endereço para onde o link vai levar.

Links internos e externos ajudam os usuários a navegar e os buscadores a entender a estrutura do seu site.

Vetor de um Programador Front-End

Vetor sobre Internet

O que são links e por que são importantes?

Links são conexões entre páginas. Eles podem:

  • Levar o usuário de uma página para outra;
  • Ajudar o Google a descobrir e classificar conteúdos;
  • Indicar quais páginas são mais relevantes.

Existem dois tipos principais:

  • Links internos: apontam para outras páginas dentro do seu próprio site;
  • Links externos: apontam para outros sites confiáveis, como Wikipedia, W3C, etc.

Quanto mais bem organizados forem os links, melhor a experiência do usuário e a indexação do site pelo Google.


Como o Google “lê” uma página?

O Google usa um programa chamado crawler (ou robô) para visitar páginas na internet. Esse robô lê o código HTML do seu site e tenta entender:

  • Qual é o conteúdo principal;
  • Se o conteúdo está bem organizado;
  • Quais são os links para outras páginas.

Esse processo se chama indexação.
Se sua página estiver bem estruturada com HTML semântico e válido, ela tem mais chances de aparecer nos resultados de busca.

Vetor de uma pessoa acessando a Internet