Design Orientado as Especificações do W3C e Acessibilidade
Tópicos <ul><li>W3C </li></ul><ul><li>Acessibilidade na Web </li></ul><ul><li>As especificações XHTML e CSS </li></ul>
W3C The World Wide Web Consortium
Os membros <ul><li>Participam do W3C  429 membros , responsáveis por  regular  as tecnologias utilizadas na Web:  Adobe, A...
As especificações <ul><li>O W3C regulamenta as tecnologias utilizadas na Web através das  especificações : HTML, XML, XHTM...
O diretor <ul><li>Tim Berners-Lee,  inventor da Web  e diretor do W3C.  </li></ul>
O pesquisador <ul><li>Tim Berners-Lee,  abdicou de todo provento financeiro  de sua invenção para continuar vivendo como u...
Acessibilidade na Web  <ul><li>“ O poder da Web está em sua universalidade. Ser acessada por todos, independe de deficiênc...
Quem acessa a Web?
Cristina, surda e cega  <ul><li>Cristina,  surda e cega , conheceu o marido em uma sala de bate-papo. </li></ul>
Lucas, paralisia cerebral  <ul><li>Lucas, tem  paralisia cerebral , é editor de um boletim on-line.  </li></ul>
Paulo, tetraplégico <ul><li>Paulo,  tetraplégico , projeta portais para Web. “Quando navego na Web, ou escrevo um e-mail, ...
Como eles acessam a Web?
Tecnologias assistivas <ul><li>Recursos  e  serviços  que facilitam a vida de pessoas portadoras de necessidades especiais...
Tecnologias assistivas <ul><li>Existem diferentes tecnologias assistivas, no contexto da interação Humano-computador. </li...
Tecnologias assistivas <ul><li>Linhas braile  permitem ao cego surdo interagir com o computador. </li></ul>
Tecnologias assistivas <ul><li>Teclados braile  para dispositivos móveis. </li></ul>
Tecnologias assistivas <ul><li>Rastreador  para interação através do movimento dos  olhos . </li></ul>
Tecnologias assistivas <ul><li>Rastreador  para interação através do movimento da  cabeça . </li></ul>
Tecnologias assistivas <ul><li>Apontador para interação por movimentos da cabeça. </li></ul>
Tecnologias assistivas <ul><li>Sistema  que permite controlar o cursor com a  boca . </li></ul>
Tecnologias assistivas <ul><li>Esferas para pessoas com dificuldades motoras. </li></ul>
Tecnologias assistivas <ul><li>Leitores de tela com síntese de voz. </li></ul>
Normas de acessibilidade <ul><li>O W3C   desenvolveu  normas  para  promover   a acessibilidade  na Web. </li></ul>
Leis de acessibilidade <ul><li>Diversos paises, inclusive o  Brasil , possuem  leis   de acessibilidade  baseadas nas norm...
Testes de acessibilidade <ul><li>É necessário avaliar a acessibilidade de um portal por meio de  sistemas de avaliação . <...
Laboratório <ul><li>É recomendado o uso de um laboratório para realizar testes de  acessibilidade  e  usabilidade . </li><...
Planta de um laboratório SALA  DE OBSERVAÇÂO TV e monitor Computador SALA  DE TESTES Equipamento  de gravação Equipamento ...
XHTML e CSS Um novo paradigma!
XHTML, a evolução da HTML
CSS, a linguagem de design da Web
Conteúdo, Formatação e Dispositivo
Conteúdo, Formatação e Dispositivo
CSS Zen Garden www.csszengarden.com
 
 
 
 
 
 
 
 
 
Procedimentos do design orientado as especificações do W3C Com XHTML e CSS.
Identificar as diferentes áreas de uma página <ul><li>Dividir a página em áreas com o elemento  <div>  e identificá-las   ...
 
Usar marcação descritiva <ul><li>Usar a XHTML para descrever o conteúdo, evitando os  elementos  e  atributos  de formataç...
Respeitar a função semântica de cada elemento <ul><li>Escolher os  elementos adequados  para descrever o conteúdo. </li></...
 
Validar a página <ul><li>A XHTML possui regras, a validação da página verifica o cumprimento destas regras. </li></ul><ul>...
Conferir o resultado nos principais dispositivos
Estudar <ul><li>As normas de acessibilidade do W3C; </li></ul><ul><li>Os conceitos de usabilidade na Web; </li></ul><ul><l...
Perguntas?
Upcoming SlideShare
Loading in …5
×

W3 C E Usabilidade

705 views

Published on

Slide - W3C e Usabilidade

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
705
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
16
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

W3 C E Usabilidade

  1. 1. Design Orientado as Especificações do W3C e Acessibilidade
  2. 2. Tópicos <ul><li>W3C </li></ul><ul><li>Acessibilidade na Web </li></ul><ul><li>As especificações XHTML e CSS </li></ul>
  3. 3. W3C The World Wide Web Consortium
  4. 4. Os membros <ul><li>Participam do W3C 429 membros , responsáveis por regular as tecnologias utilizadas na Web: Adobe, Apple, Google, IBM, Intel, Microsoft, Sony, Yahoo... </li></ul>
  5. 5. As especificações <ul><li>O W3C regulamenta as tecnologias utilizadas na Web através das especificações : HTML, XML, XHTML, XSL, XSLT, XPATH, PNG, CSS... </li></ul>
  6. 6. O diretor <ul><li>Tim Berners-Lee, inventor da Web e diretor do W3C. </li></ul>
  7. 7. O pesquisador <ul><li>Tim Berners-Lee, abdicou de todo provento financeiro de sua invenção para continuar vivendo como um pesquisador . </li></ul>
  8. 8. Acessibilidade na Web <ul><li>“ O poder da Web está em sua universalidade. Ser acessada por todos, independe de deficiência, é um aspecto essencial.” Tim Berners-Lee </li></ul>
  9. 9. Quem acessa a Web?
  10. 10. Cristina, surda e cega <ul><li>Cristina, surda e cega , conheceu o marido em uma sala de bate-papo. </li></ul>
  11. 11. Lucas, paralisia cerebral <ul><li>Lucas, tem paralisia cerebral , é editor de um boletim on-line. </li></ul>
  12. 12. Paulo, tetraplégico <ul><li>Paulo, tetraplégico , projeta portais para Web. “Quando navego na Web, ou escrevo um e-mail, não há incapacidade.” </li></ul>
  13. 13. Como eles acessam a Web?
  14. 14. Tecnologias assistivas <ul><li>Recursos e serviços que facilitam a vida de pessoas portadoras de necessidades especiais. </li></ul>
  15. 15. Tecnologias assistivas <ul><li>Existem diferentes tecnologias assistivas, no contexto da interação Humano-computador. </li></ul>
  16. 16. Tecnologias assistivas <ul><li>Linhas braile permitem ao cego surdo interagir com o computador. </li></ul>
  17. 17. Tecnologias assistivas <ul><li>Teclados braile para dispositivos móveis. </li></ul>
  18. 18. Tecnologias assistivas <ul><li>Rastreador para interação através do movimento dos olhos . </li></ul>
  19. 19. Tecnologias assistivas <ul><li>Rastreador para interação através do movimento da cabeça . </li></ul>
  20. 20. Tecnologias assistivas <ul><li>Apontador para interação por movimentos da cabeça. </li></ul>
  21. 21. Tecnologias assistivas <ul><li>Sistema que permite controlar o cursor com a boca . </li></ul>
  22. 22. Tecnologias assistivas <ul><li>Esferas para pessoas com dificuldades motoras. </li></ul>
  23. 23. Tecnologias assistivas <ul><li>Leitores de tela com síntese de voz. </li></ul>
  24. 24. Normas de acessibilidade <ul><li>O W3C desenvolveu normas para promover a acessibilidade na Web. </li></ul>
  25. 25. Leis de acessibilidade <ul><li>Diversos paises, inclusive o Brasil , possuem leis de acessibilidade baseadas nas normas do W3C. </li></ul>
  26. 26. Testes de acessibilidade <ul><li>É necessário avaliar a acessibilidade de um portal por meio de sistemas de avaliação . </li></ul><ul><li>Nenhum sistema de avaliação substitui os testes com usuários . </li></ul>
  27. 27. Laboratório <ul><li>É recomendado o uso de um laboratório para realizar testes de acessibilidade e usabilidade . </li></ul>
  28. 28. Planta de um laboratório SALA DE OBSERVAÇÂO TV e monitor Computador SALA DE TESTES Equipamento de gravação Equipamento de áudio Avaliador Usuário testado Câmera
  29. 29. XHTML e CSS Um novo paradigma!
  30. 30. XHTML, a evolução da HTML
  31. 31. CSS, a linguagem de design da Web
  32. 32. Conteúdo, Formatação e Dispositivo
  33. 33. Conteúdo, Formatação e Dispositivo
  34. 34. CSS Zen Garden www.csszengarden.com
  35. 44. Procedimentos do design orientado as especificações do W3C Com XHTML e CSS.
  36. 45. Identificar as diferentes áreas de uma página <ul><li>Dividir a página em áreas com o elemento <div> e identificá-las com o atributo “ id ”, exemplo: <div id=“ navegacao ”> ... </div> </li></ul>
  37. 47. Usar marcação descritiva <ul><li>Usar a XHTML para descrever o conteúdo, evitando os elementos e atributos de formatação. </li></ul><ul><li>O elemento <font> , por exemplo, está obsoleto. </li></ul>
  38. 48. Respeitar a função semântica de cada elemento <ul><li>Escolher os elementos adequados para descrever o conteúdo. </li></ul><ul><li>O elemento <table> , por exemplo, deve ser usado apenas para descrever dados tabulares. </li></ul>
  39. 50. Validar a página <ul><li>A XHTML possui regras, a validação da página verifica o cumprimento destas regras. </li></ul><ul><li>A página precisa estar válida para ser formatada com CSS. </li></ul>
  40. 51. Conferir o resultado nos principais dispositivos
  41. 52. Estudar <ul><li>As normas de acessibilidade do W3C; </li></ul><ul><li>Os conceitos de usabilidade na Web; </li></ul><ul><li>As normas e técnicas para implementar XHTML com eficiência; </li></ul><ul><li>As normas e técnicas para implementar CSS com eficiência. </li></ul>
  42. 53. Perguntas?

×