Curso de HTML / O que é HTML e qual é o seu papel numa página web?

HTML (HyperText Markup Language, ou linguagem de marcação de hipertexto) dá ao conteúdo de uma página web sua estrutura e significado. Ele identifica títulos, parágrafos, listas, links e outras partes de um documento para que um navegador possa apresentá-los. O CSS controla principalmente a aparência e o layout, enquanto o JavaScript pode adicionar comportamento em resposta às ações do usuário.

O que é HTML?

HTML é uma linguagem de marcação que descreve o que cada parte de um documento é. As mesmas palavras podem ser um título, um parágrafo comum ou um link para outra página; os elementos HTML distinguem esses papéis. Os links também permitem que documentos HTML se conectem uns aos outros na web.

O objetivo principal do HTML não é realizar cálculos nem expressar lógica condicional. Seu papel central é dar uma estrutura e um sentido ao conteúdo. A introdução do padrão HTML do WHATWG explica a linguagem e como seus elementos funcionam.

O que o HTML faz em uma página web?

Uma página da web pode conter títulos, texto principal, links de navegação, imagens e formulários. O HTML usa elementos apropriados para cada tipo de conteúdo e expressa como as partes estão conectadas entre si. Para um arquivo completo mostrando onde as tags devem ser colocadas, use Estrutura básica de um documento HTML.

• Identifique o conteúdo: h1–h6 marcam os títulos, p marca os parágrafos, e ul ou ol marca as listas.
• Organize o documento: Os elementos podem distinguir um cabeçalho, uma área de navegação e o conteúdo principal.
• Conectar páginas e receber dados: a cria links; form e os elementos de entrada permitem aos usuários enviar informações.

Essa estrutura ajuda os navegadores e tecnologias assistivas a interpretar a página. Escolha um elemento pelo papel do conteúdo, não apenas pela sua aparência padrão.

Em que o HTML, o CSS e o JavaScript diferem?

Eles têm papéis principais diferentes. O HTML define o conteúdo e seu significado. O CSS controla a apresentação, como cores, fontes, espaçamento e layout. O JavaScript pode responder a cliques ou entradas e modificar a página.

Esta divisão é um ponto de partida útil, não um limite rígido: alguns elementos HTML oferecem interação integrada, e o CSS pode mudar a aparência de acordo com os estados ou animá-la. Ao aprender HTML, concentre-se primeiro na marcação correta do conteúdo.

Como o código HTML aparece em um navegador?

Neste fragmento, h1 marca um título, p marca um parágrafo, e ul com li marca uma lista.

<h1>Notas do dia</h1>

<p>O HTML estrutura o conteúdo.</p>

<ul>

  <li>Título</li>

  <li>Parágrafo</li>

</ul>

O navegador interpreta esses elementos e exibe um título, um parágrafo e uma lista com marcadores. Compare as tags com o título, o parágrafo e a lista exibidos na tela. As fontes e os espaçamentos reais dependem do navegador e de qualquer CSS aplicado à página.

Tente criar um arquivo HTML simples

Adicione a estrutura básica do documento ao fragmento acima e você poderá abri-lo diretamente em um navegador. Cole o seguinte em um editor de texto, salve como index.html usando codificação UTF-8 e abra o arquivo em um navegador. Use Sintaxe HTML para interpretar a notação de elementos e atributos.

<!doctype html>

<html lang="pt-BR">

  <head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Notas do dia</title>

  </head>

  <body>

    <h1>Notas do dia</h1>

    <p>O HTML estrutura o conteúdo.</p>

    <ul>

      <li>Título</li>

      <li>Parágrafo</li>

    </ul>

  </body>

</html>

O head contém informações como o título do documento e a codificação de caracteres. O body contém o conteúdo principal da página. Mesmo sem CSS adicionado, um navegador mostra o conteúdo usando seus estilos padrão.

No exercício, modifique o título, o h1 e um parágrafo de cada vez, salvando e atualizando após cada modificação. Compare a aba do navegador com o corpo, depois restaure o código original.