HTML5: o que muda?

HTML5: o que muda?

GTS – Gerência de Testes de Software

HTML5: o que muda?

Agenda

• Introdução• Sobre a versão 5• Melhora na semântica web• O que pode mudar na maneira de testar

• De RIA pra ARIA• Dúvidas?• Referências

HTML5: o que muda?

Introdução

“Uma linguagem de hypertexto, para a fácil navegação entre as fontes de

informação: o HTML.”

W3C

HTML5: o que muda?

Introdução

HTML não é só...

HTML5: o que muda?

Introdução

HTML5: o que muda?

Introdução

• É uma linguagem para publicação de conteúdo (texto, imagem, vídeo, áudio e etc);

• É considerada um dos 3 pilares da

web;

• Mantida e documentada pelo consórcio W3C;

HTML5: o que muda?

Agenda

• Introdução• Sobre a versão 5• Melhora na semântica web• O que pode mudar na maneira de testar

• De RIA pra ARIA• Dúvidas?• Referências

HTML5: o que muda?

Sobre a versão 5

• Não fará que tecnologias como Flash, Flex e Silverlight desapareçam;

• Praticamente nativo para os navegadores mobile;

• Facilita a manipulação do elementos HTML;

HTML5: o que muda?

Sobre a versão 5

• Mantida em conjunto com a WHATWG;

• Dispensa a utilização de plugins para vídeos e etc;

• Criação de código interoperável;

HTML5: o que muda?

Agenda

• Introdução• Sobre a versão 5• Melhora na semântica web• O que pode mudar na maneira de testar

• De RIA pra ARIA• Dúvidas?• Referências

HTML5: o que muda?

Melhora na semântica web

Não consegue fazer nada direito?

HTML5: o que muda?

Melhora na semântica web• Informação mais organizada;

• Permite maior compreensão por parte das máquinas;

• Possibilidade de facilitar o encontro

de informações na web;

• Melhor utilização dos metadados;

HTML5: o que muda?

Agenda

• Introdução• Sobre a versão 5• Melhora na semântica web• O que pode mudar na maneira de testar

• De RIA pra ARIA• Dúvidas?• Referências

HTML5: o que muda?

O que pode mudar na maneira de testar

• Múltiplas tecnologias;

• Poucas soluções para automação de testes que atendem aos padrões;

• Comportamento inconsistente entre diferentes navegadores;

HTML5: o que muda?

O que pode mudar na maneira de testar

CHROME 25

IE 9

FIREFOX 15

HTML5: o que muda?

O que pode mudar na maneira de testar

HTML5TEST.COM

HTML5: o que muda?

O que pode mudar na maneira de testar• Abordagem diferente, usabilidade como a

de um aplicativo desktop;

• Problemas com a possibilidade de armazenamento local, por exemplo XSS¹;

• Canvas pode não ser reconhecido na automatização de testes;

¹ Cross-site Scripting

HTML5: o que muda?

O que pode mudar na maneira de testar

<canvas id=“mycanvas” .

..

<input type=“button” ...

HTML5: o que muda?

O que pode mudar na maneira de testar

• Ambiente altamente dinâmico;

• Aplicativos desenvolvidos para navegadores e dispositivos móveis;

• Possibilidade de conversão de jogos clássicos;

HTML5: o que muda?

O que pode mudar na maneira de testar

HTML5: o que muda?

Agenda

• Introdução• Sobre a versão 5• Melhora na semântica web• O que pode mudar na maneira de testar

• De RIA pra ARIA• Dúvidas?• Referências

HTML5: o que muda?

De RIA pra ARIA

• Problemas de acessibilidade com RIA:Problemas operacionais, falta

interatividade com teclado;• Correção com Accessible RIA (ARIA):

Permitir selecionar todos os elementos e a definição de uma tecla para operá-lo;

HTML5: o que muda?

De RIA pra ARIA

<input type="range" min="0" max="50" value="10" tabindex=“9”/>;

HTML5: o que muda?

De RIA pra ARIA

• Problemas de acessibilidade com RIA:Falta de semântica para elementos

específicos de interação;• Correção com Accessible RIA (ARIA):

Fornece informações necessárias para reconhecimento de tecnologias assistivas;

HTML5: o que muda?

De RIA pra ARIA

<input type="range" min="0" max="50" value="10" tabindex=“9” role=“slider” aria-valuemin=“0” aria-valuemax=“10”/>;

HTML5: o que muda?

De RIA pra ARIA

• Problemas de acessibilidade com RIA:Informações eram atualizadas sem

informar a tecnologia assistida;• Correção com Accessible RIA (ARIA):

As regiões que são atualizadas dinâmicamente, devem ser devidamente identificadas, qual a sua prioridade e o que deve ser repassado do seu conteúdo;

HTML5: o que muda?

De RIA pra ARIA

<div id=“balaoinfo” role=“timer” aria-live=“assertive” atomic=“true”></div>;

HTML5: o que muda?

Agenda

• Introdução• Sobre a versão 5• Melhora na semântica web• O que pode mudar na maneira de testar

• De RIA pra ARIA• Dúvidas?• Referências

HTML5: o que muda?

DÚVIDAS?

HTML5: o que muda?

Agenda

• Introdução• Sobre a versão 5• Melhora na semântica web• O que pode mudar na maneira de testar

• De RIA pra ARIA• Dúvidas?• Referências

HTML5: o que muda?

Referências

EIS, Diego. A Web semântica. Disponível em: http://tableless.com.br/a-web-semantica/;

MERAYO, Ramón. Rich Internet Applications (RIA) and Web Accessibility. Disponível em: http://www.upf.edu/hipertextnet/en/numero-9/ria-and-web-accessibility.html;

FAULKNER, Steve et al; Using WAI-ARIA in HTML. Disponível em: https://dvcs.w3.org/hg/aria-unofficial/raw-file/tip/index.html;

HTML5: o que muda?

Referências

fdffff: http://slides.html5rocks.com/#landing-slide. Acessado em 17/03/2013;

http://www.w3.org/WAI/PF/aria/states_and_properties#attrs_dragdrop;

http://dev.w3.org/html5/markup/aria/aria.html

http://www.glasbergen.com/?s=cant+you+do+anything+right

http://www.whatwg.org/specs/web-apps/current-work/multipage/

http://www.w3c.br/pub/Cursos/CursoHTML5/html5-web.pdf

HTML5: o que muda?

Referências

http://www.w3.org/html/logo/

http://www.w3.org/html/wg/drafts/html/master/Overview.html

HTML5: o que muda?

OBRIGADO