Acessibilidade na Web.

Apresentação em tema: "Acessibilidade na Web."— Transcrição da apresentação:

1 Acessibilidade na Web

2

3 Para quem é? Acessibilidade é para todos e não somente para pessoas com algum tipo de eficiência física. Pessoas mais idosas; Pessoas que acessam dispositivos móveis (celulares); Crianças aprendendo a “mexer” nos dispositivos Pessoas com “aversão ao uso de tecnologia” Conformidade com o decreto de lei 5296 (dez/04) e com a convenção da ONU que ganhou força de lei (ago/08) ;

4 Acessibilidade na Web Conceito: Desenvolver sites para todos, com ou sem deficiência Todo conteúdo pode ser acessado por qualquer pessoa, incluindo aquelas com necessidade especial que acessam o conteúdo através de tecnologia assistiva. Vídeo Acessibilidade web: Custo ou benefício

5 Acessibilidade web Padrões:
O consórcio World Wide Web (W3C) criado por Tim Berners-Lee desenvolve padrões universais para web criou, em 1999, o WAI (Web Accessibility Initiative) e publicou as “Recomendações de Acessibilidade para o Conteúdo da Web 2.0” No Brasil, o decreto nº de dezembro de 2004 estabeleceu um prazo para tornar acessíveis os sites da administração pública, de interesse público ou financiado pelo governo. Para viabilizar a implantação dessa lei, foi criado pelo Governo Eletrônico e em conformidade com os padrões internacionais. o Modelo de Acessibilidade Brasileiro (e-MAG), conjunto de recomendações para que o processo de acessibilidade dos sites do governo brasileiro seja conduzido de forma padronizada e de fácil implementação.

6 Acessibilidade web Como saber se o site é acessível?
Validar o site através de ferramentas automáticas e com especialistas em acessibilidade web.

7 Usabilidade web Conceito:
Usabilidade é a medida na qual um produto pode ser usado por usuários específicos para alcançar objetivos específicos com efetividade, eficiência e satisfação num contexto específico de uso. (ISO ) Atributos da Usabilidade

8 Usabilidade web Atributos: Eficiente no uso:
Uma vez que o usuário tenha aprendido a utilizar o sistema, ele será capaz de manter a produtividade ? Seguro no uso: O sistema previne o usuário de cometer erros graves e permite que os erros sejam recuperados facilmente? De boa utilidade: O sistema fornece um conjunto apropriado de funções que permita aos usuários realizar todas as suas tarefas da maneira que desejam?

9 Usabilidade web Atributos: Fácil de entender:
O sistema é de fácil aprendizagem e permite que as tarefas fundamentais sejam aprendidas rapidamente? Fácil de lembrar como usar: O sistema fornece suporte de interface que auxiliam o usuário a relembrar com as tarefas devem ser realizadas?

10 Foco na experiência do usuário (visão subjetiva da interação)
Usabilidade web Metas – Experiência do usuário: Foco na experiência do usuário (visão subjetiva da interação) Desenvolver produtos interativos onde o usuário desenvolva sua capacidade cognitiva e criativa a partir do uso do sistema.

11 Metas – Experiência do usuário:
Usabilidade web Metas – Experiência do usuário: Satisfatórios Agradáveis Motivadores Interessantes Úteis Emocionalmente adequados Esteticamente apreciáveis Incentivadores de criatividade Compensadores

12 Heurísticas e Princípios de Usabilidade
Usabilidade web Heurísticas e Princípios de Usabilidade Abstrações genéricas que visam orientar o projeto de design Não é um manual, ou um guia prático, mas parte de premissas básicas e orienta para características que o site deverá possuir. Servem para avaliar o que foi desenvolvido

13 Usabilidade web Visibilidade do status do sistema
Heurística de Nielsen Visibilidade do status do sistema Compatibilidade do sistema com o mundo real Controle do usuário e liberdade Ajuda os usuário a reconhecer, diagnosticar e recuperar-se de erros Consistências e padrões

14 Usabilidade web Heurística de Nielsen Prevenção de erros
Reconhecimento em vez de memorização Flexibilidade e eficiência de uso Estética e design minimalista Ajuda e documentação

15 Usabilidade web Como avaliar a usabilidade
Especialistas realizam testes formais através de diferentes técnicas: Com a participação de usuários alvo do sistema Observação da interação Entrevistas e questionários Sem a participação de usuário Percurso Cognitivo Avaliação Heurística Observar, registrar, quantificar e medir as taxas de Eficácia, Eficiência e Produtividade do usuário na interação com o sistema.

16 Usabilidade web O que é uma abordagem centrada no usuário ?
Para desenvolver um produto que leve em consideração as necessidades dos usuários reais deve-se: 1 – Focar no usuário e nas tarefas - Entender quem são os usuários, suas características cognitivas, comportamentais. Como: observando-os durante a realização de suas tarefas, entendendo a natureza destas tarefas e envolvendo-os no processo de design. 2 – Avaliação Empírica – Durante todo o processo de desenvolvimento, as interações dos usuários com os protótipos devem ser registradas e analisadas. 3 – Design Interativo – Ciclos de “design, teste, avaliação por usuários reais e re-designe”, quantas vezes forem necessárias.

17 Usabilidade web O que é uma abordagem centrada no usuário ? Há cinco atividades que nos ajudam a Focar no usuário e nas tarefas: 1 – Tarefas e metas do usuário são a força condutora por trás do desenvolvimento – Ao invés de perguntarmos: “Onde podemos aplicar essa nova tecnologia?”, perguntar: “Que tecnologias estão disponíveis para melhorar a forma como os usuários interagem com o sistema?”

18 Usabilidade web 2 – Comportamento do usuário e contexto de uso são estudados, e o sistema é projetado para fornecer suporte a eles – Entender o comportamento dos usuários na realização de suas tarefas e quais metas deverão ser alcançadas.

19 Usabilidade web 3 – As características dos usuários são capturadas para o design atendê-las – deve-se levar em conta limitações cognitivas e físicas, bem como os seguintes aspectos: atenção, memória e percepção. A cognição se divide em dois modos: Cognição Experiencial Cognição Reflexiva

20 Usabilidade web 4 – Os usuários são consultados em todas as etapas do desenvolvimento, desde as fases iniciais até as últimas, e sua contribuição é seriamente levada em conta.

21 Usabilidade web 5 – Todas as decisões de design são tomadas dentro do contexto dos usuários, seu trabalho e seu ambiente.

22 Arquitetura da Informação
O que isso tem a ver com acessibilidade e usabilidade na web ? ...TUDO Conceito: Tornar claro o que é complexo (Wurman, 1997) "A prática de projetar a infra-estrutura de um webwebsite, especialmente a sua navegação" (WEST, 1999). A ciência e a arte de organizar e rotular sites dando suporte a usabilidade e facilidade de busca (Information Architecture Institute) Foco na organização da informação no site, fazendo com que o usuário ache a informação desejada. Contexto – Conteúdo - Usuário

23 Arquitetura da Informação
O que isso tem a ver com biblioteconomia ? ...TUDO

24 Arquitetura da Informação
Os três pilares da arquitetura da informação: Quantidade de documentos, Formato/tipo, estrutura, metadados, dinamismo. objetivos do site, cultura e política da empresa, ambiente de uso, tecnologia. conteúdo contexto Necessidades, Comportamentos de busca, experiências, vocabulário usuário Fonte: Rosenfeld & Peter Morville (1998)

25 Arquitetura da Informação
O que o arquiteto de Informação faz: Prever o percurso do usuário para chegar a determinada informação; Entender os diversos sistemas de signos que os distintos usuários compreendem para facilitar a interação dos usuários Estruturar os sites na web facilitando a navegação dos usuários através de recursos como Menus de Navegação e Vocabulário Controlado

26 Arquitetura da Informação
A Arquitetura de Informação na web pode ser dividida em quatro sistemas: Sistema de Organização: Define a classificação de todo o conteúdo, como ele será organizado de modo a evitar ambiquidades. Fonte:usabilidoido.com.br Fonte:

27 Arquitetura da Informação
Sistema de Rotulação: Define as formas de representação, de apresentação, da informação definindo rótulos claros e informativos para cada elemento da página. Deve-se utilizar a linguagem do usuário para representar informação rápida e eficaz Exemplos: Nomes dos títulos das páginas; Nomes dos itens do menu; Utilizar signos informativos.

28 Arquitetura da Informação
Sistema de Navegação: Define as maneiras de navegar entre os links e a informação disponível, estabelecendo as categorias e subcategorias de informação de forma a facilitar a navegação dos usuários. Exemplos: Menu principal (pull-down ou pop-up); Mapa do site; Breadcrump ajudar a orientar os usuários Link azul não visitado roxo visitado Um bom sistemas de navegação deve responder as 3 perguntas básicas: Onde estou? Onde estive? Aonde posso ir?

29 Arquitetura da Informação
Sistema de Busca: Define as possíveis perguntas realizadas pelos usuários e as respostas que ele irá obter. Exemplo1: Quais caminhos o usuário irá percorrer para procura por: um item conhecido: ele sabe o que quer encontrar um item existente: ele tem idéia do que quer encontrar Procura exploratória: ele quer saber o que pode encontrar Exemplo2: Disponibilizar mais de uma opção de busca, Indicar outras fontes de informação relativas ao item buscado Ajuda o usuário a não cometer erros Exibir como resposta da busca as informações necessárias aos usuários.

30 Arquitetura da Informação
Exemplo de problemas de usabilidade e arquitetura da informação Fonte: (Agner, 2008)

31 Arquitetura da Informação
Exemplo de diferentes arquiteturas de informação com o mesmo conteúdo. Acessar: ZenGarden - Técnicas para organizar o conteúdo com ajuda dos usuários cardsorting Wireframe

32 Arquitetura da Informação
Entendendo o trabalho dos usuários - Design Participativo Usuários participam de forma ativa do desenvolvimento de um site, como co-designers e não apenas nos testes de protótipo e avaliação. Card Sorting É uma técnica simples e de baixo custo, pois para sua realização são necessárias apenas papel e caneta. Entretanto, não tem foco na execução das tarefas dos usuários, apenas na estrutura das informação necessária para realização da tarefa. Cada usuário cria e organiza a estrutura do site segundo sua lógica de interação, posteriormente explicam o porquê de suas escolhas, possibilitando ao designer entender como os usuários organizam as informações de acordo com suas necessidades e as nomenclaturas utilizadas por estes.

33 Arquitetura da Informação
Entendendo o trabalho dos usuários - Design Participativo Card Sorting continuação... Possibilita identificar atividades/áreas difíceis de classificar. O card sort proporciona a visão ótima do usuário com relação ao produto. Formas de aplicação: Presencial: possibilita a troca entre os usuários e designers. Não-presencial: realizado a distancia (on-line), alguns softwares criam relatórios estatísticos automáticos, analisados posteriormente pelos designers. Sites: OptimalSort - WebSor - xSort -

34 Arquitetura da Informação
Entendendo o trabalho dos usuários - Design Participativo Wireframe Utilizado em design de interface é utilizado para exibir uma proposta de estrutura web, exibindo visualmente as funcionalidades básicas da página. Esboços da interface que o usuário terá contato sem mostrar o design gráfico, indicando links, botões e outros elementos da interface e suas relações (Van Dijck, 2003).