HTML5Quando comecar a usar o HTML5? Ontem!!!Por cautela, muitas vezes demoramos a comecar a usar o HTML5. Esperamos que a maioria dos navegadores se adequassem para evitar gastar muito tempo com recursos para fazer o site funcionar na maioria dos navegadores. Bom, essa fase ja passou. Se voce ainda esta receoso, perca o medo e se lance, pois o HTML5 veio para ficar e para facilitar.O que eu preciso saber para comecar a usar o HTML5?Para quem ja conhece o HTML, tableless e XHTML vai ser muito facil. Vou mostrar as duas formas. Comparando o novo com o que se usa comumente.1- HTML5 - Comecando pelo comeco.2- Conhecendo os novos elementos do HTML53- Conhecendo os elementos retirados do HTML54- Conhecendo os atributos retirados do HTML55- Conhecendo os atributos inseridos do HTML51- HTML5 - Comecando pelo comeco.Vamos criar o nosso primeiro arquivo HTML5.Exemplo:<!DOCTYPE html ><head> <meta charset="utf-8"> <title>Meu primeiro HTML5</title></head><body> <p>Alo mundo!</p></body></html>As diferencas comecam no head.Vamos por partes:1.1)<!DOCTYPE html >Eu nao disse q o html5 veio para facilitar?! Sim, e so isso mesmo.Para quem estava acostumado com:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>ou<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">Facilitou, nao?!1.2)<meta charset="utf-8">Ainda pode ser usado como antes:<meta equiv="Content-Type" content="text/html; charset=utf-8">Mas e melhor usar a forma nova.Observe que tambem pode ser usado em maiusculas e com aspas. As sintaxes abaixo sao igualmente validas:<meta charset="UTF-8"><meta charset="UTF-8"><meta charset="utf-8"><meta charset="Utf-8">o HTMl nao e XML- O HTML nao e case sensitive, logo nao faz diferenca se as letras aparecerem maiusculas ou minusculas . O XML e case sensitive. No XML <meta charset="UTF-8"> e diferente de <meta charset="utf-8">.1.3) Outro detalhe, sobre o HTMl nao e XML e que no HTML nao e necessario a barra ao final de elementos vazios.Ex.:Use: <br> ao inves de <br />Use: <hr> ao inves de <hr />Use: <img src="ex.jpg" alt="exemplo" /> ao inves de <img src="ex.jpg" alt="exemplo" />Logo, tambem sao sintaxes igualmente validas:<meta charset="utf-8"><meta charset="utf-8">Se voce esta acostumado a colocar barra no fim, como nos exemplos acima, nao se preocupe. Vai funcionar mesmo com a barra, mas procure ir se acostumando a nao coloca-la.1.4) Use o atributo LANG<!DOCTYPE html ><html lang="pt-br"><head> <meta charset="utf-8"> <title>Meu primeiro HTML5</title></head>Lembre-se que voce nao so pode como deve usar atributo LANG em outras tags para indicar a mudanca no idioma do texto. Por exemplo:<!DOCTYPE html ><html lang="pt-br"><head> <meta charset="utf-8"> <title>O amor e lindo!</title></head><body> <h1>Eu estou apaixonada!!!! rs</h1> <span lang="es">Yo te amo</span> <p lang="fr">Je t'aime</p> <em lang="it">Io ti amo</em> <p lang="de">Ich liebe dich</p> <strong lang="en">I love you.</strong> <p>Resumindo... O amor e lindo!</p> </body></html>Amanha continuamos... E uma serie.rs Esse nao foi uma site criado e desenvolvido por mim. O layout foi pouco alterado. Na pratica, reescrevi o site todo, para otimiza-los para mecanismos de busca.Quando escrevi o artigo sobre SEO falei por exemplo da importancia de usar as tags de Titulo (h1, h2...) Esse e um site que nao tinha um titulo sequer. Tudo era div. Tinha div class="titulo1" por exemplo. Mas nenhum h1, h2, h3... Claro que isso prejudicava o site em sua indexacao nos mecanismos de busca. Foi uma das coisas que tive que alterar.Muita coisa foi acrescida