O que é HTML: entenda o que significa e para que serve

  • Última atualização: 2 de julho de 20182 de julho de 2018 por
  • Redação
what is html

Existem inúmeras linguagens web disponíveis, mas muitas pessoas têm dúvidas sobre o que é HTML. Quem não é familiarizado com o design da rede costuma perguntar se esse é algum tipo de linguagem de programação.

A resposta é: não, não é. A linguagem HTML é uma linguagem de marcação que consiste em tags e atributos que informam ao navegador como renderizar a página da web. A primeira versão do HTML foi sugerida por Tim Berners-Lee — considerado gênio e respeitado por todos os que trabalham e se especializam em algo relacionada à internet.

Ela foi lançada em 1990 e 1991, mas, até 1995, não foi este HTML que foi oficialmente reconhecido como um padrão a ser suportado por navegadores e outros softwares da web. Isso foi o HTML 2.0.

Atualmente, o padrão mais popular é o 4.01 (publicado em 1999), sendo que os webmasters já estão aguardando impacientemente pelo 5.0, que promete uma série de novas ferramentas, capaz de tornar as páginas da web ainda mais elaboradas e atraentes.

Interessou-se pelo assunto e quer saber mais? Continue a leitura!

Afinal, o que é HTML?

HTML significa HyperText Markup Language ou linguagem de marcação de hipertexto. A linguagem HTML é usada para criar documentos eletrônicos, chamados de páginas, exibidos na World Wide Web. Cada página contém uma série de conexões (hiperlinks) para outros domínios e é escrita a partir de uma das versões do código HTML.

Esse código garante a formatação adequada de texto e imagens, de modo que o navegador possa exibi-los corretamente. Sem HTML, um navegador não saberia exibir textos como elementos ou carregar imagens.

Ele também fornece uma estrutura básica de página, sobre a qual as Folhas de Estilo em Cascata são sobrepostas, alterando sua aparência. Pode-se pensar no HTML como a estrutura de uma página da web (e no CSS como sua aparência).

Como funciona a linguagem HTML?

Trata-se de uma linguagem de marcação. Os dados são encapsulados ou “marcados” nas tags HTML, que os definem e descrevem sua finalidade na página da web.

O navegador, então, lê o código HTML, que diz a ele quais partes correspondem aos títulos, aos parágrafos, aos links etc. O HTML descreve os dados para o navegador, que os exibe de acordo com as instruções.

Principais tags

As tags são usadas para marcar o início e o fim de um elemento HTML. Trata-se de palavras-chave ocultas em uma página da web, que definem como o navegador deve formatar e exibir o conteúdo.

A maioria das tags deve ter duas partes: uma de início e outra de fechamento. Algumas, porém, são exceções dessa regra e não necessitam de fechamento. A <img>tag para mostrar imagens é um exemplo disso.

Cada arquivo HTML deve ter as tags essenciais para que seja válido e, assim, os navegadores possam entendê-lo, exibindo-o corretamente. O restante do arquivo pode conter o número mínimo (ou o que você deseja exibir) de tags.

Tags de cabeçalho

Qualquer documento começa com um título — que pode ter diferentes tamanhos. O HTML também tem seis níveis de títulos, que usam os elementos <h1>, <h2>, <h3>, <h4>, <h5> e <h6>. Ao exibir qualquer cabeçalho, o navegador adiciona uma linha antes e outra após esse título.

Tag de parágrafo

A tag <p> é uma maneira de estruturar seu texto em parágrafos diferentes. Cada parágrafo do conteúdo deve vir entre uma abertura <p> e um fechamento </ p>.

Tag de quebra de linha

Ao usar o elemento <br />, qualquer conteúdo que vier depois começará na próxima linha. Essa tag é um exemplo de elemento vazio, no qual você não precisa abrir e fechar tags, pois não há nada entre elas.

A tag <br /> tem um espaço entre os caracteres br e barra. Ao omiti-lo, os navegadores mais antigos terão problemas em renderizar a quebra de linha; já se você perder o caractere de barra e usar o <br>, ele não será válido em XHTML.

Atributos

Em geral, um atributo refere-se a uma característica. Em HTML, trata-se de uma característica de algum elemento da página, como tamanho ou cor da fonte.

Os atributos são úteis ​​para amplificar uma tag, sendo organizados em categorias. Cada um é rotulado com as tags HTML com as quais ele pode ser usado. Quando um navegador interpreta uma delas, procura por seus atributos para exibir os elementos da página corretamente.

Um usuário de HTML pode definir atributos de fonte, como tamanho e cor, para valores diferentes. Em algumas linguagens de programação, como PowerBuilder e PowerScript, um atributo é uma propriedade de determinado objeto — ou, ainda, considerado um contêiner para a propriedade do objeto.

A cor pode ser um atributo de um objeto de texto, por exemplo, contendo o valor “vermelho”. Atributos fornecem informações adicionais sobre elementos HTML. Os links HTML são definidos pela tag a.

Já o endereço do link é especificado no atributo “href”. Observe que os atributos HTML estão sempre entre aspas. Eles têm as seguintes características:

  • fornecem mais informações sobre elementos HTML;
  • são sempre especificados na tag de início;
  • são apresentados em pares nome/valor, como nome = valor.

Elementos

Um elemento em HTML representa algum tipo de estrutura ou semântica e, geralmente, consiste em uma tag de início, um conteúdo e uma tag de finalização. É usado para identificar as propriedades de um documento (autor, data de expiração, palavras-chave etc.) e atribuir valores a elas.

Junto às tags, os elementos HTML trabalham para marcar o conteúdo. Eles indicam o propósito de uma tag — que, por sua vez, mostra o início e o fim de um elemento. Existem dois tipos:

Elementos em nível de bloco

Os elementos em blocos são estruturais na página que representam (parágrafos, listas, menus de navegação e rodapés, por exemplo). Um elemento em nível de bloco não seria colocado dentro de um em linha, mas poderia ser inserido em outro elemento de nível de bloco.

Elementos em linha

Já os elementos em linha estão localizados dentro dos elementos em nível de bloco. Eles envolvem apenas algumas partes do conteúdo (e não parágrafos completos).

Criando o primeiro código HTML

Para entender melhor o que é HTML, você pode criar o seu próprio código com as tags e elementos que vimos no artigo. Vamos lá?

  1. Abra o seu editor de texto favorito com um arquivo vazio e nomeie esse arquivo de index.html (atenção para a extensão do arquivo, que deve ser .html);
  2. No Windows, você pode usar o bloco de notas, no macOS o TextEdit, e se estiver no Linux, você pode usar o gedit ou Kate;
  3. Insira o seguinte código no seu arquivo:
<!DOCTYPE html>
<html lang="pt-br">
  <head>
    <meta charset="utf-8">
    <title>Meu primeiro código HTML</title><!-- Título da página, que aparece na janela/aba !-->
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>Meu primeiro código HTML</h1><!-- Primeiro título da página !-->
    <p>Paragráfo em um <strong>codigo</strong> de um documento HTML!</p><!-- Um elemento de parágrafo !-->
  </body>
</html>

Note que o texto entre <!-- e !--> não é exibido pois se trata de um comentário, que serve apenas para informar sobre uma parte do código do HTML.

Depois disso, você pode abrir o documento HTML no seu navegador e visualizar a página criada.

E então? Gostou de descobrir o que é HTML? Confira também o nosso artigo sobre CSS e saiba como estilizar o seu documento HTML!

Melhor Hospedagem de Sites é um projeto com o objetivo de ajudar as pessoas a encontrarem o melhor provedor de hospedagem, trazendo informação e conhecimento sobre o universo de hospedagem de sites.

Receber novidades por email: