Já fizemos uma abordagem ao HTMl5 anteriormente e hoje vamos-lhe trazer 7 Coisas Que Tem de Saber Sobre HTML5. A linguagem HTML em si teve bastantes melhoramentos com esta versão 5, a maioria dos quais poderá encontrar no artigo Introdução ao HTML5 – O que há de novo?. A linguagem aproxima-se dos requisitos da Web e torna-se mais fácil publicar conteúdos Web 2.0. Quando HTML4 reinava, a Web2.0 nem sequer tinha sido pensada, sendo assim pouco compatíveis. Mas com HTML5, é expectável que seja diferente, e já há exemplos fantásticos da aplicação das novas capacidades HTML5.

Conheça outros artigos relacionados com HTML5:

1. PERCEBA O QUE É O HTML5

HTML5 não é um bicho de 7 cabeças, mas sim um conjunto de novas funcionalidades e melhoramentos ao HTML4. Portanto se alguma vez quiser verificar a compatibilidade com HTMl5 com navegadores antigos, não o fará. Aquilo que é possível fazer é verificar a compatibilidade para ferramentas individualmente, como o video, canvas ou geolocation. Também é importante referir que a interacção com Javascript através de DOM foi melhorada.

2. NÃO É NECESSÁRIO COMEÇAR DO ZERO

Com HTMl5 você não tem de começar os seus projectos apartir do zero. HTML4 foi o formato markup mais bem sucedido de sempre,e HTML5 começa apartir desse sucesso. A questão é simples: Se a sua página funcionava com HTML4, irá funcionar com HTML5, garantidamente. Mas, se pretender levar o seu projecto a um nível superior, considere tirar partido das novas funcionalidades incrementadas no HTMl5. Algo que foi mantido foi os controlos das forms, sendo que ainda foram adicionados novos controlos, como barras de deslizamento. Um exemplo concreto é o mail input, que parece-se com uma vulgar text box, mas os navegadores de dispositivos móveis vêem-no como um campo de email e irão personalizar o teclado para o utilizador introduzir o email com mais facilidade. No entanto, se pensa que esta particularidade é incompatível com os navegadores mais antigos como Internet Explorer 6, está enganado, apenas não o tratará como um campo de e-mail, mas sim como uma vulgar text box. Posto isto, e concluíndo, você pode começar já a fazer melhoramentos às suas aplicações sem que os seus visitantes que utilizam navegadores mais antigos fiquem sem acesso.

3. É EXTREMAMENTE FÁCIL

Dar o salto para HTML5 começa com um simples passo: Alterar o seu doctype. O doctype deverá estar sempre na primeira linha de código das suas páginas, e enquanto que nas versões anteriores HTML haviam vários doctype, em HTML5 existe apenas um, tome nota:

<!DOCTYPE html>

Simples :)

Ao fazer a alteração do seu doctype não irá perder a sua formatação, porque as tags HTMl4 são suportadas no HTML5. Irá sim permitir-lhe usar novas capacidades como o <article>, <header>, <footer> e outros, como referenciámos em Introdução ao HTML5 – O que há de novo?

4. FUNCIONA, E JÁ DEU PROVAS DISSO

Não importa se pretende desenhar no canvas, reproduzir um vídeo ou fazer um design dos seus formulários melhorado, HTML5 já é amplamente suportado pela maioria dos navegadores, como Mozilla Firefox, Safari, Opera, Google Chrome e navegadores de dispositivos móveis que suportem as novas funcionalidades HTML5. No que toca ao Internet Explorer, A Microsoft anunciou que a versão 9 do seu navegador suportará a maioria das novas funcionalidades HTML5. Por enquanto ainda estamos a par com a versão RC.

5. HTML5 DE PEDRA E CAL

Nos anos 90, Tim Berners-Lee inventou a WWW (World Wide Web). Mais tarde fundou a W3C que funcionaria como o regulador da web, função essa que desempenhou por mais de 15 anos. Em Julho de 2009 a W3C fez uma declaração em que anunciava que quando o grupo de trabalho XHTML2 expirasse como expectável no final de 2009, não seria renovado. Apartir daí, irá reforçar os recursos no grupo de trabalho HTML, acelerando desta forma o processo do HTMl5.

Com esta declaração tornou-se oficial: HTML5 veio para ficar.

6. NÃO CONFUNDA AS COISAS

Algumas pessoas tendem a confundir algumas coisas relativamente ao que é HTML5 e o que não é. Portanto, tome nota:

  • SCG não é HTML5
  • CSS3 não é HTML5
  • Geolocation não é HTML5
  • Client Storage não é HTML5 (Em certa altura foi, mas foi removido devido ao facto de que estava a tornar-se demasiado complicado. De momento tem as suas próprias especificações).
  • Web Sockets não é HTML5 (Como o anterior, de momento tem as suas próprias especificações).

7. CONHEÇA O QUE DEVE COMEÇAR JÁ A UTILIZAR

Utilize o novo doctype:

<!DOCTYPE html>

Utilize o novo meta:

<meta charset="UTF-8" />
//ao invés de
<meta http-equiv="Content-Type" content="text-html; charset=UTF-8" />

Utilize o novo style:

<style>
    body {background: #ffffff;}
</style>
//ao invés de
<style type="text/css">
    body {background: #ffffff;}
</style>

Utilize o novo script:

<script src="http://www.fontedoconteudo.com/jquery.min.js"></script>
//ao invés de
<script type="text/javascript" src="http://www.fontedoconteudo.com/jquery.min.js"></script>

Utilize a tag header:

<header>
<h2>Bem-Vindo à Escola Criatividade</h2>
</header>

Para compatibilidade com IE introduzir este trecho dentro do head:

<style>
    header {display: block;}
</style>

E ainda dentro do head:

<script>
document.createElement('header');
</script>

Ou em alternativa, utilizar o HTML5Shiv:

<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

Todas estes melhoramentos têm uma coisa em comum: Menos código. Isto significa que terá menos código escrito, os seus ficheiros irão ser mais leves e será muito mais fácil navegar no seu código!

QUAL A SUA OPINIÃO SOBRE HTML5?

Gostaríamos imenso de saber a sua opinião enquanto programador ou utilizador HTML5. Partilhe as suas ideias e discuta-as com os outros leitores da Escola Criatividade!

Abraço e até já!

 

Autor: Diogo Espinha

Blog do Autor | Artigos do Autor:

Workaholic e totalmente viciado em computadores, Internet e desporto motorizado. Adora praticar desporto, é um curioso da programação em PHP, CSS e HTML5 e não dispensa a companhia do seu Mac OSX 86 Snow Leopard!

  • Explorer - Factory Construction & Ship Building Joomla Theme
  • Justice - Attorney and Law Firm Joomla Template
  • OwnFolio - One Page Personal Portfolio / vCard / Resume / Showcase Joomla Template
  • Big Business - Responsive Template
  • Merab - Creative Multipurpose Drupal 8 Theme
  • Fitness Academy Joomla Template
  • Fruition - Business Joomla Template
  • Educate | Education & Courses, Kindergartens Joomla Template
  • Constructive - Contractors Multipurpose Joomla Landing Page Theme
  • Vina Bubox - VirtueMart Joomla Template for Online Stores
  • BizOne - One Page Parallax Drupal Theme
  • LawHouse - Responsive Lawyers Attorneys Joomla Template

Gostou deste artigo? Então torne-se fã do Blog no Facebook!



Comentários dos Alunos


  1. Luís Salvador
    24 de fevereiro de 2011

    É recomendável que façamos algumas dessas alterações (últimas) nos nossos themes de WordPress?



  2. Jonathan [JCM]
    24 de fevereiro de 2011

    Realmente o HTML5 chegou, e para ficar.

    Recomendo o uso do mesmo para qualquer novo projeto que esteja a desenvolver, além de poder usurfruir das novas funcionalidades, ainda evita dores de cabeça futuras ao fazer a transição.

    Em projetos já finalizados, nada melhor que ir aos poucos, pois como foi dito no artigo, usando o HTML5Shiv, 80% das novas tags do html5 funcionaram em qualquer navegador antigo.

    Ótimo artigo (:


RSS
Twitter
Facebook
Comentários
ASSINANTES
SEGUIDORES
FÃS
COMENTÁRIOS
7794

Subscrever Newsletter
Subscreva a Newsletter:



Aplicativos Android, iPhone e Muito Mais!




Assine a Escola Criatividade Assine a Newsletter da Escola Criatividade Escola Criatividade no Twitter Escola Criatividade no Facebook Escola Criatividade no Youtube Escola Criatividade no Google Buzz