Estrutura básica, DOCTYPE e charset’s.
A estrutura básica do HTML5 continua sendo a mesma das versões anteriores do HTML, a unica exceção esta na escrita do DOCTYPE, aqui neste artigo será mostrado uma estrutura básica de um documento HTML suas principais tag’s, para que servem e como usa-las dentro do seu documento HTML.
Segue abaixo um exemplo:
1 – <!DOCTYPE HTML> 2 – <html lang=”pt-br”> 3 – <head> 4 – <meta charset=”UTF-8”> 5 – <link rel=”stylesheet” type=”text/css” href=”estilo.css”> 6 – <title> </title> 7 – </head> 8 – <body> 9 – 10 – </body> 11 – </html>– DOCTYPE
<!DOCTYPE HTML>
É a primeira linha do código HTML, ele indica ao navegador qual a especificação do código utilizado. O DOCTYPE não é uma tag do HTML, mas sim uma instrução para que o seu navegador tenha as informações necessárias da versão de código que está sendo utilizada.
Em versões anteriores, era necessário referenciar o DTD diretamente no codigo !DOCTYPE, com o HTML5 isso acabou.
– HTML
<html></html>
Onde começa e termina todo o código HTML, ele é o elemento principal de uma grande arvore onde alguns elementos são filhos de outros e assim por diante.
O atributo lang referencia a linguagem principal do documento, que no nosso caso é português Brasil, esse atributo não é extremamente reservado a tag HTML podendo assim ser usado em qualquer outro elemento para indicar o idioma do texto apresentado.
– HEAD
<head></head>
Indica o cabeçalho da pagina, onde contem informações precisas sobre a pagina e seu conteúdo.
– METATAG CHARSET
<meta charset=”UTF-8”>
Esta tag serve para chavear qual a tabela de caracteres estamos usando e as mostre corretamente em sua pagina como por exemplo símbolos e pontuação. Essa tabela chamada Unicode foi criada para que suprisse a necessidade de usuários de outros países, suportando mais de um milhão de caracteres.
– LINK
<link rel=”stylesheet” type=”text/css” href=”estilo.css”>
Esta tag serve para acessar fontes externas que serão usadas no documento, no nosso exemplo ela importa um arquivo CSS para a nossa pagina.
O atributo rel=”stylesheet” indica que o link é relativo a importação de um aquivo referente a folha de estilo.
– TITLE
<title></title>
Essa tag é usada para informar o titulo da pagina HTML, que será apresentada na aba do seu navegador.
Vimos então uma estrutura básica de um código em HML5, onde cada tag tem o seu papel especifico para contribuir na construção da sua pagina HTML.
