DEV Community

Cover image for Estrutura básica de uma pagina HTML.
Fabricio-valadares
Fabricio-valadares

Posted on

Estrutura básica de uma pagina HTML.

A estrutura básica de uma pagina HTML tem como foco, forma um alicerce para a construção de uma pagina.

<!DOCTYPE html>
<html lang="pt-br">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Exercícios</title>
</head>
<body>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

O código acima mostra a base de uma pagina HTML pronta para ser desenvolvida, mas por recurso didático vamos construir linha por linha, explicando a função de cada elemento do HTML, para que assim possamos ter um bom alicerce para crescermos dentro da programação.

A função de cada linha:

<!DOCTYPE html>
Enter fullscreen mode Exit fullscreen mode

O <!DOCTYPE html> diz para os navegadores que pretendemos escrever uma pagina em HTML de acordo com as especificações, sendo que o DOCTYPE não é uma tag do HTML, mas sim um tipo de palavra-chave.

<!DOCTYPE html>
<html lang="pt-br">
</html>
Enter fullscreen mode Exit fullscreen mode

A tag <html></html> e o elemento onde toda a pagina será desenvolvida,
sendo que ela recebe um atributo chamado lang="pt-br" que defini o idioma principal da pagina.

<!DOCTYPE html>
<html lang="pt-br">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Exercícios</title>
</head>
</html>
Enter fullscreen mode Exit fullscreen mode

A tag <head></head> e o elemento que compõem a cabeça da pagina, ela não será renderizada na tela pelo navegador, pois tem como papel principal ser uma tag de metadados, entre as tags mais usadas dentro do <head></head> estão: <link>, <meta> entre outras.

A primeira tag <meta> que aparece no código está tendo a função de falar para o navegador quais os símbolos, caracteres entre outros, que podem ser utilizadas na tela.

O segundo <meta> que aparece está dizendo para o navegador se comporta de acordo com o tamanho da tela que está acessando a pagina, trazendo assim para o usurário uma melhor forma de ver o conteúdo da pagina.

E por ultimo a tag <title></title> diz respeito ao titulo da pagina, o nome que aparece da pagina do navegador.

<!DOCTYPE html>
<html lang="pt-br">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Exercícios</title>
</head>
<body>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

A ultima tag que aparece na base de uma pagina HTML e a <body></body> que e o corpo da pagina, tudo que for escrito dentro dessa tag aparecerá no navegador, portanto e onde vai todo o conteúdo da pagina.

Conclusão:

Espero ter ajudado você que gastou seu tempo lendo, muito obrigado pela sua atenção.

E por ultimo deixe um comentário para mim ler.

Top comments (0)