HTML5

Fala galera!

Hoje abordarei a estrutura mínima de um documento HTML e falaremos de algumas TAGs e seus atributos. As TAGs são usadas para informar o navegador como o conteúdo deverá ser apresentado. Normalmente as TAGs tem o seguinte formato:

<h1 id="identificador">Texto a ser renderizado</h1>

Em HTML deve ser sempre colocada entre os sinais “<” e “>” e a tag de fechamento recebe um sinal de “/” logo após o sinal “<“. Existem algumas tags HTML que só possuem a tag de abertura.

Estrutura mínima

<!DOCTYPE HTML>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilo.css">
<title></title>
</head>
<body>

</body>
</html>

A estrutura mínima no HTML5 continua sendo a mesma da sua antecessora, apenas com uma diferença de escrita no seu Doctype.

Doctype 

O Doctype deve ser a primeira linha ser escrita no código HTML. Ele é responsável por informar ao navegador e para outros meios de acesso, qual o código será utilizado na renderização da página. Nas versões anteriores, tínhamos que referenciar o DTD(Document Type Definition), porém na HTML5 isso ficar por conta dos navegadores.

O Doctype é uma instrução que contém informações sobre qual versão de código  a marcação foi desenvolvida. Ex:
<!DOCTYPE html>

Elemento HTML

O elemento HTML é responsável por indicar onde começa a linguagem de marcação, sendo assim o elemento principal. Ex.:
<html lang="pt-br">
</html>
Obs.: O navegador é capaz de exibir o documento sem o elemento HTML, porém isso é uma péssima prática de desenvolvimento.

Observe que dentro do elemento HTML temos o atributo “lang”, esse atributo é responsável por indicar qual a linguagem principal utilizado no documento.

No link a seguir podemos encontrar a listagem de códigos disponíveis: http://www.w3.org/International/questions/qa-choosing-language-tags

Head

No HEAD é onde ficam os metadados, os mesmos são informações sobre a paǵina e o conteúdo ali publicado. Ex.:

<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilo.css">
<title></title>
</head>

Meta

Esta tag é responsável pelos metadados sobre o documento HTML. Aqui é onde colocamos o nome do autor do documento, data de validade do documento, palavras-chaves e a codificação de caracteres. Os metadados não serão exibidos pelo navegador.Ex.:

<meta charset="UTF-8">
<meta name="author" content="Renato Oliveira da Silva">

Link

Define um link para outro documento, esse link da acesso a um certo tipo de documento que será utilizado na própria página, como por exemplo algum arquivo em JavaScript ou um arquivo de estilização CSS. Podemos também apontar para documentos que tem relação com o documento atual. Ex.:
<link rel="stylesheet" type="text/css" href="estilo.css">

Considerações Finais 

Com o tempo estarei colocando com maiores detalhes as Tags HTML, colocando seus atributos e os possíveis valores para seus atributos. Para o desenvolvimento dessa postagem fora utilizados os seguintes documentos:
  • Criando Sites com HTML (Autor: Maurício Samy Silva)
  • HTML5 Curso W3C Escritório Brasil(Autores: Elcio Ferreira e Diego Elis)
Fiquem à vontade para dar sugestões e críticas. Como foi relatado em minha primeira postagem, estou aprendendo HTML, acredito que possa ter colocado algo nessa postagem que esteja incorreto, caso isso aconteça basta inserir um comentário que estarei editando a postagem.

Comentários

Postagens mais visitadas deste blog

Aprendendo Coisas Novas

Tags básicas do HTML

Criando e Visualizando Arquivos HTML