Desenvolvimento - HTML

Introdução ao HTML 5

Veja neste artigo algumas das características e propriedades do HTML 5, além de discutir importantes questões sobre migração e suporte ao HTML 5.

por Higor Medeiros



1. Introdução ao HTML 5

HTML5 (Hypertext Markup Language, versão 5) é uma linguagem para estruturação e apresentação de conteúdo para a World Wide Web. Na nova versão do HTML temos grandes novidades como Web semântica e acessibilidade, recursos esses que eram possíveis somente através de tecnologias alternativas antes do HTML 5.

A nova especificação trouxe novidades como a possibilidade de renderizar imagens através de APIs ou JavaScript, inclusão de vídeos em HTML, maneiras de descobrir a localização e informá-la aos sites e serviços que estão sendo acessados podendo fornecer ao usuário conteúdos específicos para o local em que ele está, possibilidade de acessar os aplicativos de forma offline via cache, possibilidade de acesso a Banco de Dados, entre outras novidades.

Todas essas novidades serão bem vindas tanto para os usuários quanto para os desenvolvedores que poderão deixar ainda mais ricas, limpas e dinâmicas suas aplicações. Porém diferente do que muitos pensam o HTML 5 não é uma especificação totalmente nova, pelo contrário. Isto será visto no restante do artigo.

2. HTML5 não é uma Nova Invenção

Uma pergunta comum que se faz é "como podemos usar HTML 5 se os browsers antigos não o suportam?". Na verdade muitos se fazem esta pergunta, porém poucos sabem que o HTML 5 não é uma nova invenção criada a partir do zero. HTML 5 é uma coleção de características individuais que foram adicionadas a sua especificação, como por exemplo canvas, video ou localização geográfica. A especificação do HTML 5 também especifica como HTML 5 interage com Javascript através do Document Object Model (DOM), ou seja, HTML 5 também não é somente tags. A especificação do HTML 5 especifica uma API DOM para objetos de vídeo. Essa API pode ser usada para suportar diferentes formatos de vídeos, bem como como rodar, pausar e alterar o volume de um video além de muitas outras funcionalidades. O HTML 5 é sim enorme, possuindo mais de 100 especificações que vão ditar o futuro das tecnologias Web.

Além disso, HTML 5 descreve muito mais, na verdade o HTML 5 é um termo em comum para a especificação do HTML, CSS e do JavaScript, projetado para capacitar desenvolvedores a criar sites e aplicativos da próxima geração. Elas definem o modo como desenvolvedores usam marcação aprimorada, recursos de estilo avançados e novas APIs de JavaScript para aproveitar ao máximo os novos recursos de desenvolvimento de Web.

Não podemos esquecer da capacidade e do grande sucesso do HTML 4. Também não podemos esquecer de todo nosso conhecimento acumulado em HTML durante todos esses anos. Tudo isso ainda vale, tudo isso ainda é reaproveitado no HTML 5. Portanto, suas aplicações rodando na Web com HTML 4 ainda continuarão rodando sem problemas com HTML 5.

No entanto, se queremos melhorar nossas aplicações Web precisamos suportar o HTML 5 que possui novos componentes como novos controles de input disponíveis, calendários, entre muitas outros componentes que foram incorporados no HTML 5. Salienta-se que tudo que tinha HTML 4 ainda continua sendo suportado no HTML 5. Um exemplo de um novo componente é o tipo input para e-mail que tem a aparência de um textbox, no entanto em browsers de telefones celulares ele é customizado para ser mais fácil de digitar o endereço do e-mail. Se o browser for antigo, nota-se que o componente será tratado como era tratado anteriormente, um simples textbox.

3. Migração para HTML 5

Migrar para HTML é muito simples, tão simples quanto mudar o DOCTYPE do documento. O DOCTYPE precisa estar na primeira linha de toda página HTML. Nas versões antigas do HTML havia diversos DOCTYPES, agora temos apenas um, conforme pode ser visto abaixo:

<!DOCTYPE html>

Atualizar para o DOCTYPE para o HTML 5 não irá quebrar o já existente, isso se deve porque todas as tags definidas no HTML 4 ainda continuam sendo suportados no HTML 5. Utilizando o DOCTYPE do HTML 5 permitirá que se use e valide os novos elementos do HTML 5 como <article>, <section>, etc. Obviamente que migrar sua página Web para HTML 5 não é apenas colocar um DOCTYPE no início. Existe toda uma estrutura e boas práticas a serem adotadas como a Web Semântica e a substituição de alguns elementos pelos novos disponibilizados. Se sua aplicação é totalmente desenvolvida em Flash já existem ferramentas especializadas que convertem todo o site em Flash para HTML 5.

4. Suporte ao HTML 5

Se quisermos desenhar em canvas, executar vídeos, ter formulários melhores, ou construir aplicações web que funcionam offline, descobriremos que o HTML 5 está muito bem suportado. Os principais browsers do mercado como Firefox, Safari, Chrome, Opera, Internet Explorer e diversos browser para telefones celulares já suportam canvas, vídeos, localização geográfica, armazenamento local e muito mais. A Microsoft já anunciou que o Internet Explorer 9 suportará HTML 5 e todas suas características.

O Firefox, a partir da versão 3.6, o Google Chrome na versão 4, o Opera 10 e o Safari 4 possuem compatibilidade ainda razoável. Versões superiores a essas já apresentam total compatibilidade.

Portanto, novas características do HTML5 como Tela, Elementos Gráficos Vetoriais Escaláveis, Áudio e Vídeo, Localização Geográfica, Armazenamento na Web e vários novos módulos CSS3 enquadram-se nesse espaço e são implementadas nas futuras versões dos browsers.

Além dos browsers temos também as ferramentas para desenvolvimento web como Visual Studio e Adobe Dreamweaver que também já oferecem suporte para HTML 5. Diversas empresas como a IBM já oferecem ferramentas totalmente dedicadas para desenvolver em HTML 5.

Algumas características especificadas no HTML 5 estão ainda sendo desenvolvidas e melhoradas como o suporte a Web Sockets, uma especificação que permite que os desenvolvedores estabeleçam canais de comunicação bidirecional com servidores back-end, na qual nos permitem um nível de conectividade em tempo real.

O Site HTML5 Labs, permite que os desenvolvedores experimentem implementações provisórias das novas tecnologias com especificações ainda instáveis no HTML 5. O site também oferece protótipos e exemplos para serem baixados da nova especificação do HTML 5. No HTML5 Labs ainda podemos testar e fornecer comentários sobre a especificação para o W3C e para a Microsoft que está intermediando o site.

5. Conclusões

Tim Berners-Lee o inventor da World Wide Web e criador do W3C já previa há alguns anos atrás que o HTML5 seria uma nova revolução no mundo da Web. Esta revolução está acontecendo aos poucos. Suporte ao HTML 5 está surgindo e se completando aos poucos, ferramentas de migração e desenvolvimento completo em HTML 5 estão ganhando mais notoriedade pelo público. Aos poucos mais sites Web, inclusive grandes portais como a BBC estão migrando toda sua página Web para HTML 5. Neste artigos apresentamos características e propriedades do HTML 5, também discutimos importantes questões sobre migração e suporte ao HTML 5.

Para se aprofundarem um pouco mais no assunto, sugiro que dêem uma olhada nesse artigo sobre as principais mudanças na estruturação de uma página com HTML5.

Bibliografia

HTML 5 Labs. Disponível em html5labs.com
Mark Pilgrim. Dive into HTML 5.

Higor Medeiros

Higor Medeiros - Higor Medeiros (higorowen@gmail.com) é aluno da Universidade do Vale do Rio dos Sinos em Ciência da Computação cursando o 4º semestre, onde também trabalha na pesquisa científica na área de inteligência artificial com Processamento de Linguagem Natural, desde 2004. É programador em diversas linguagens, tendo mais experiência em C# onde hoje desenvolve softwares para PLN.