Hoje, em nosso segundo post sobre HTML5, venho mostrar-lhes, leitores do Multart, um pouco sobre Motores de Renderização.
Milhares de desenvolvedores acreditam que os motores de renderização são focados apenas ao CSS, porém, esse pensamento precisa mudar. Afinal, no HTML5, também existe compatibilidades com os motores de renderização. Atualmente o WebKit, utilizado peloGoogle Chrome e Safari, é o motor mais compatível com os padrões HTML5. Contudo, outros dois browsers vem se aprimorando a cada atualização, é o caso do Opera e Firefox, ambos já possuem uma grande compatibilidade com a linguagem de marcação. Uma rápida observação, ainda sobre compatibilidade, devemos ficar ligamos quanto a compatibilidade do IE7 e IE8, ambos possuem quase nenhuma compatibilidade com o HTML5. Infelizmente.
Avançando para os códigos, vamos compreender uma técnica básica de detecção que nos permite verificar o suporte de grande parte das características do HTML5 e CSS3. Para efetuar essa detectação, utilizaremos uma biblioteca Javascript chamada Modernizr, a mesma executa automaticamente, quando é adicionada ao documento.
Por exemplo, caso queira verificar se o browser aceita o recurso de Geolocalização, basta adicionar o código abaixo no corpo de seu documento:
|
1
2
3
4
5
|
if (Modernizr.geolocation) { // Aceita a feature} else { // Não aceita a feature testada.} |
Caso o browser suportar a feature citada, no caso Geolocalização, o mesmo retornará true.
Avançando um pouco mais, vamos conhecer a estrutura básica de um documento, cuja a mesma possui algumas modificações, veja:
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<!DOCTYPE html><html lang="pt-br"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="estilos.css"></head><body> </body></html> |
A primeira mudança significante, que podemos ver no código acima, é a do doctype do documento, o mesmo passa a ser escrito como:
|
1
|
<!DOCTYPE html> |
Ao invés do antigo metódo:
|
1
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
Porém, devemos lembrar que o DOCTYPE não é um tag do HTML, e sim uma instrução ao browser sobre qual versão de código a marcação foi escrita.
Outra mudança que também chama nossa atenção é a do charset, pois, antigamente, escrevíamos o charset da seguinte forma:
|
1
|
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> |
Mas, com a vinda do HTML, podemos escrevê-lo de uma vez, sem errar:
|
1
|
<meta charset="UTF-8"> |
A última mudança, em nosso simples código exemplo lá em cima, é a extinção do type nas chamadas de arquivos, como <link> para CSS e <script>, para claro, scripts.
No antigo HTML4, precisávamos dizer ao navegador qual era o tipo de arquivo que estávamos utilizando, como, por exemplo, para CSS:
|
1
|
<link type="text/css" rel="stylesheet" href="estilos.css"> |
Ou, para Javascript:
|
1
|
<script type="text/javascript" src="script.js"></script> |
Mas, com a vinda do HTML5, não precisamos mais disso. Agora podemos fazer nossos códigos com mais facilidade e produtividade, como tudo deve ser. Até o próximo artigo! 😉
