HTML5 é a nova versão do HTML. Mas antes de falarmos dessa nova versão vamos falar um pouco da história do HTML?
HTML
Com o surgimento da internet foi preciso criar uma linguagem que fosse entendida por meios de acesso diferentes. Assim, Tim Berners-Lee desenvolveu o HTML. Na década de 1990, quando o browser desenvolvido por Marc Andreessen, o Mosaic, se popularizou, o HTML ganhou força e foi adotado por outros desenvolvedores e fabricante de browsers, compartilhando as mesmas convenções.
HTML é uma abreviação de Hypertext Markup Language, ou seja, Linguagem de Marcação de Hipertexto, ou seja, é linguagem usada para a publicação de conteúdo (texto, imagens, vídeos, áudio etc.) na web.
HTML é baseado no conceito de hipertexto, ou seja, conjuntos de elementos ligados por conexões, que podem ser palavras, imagens, vídeos, áudio, documentos etc. que quando conectados, formam uma grande rede de informação. A conexão feita em um hipertexto é algo imprevisto que permite a comunicação de dados, organizando conhecimentos e guardando informações relacionadas.
Entre 1993 e 1995, surgiram novas versões (HTML+, HTML 2.0, HTML 3.0) onde foram propostas diversas mudanças para enriquecer as possibilidades da linguagem, mas, ela ainda não era tratada como padrão. Apenas em 1997, o grupo de trabalho do W3C, trabalhou na versão 3.2, fazendo com que ela fosse tratada como prática comum.
Em 2004, foi fundado o WHATWG (Web Hypertext Application Technology Working Group) por desenvolvedores de empresas como Mozilla, Apple e Opera, onde se iniciou o trabalho de escrever a nova versão do HTML, o HTML5.
HTML5: o que é?
Como dito no início do texto, HTML5 é a nova versão do HTML.
HTML5 é uma linguagem de marcação de hipertexto que apresenta e estrutura o conteúdo web, sendo que esse novo padrão é para HTML, XHTML e HTML Dom.
O HTML 5 permite adicionar novos elementos e funções, como por exemplo tags de vídeo e áudio e elementos canvas. E seu principal objetivo é facilitar a manipulação dos seus elementos, possibilitando a modificação das características dos objetos de forma não intrusiva, fazendo com que isso fique explícito para o usuário final.
Se compararmos HTML5 com seus antecessores notamos que ele tem uma séria de recursos adicionais, tais como:
1) Suporte ao armazenamento de mídias offline;
2) Elemento de conteúdos mais específicos, como rodapé, cabeçalho, navegação;
3) Doctype mais simples;
4) Áudio e suporte à incorporação de vídeo.
Outra característica interessante do HTML5 é que ele fornece ferramentas para o CSS, Cascading Style Sheets, (para saber mais sobre CSS, leia nosso artigo), e o JavaScript (leia nosso texto para saber mais sobre JS) fazerem seu trabalho da melhor maneira possível, assim o site consegue ser leve e funcional.
Além do código no HTML5 ser escrito de maneira diferente a organização da página também é. Ela passou a ser mais semântica e com menos códigos, aumentando a interatividade sem a necessidade de instalar plug-ins que muitas vezes causava perda de performance. Já o código passou a ser interpolável, ou seja, está pronto para futuros dispositivos, facilitando a reutilização da informação de diversas maneiras.
Estruturas do HTML5
A estrutura básica do HTML foi mantida no HTML5, a única alteração foi no doctype.
O objetivo do HTML5 é melhorar a experiência da web para seus usuários finais e também para os devs. A sua maior qualidade é que passou a ter suporte de áudio e vídeo em alto nível, o que não existia nas versões anteriores.
Agora listamos outras diferenças entre as versões HTML e HTML5.
1) SVG (scalabel vector graphics) – canvas e outros gráficos vetoriais são suportados em HTML5, enquanto no HTML o uso de gráfico vetoriais só era possível se usado em conjunto com diferentes tecnologias, como por exemplo: Flash, VML, Silverlight, etc.
2) HTML5 usa banco de dados SQL da web com cachê de aplicativos para armazenamento temporário de dados, enquanto isso, o HTML usa apenas o cachê do navegador.
3) O HTML5 não é baseado no SGML (Standard Generalized Markup Language), permitindo que tenha regras de análise aprimoradas, que proporcionando melhor compatibilidade.
4) No HTML5, MathML inline e SVG podem ser usados no texto, isso não era possível em HTML.
5) Alguns elementos que foram deixados de lado são no HTML5 são: isindex, noframes, acronym, applet, basefont, dir, font, frame, frameset, big, center, strike e tt.
6) O HTML5 suporta novos tipos de controles de formulário, como datas e horas, e-mail, número, intervalo, TEL, URL, pesquisa etc.
Novos elementos do HTML5
Muitos elementos da versão 4.0.1 foram excluídos na versão 5, uns por nunca terem sido usados, outros por estarem obsoletos e, ainda, os que eram usados indevidamente. A nova versão traz novidades que proporcionam ao usuário uma melhor estrutura, desenho e conteúdo multimídia.
As novidades da versão 5 estão ligadas diretamente às necessidades de suporte independente aos novos formatos de conteúdo multimídia, as novas funcionalidades de semânticas e a acessibilidade.
Entre elas destacamos as seguintes:
1) Inclusão do canvas que permite desenhar gráficos em uma página web. Na versão anterior essa tarefa era realizada com a utilização de plugins externos. Com isso, é possível, via JavaScript, controlar todos os pixels, além de desenhar vários elementos gráficos, como círculo, retângulo, elipse, linha, texto, imagens etc.
2) Inclusão dos elementos vídeo e áudio para reprodução multimídia. Assim, mais uma vez há integração de plugins externos. Com essa inclusão de tags, o HTML5 dá suporte para a reprodução de áudio e vídeo, sem a necessidade de utilizar mecanismos externos.
3) Melhor suporte para armazenamento local, sendo que o HTML5 oferece dois novos objetos para armazenar dados localmente: SessionStorage, que armazena dados durante uma sessão ativa, e LocalStorage, que armazena dados sem limite de tempo.
4) Inclusão de novos elementos de conteúdo específico, já que muitos elementos da versão 4.0.1 foram excluídos da nova versão, que traz novos elementos.
5) Inclusão de novos controles para formulário para facilitar a vida dos devs, diferentemente da versão 4.0.1, que possuía uma escassa quantidade de controles para formulários. Apenas o elemento input permaneceu, mas ganhou novos valores para o atributo type, permitindo maior controle sobre a entrada de dados pelo usuário.
6) Total suporte ao CSS3. Com essa integração, as páginas webs conseguem receber os mais variados tipos de estilos como sombra nos textos e quadros, efeitos de transição, quadro com cantos arredondados e vários recursos novos que o CSS3 oferece.
Conclusão
Como dito anteriormente, o HTML5 vem com muitas novidades, desde a incorporação de vídeo e de áudio, até a utilização do elemento canvas. A linguagem de marcação também oferece múltiplos novos elementos, trazendo melhor compatibilidade com regras de análise aprimoradas.
Sendo assim, é essencial que os programadores aprendam, o mais rápido possível, sobre HTML5, para que consigam maximizar o potencial dos navegadores modernos.
O que achou do nosso artigo? Não deixe de nos seguir nas redes sociais e acompanhar o nosso blog para ficar atualizado!