HTML 5: chegou a hora de começar a desenvolver?
Toda esta discussão e pensamento iniciou com o convite da iMedia Brasil juntamente com a Arteccom para eu palestrar no grandioso EDTED Recife. Após diversos dias de pesquisa, verifiquei que poucos conteúdos ainda são encontrados sobre este assunto, por ser algo bastante novo e sem tanta importância ainda no Brasil. Tentei juntar das melhores fontes de conteúdo para apresentar a palestra e garantir a satisfação de todos os presentes. Para os que não tiveram a oportunidade de assistir e os que assistiram e desejam se aprofundar mais no assunto, segue um resumo bem detalhado:
Um pouco do passado
Era comum os usuários se depararem com frases como escolha o browser que você utiliza" ou qual a resolução que você utilliza". Os anos foram passando, a quantidade e qualidade de browsers aumentando juntamente com o conhecimento dos desenvolvedores. Depois de todos começarem a falar mal deste passado, pouco tempo depois, a maioria voltou a praticar o mesmo e começar a desenvolver sites apenas para browsers e resoluções específicas. Mas por que voltar ao passado tão mal falado?
Existem técnicas que fazem com que as funcionalidades sejam garantidas, e que apenas uma parte visual e alguns efeitos sejam sacrificados em determinados browsers (para quem não sabe, falei detalhadamente sobre Progressive Enhancement em um post anterior). Tudo isto para não sacrificar a experiência do usuário. Então por que tomar esta atitude?
De acordo com as pesquisas do Market Share, em Outubro de 2009, pouco mais de 23% do público médio mundial ainda utiliza o Internet Explorer 6 (a maior dor de cabeça dos desenvolvedores). Em determinados projetos, é loucura desvalorizar e perder todo este percentual de acesso. Bem, isso já está claro, então vamos em frente!
HTML 5
A documentação start do HTML 5 foi anunciada no início de 2009, porém esta ainda não é a versão oficial, que está prometida para o final de 2012. Algumas mudanças neste meio tempo já ocorreram, como a exclusão da tag datagrid (inicialmente colocada na documentação) e outras coisas foram incluídas. Com isto, sabemos que por ainda não ser uma documentação final, esta ainda é instável e passível à mudanças.
Sim, mas quais são as novidades do HTML 5 ?
- Como podemos verificar na documentação oficial, a maioria das tags que foram criadas são para adicionar valores semânticos às marcações (header, footer, nav, article, time, entre outras).
- Também foram acrescentados elementos multimídia que irão facilitar bastante a inclusão de vídeos e áudios sem a necessidade de plugins extras. Além disso, estuda-se a possibilidade de incluir legendas e descritivos dos vídeos em formatos .srt e .sub, com a possibilidade de multi-idiomas. Tudo isto 100% acessível à todos!
- Facilidade na inclusão de desenhos dinâmicos. O novo HTML 5 permite que você trabalhe com arquivos .SVG (Scalable Vetorial Graphics) sem problemas. Para quem não conhece os arquivos .SVG, são arquivos vetoriais baseados em XML e com código aberto. A maioria dos programas de edição trabalham com este tipo de extensão, e estes podem ser escaláveis e editáveis facilmente via HTML 5.
- Drag and Drop de elementos nunca foram tão fáceis de se fazer. Com apenas algumas linhas de código, o desenvolvedor tem o poder de permitir seus usuários arrastar e soltar alguns blocos, facilitando a navegação em determinados casos.
- Com a Geolocation API, o desenvolvedor pode obter os dados de localização do usuários de forma prática e fácil. Nada de depender mais de servidores externos e serviços fechados que são oferecidos por aí.
- Agora também é permitido o armazenamento de dados no cliente. Uma espécie de banco de dados que funciona na máquina do cliente, trabalhando assim também no modo offline.
Quanto ao suporte, apenas o Internet Explorer (versões 5, 6 e 7) não possui suporte às novas funcionalidades do HTML 5. Porém, existe um JavaScript que faz com que o Internet Explorer também faça a renderização do código. Porém, é imporante ter o conhecimento que este JavaScript só consegue permitir a visualização dos elementos semânticos. Além disto, nenhuma outra funcionalidade está sendo suportada até o momento.
São muitas as vantagens. E agora? Existem exemplos? Sim, claro!
- http://bit.ly/1Hw1ED (resize & drag and drop de fotos)
- http://bit.ly/fPMxn (resize & drag and drop de videos)
- http://bit.ly/2F3i1K (desenho escalável de um tigre em SVG)
- http://bit.ly/HkYnp (post-its que são arrastados e armazenados offline)
- http://www.html5gallery.com (galeria de sites em html5)
And now, desenvolver em HTML 5 ou não?
Se existe solução cabível para o suporte dos navegadores desatualizados, por que não?
Se a especificação ainda é instável e sujeita a mudanças, por que começar ?
Em primeiro lugar, é preciso analisar o público-alvo do projeto que será desenvolvido. Existem sites que possuem menos de 3% de uso do Internet Explorer, enquanto outros possuem mais do que 60% de uso. Se o público usa na grande maioria os navegadores que não dão suporte, é melhor não arriscar e continuar a utilizar o bom e velho XHTML.
Além disto, é preciso ter flexibilidade à possíveis mudanças. Caso a documentação seja alterada, é preciso fazer as devidas alterações em todo o projeto para não ter problemas com a visualização da sua página.
Você precisar ter certeza se vale a pena investir um tempo a mais e o seu interesse para fazer um site com estas novas regras. Caso contrário, é melhor não apostar nisto!
Com isto, fica claro que a decisão final de utilizar ou não esta tecnologia tem que ficar à critério do desenvolvedor, pois ele é quem realmente sabe (ou deve saber) as necessidades do cliente e do usuário final. Também é preciso pensar que se formos esperar o fim destes navegadores desatualizados, o HTML 5 só vai vingar por volta de 2055 depois de Cristo, ou mais! Para quem quer entrar na briga, segue alguns links interessantes para reforçar o estudo:
- Palestra no EDTED Recife sobre HTML 5 e CSS 3 - por Luiz Tiago
- http://www.slideshare.net/luiztiago/html-5-e-css-3-desenvolver-ou-no
- Lista com o suporte para CSS3 e HTML 5 detalhado de cada navegador (em Inglês)
- http://www.deepbluesky.com/blog/-/browser-support-for-css3-and-html5_72/
- Introdução ao HTML 5 - Pinceladas da Web
- http://www.pinceladasdaweb.com.br/blog/2009/10/26/introducao-ao-html5/
- Diferenças semânticas do novo HTML 5 (em Inglês)
- http://diveintohtml5.org/semantics.html
Gostaria de agradecer à todos os que estiveram presentes e a todos que ajudaram e deram uma grande força, principalmente a André Fontenelle pelo convite da iMedia Brasil, Julio Fragoso pelo layout da apresentação e algumas idéias, além de todo o pessoal da Arteccom que fizeram este grandioso evento se tornar realidade.
