Uma Página HTML5 Básica – Guilherme Müller - Web Developer
12/01/2012	 · HTML · Tutoriais · 13
Uma Página HTML5 Básica
Com o HTML5, muito ficou simplificado na hora de iniciar um documento HTML. Neste post irei analisar o mínimo de código que precisamos para um documento HTML5.
Todo o código aqui mostrado pode ser utilizado hoje pois, devido à natureza tolerante dos navegadores, não irá causar nenhum problema de compatibilidade (e é código HTML5 válido). Neste documento também estarei utilizando a sintaxe do HTML, e não do XHTML, portanto tags sem conteúdo não terão a barra "/" no final (mas nada nos impede de utilizarmos a sintaxe XHTML).
O que iremos incluir no documento:
DOCTYPE (para que o navegador reconheça que deve funcionar no "standards mode")
Tag html com o atributo lang, para identificar a língua na qual o conteúdo do documento será escrito
Tag head, com as informações de cabeçalho não visíveis da página
Tag meta especificando a codificação da página (charset)
Tag title com o título da página
Tag body com o conteúdo da página
Vamos começar com o doctype:
Bem simples, não? Este doctype até dá para ser decorado, ao contrário dos que utilizávamos antes. Perceba que não há uma versão do HTML especificada no doctype, o que o torna um doctype geral para qualquer versão do HTML. A sua única função é "ligar" o modo de padrões web (standards mode) dos navegadores.
Segundo, abrimos a tag html:
Perceba o atributo lang, diferente do que era feito no XHTML para identificar a língua.
Em seguida, a tag head
Dentro, a tag meta especificando a codificação (também consideravelmente mais simples que antes):
Em seguida, a tag title que já conhecemos bem:
<title>Uma Página HTML5 Básica</title>
Por fim, a tag body, com o conteúdo da página:
Abaixo, o código completo:
Para finalizar, o código para inserir CSS e JavaScript também fica um pouco mais simples, não precisando ser especificado o atributo type:
<link href="arquivo.css" rel="stylesheet">
VENICIOS COSTA	 23/07/2018
Helison Santos	 04/02/2016
Ludmila kassule Chiyaka	 14/09/2015
Muito obrigada,acabei de ver a tua explicação.Nota mil.Foste bem conciso.
Quero segui-lo no Facebook
Jonatha Fernandes Costa	 31/08/2014
Oi gostaria de agradecer, pois tive a mesma duvida do "Leonardo Geranio" e a sua resposta resolveu o meu problema, apesar de trabalhar com desenvolvimento a um tempo por coincidência nunca havia tido esse tipo de problema com caracteres pois sempre apliquei as devidas configurações de reconhecimento de charset etc, porem dessa vez o meu problema era o tipo que o editor realmente estava salvando o arquivo, verifiquei a sua dica e era exatamente isso,muito obrigado mesmo e parabéns pelo post muito objetivo e esclarecedor.
Guilherme Müller	 01/09/2014
karina	 10/03/2014
mto bom o post... adorei! =)
Edigleysson	 05/02/2014
Show de bola bem simples e de fácil entendimento
Claudia	 08/02/2013
Oi gostei do post, bem simples e objetivo. Só uma curiosidade, a extensão dos arquivos continua a mesma? Tks.
Guilherme Müller	 09/02/2013
Sim, continua sendo um documento HTML normal (extensão ".html").
Leonardo Geranio	 15/09/2012
Meu codigo nao funciona com ou a declaracao antiga.
Aparece um erro na acentuação.
Somente funciona quando eu coloco com trema no U.
Tanto com a declaracao antiga quanto a nova, e nao consigo achar o problema...
Ja testei nos navegadores google chrome, firefox, ie e Safari... o mesmo problema.
Guilherme Müller	 17/09/2012
Veja a codificação na qual está salva o seu documento. Ela deve ser igual à codificação especificada na tag meta. Por exemplo, se na tag meta estiver "UTF-8" e o documento estiver salvo com codificação ISO-8859-1, você vai ter problemas com acentuação e caracteres especiais. Qualquer editor de texto tem um recurso para mostrar e/ou mudar a codificação do documento.