apresentação acesse

36
Taynara Jaegger Profs.: Christiane Melcher Eduardo Ariel Eduardo Brandão Edson Rufino PUC RIO | 19.12.09

Upload: taynaraj

Post on 05-Dec-2014

2.554 views

Category:

Design


2 download

DESCRIPTION

Projeto final do curso de especialização em Ergodesign de Interfaces, da PUC-Rio focando em acessibilidade

TRANSCRIPT

Page 1: Apresentação Acesse

Taynara Jaegger

Profs.: Christiane Melcher

Eduardo Ariel

Eduardo Brandão

Edson Rufino

PUC RIO | 19.12.09

Page 2: Apresentação Acesse

A Interface

Page 3: Apresentação Acesse

Introdução“ Uma comunidade acessível para inclusão e

integração social. “

A rede social Acesse, tem o objetivo de criar um

ambiente onde pessoas deficientes e pessoas

sem deficiência possam se relacionar entre si. A

facilidade deste relacionamento é caracterizada

pela fácil acessibilidade de navegação que é

divulgado pela rede.

Page 4: Apresentação Acesse

JustificativaEste tema foi escolhido por ter surgido a necessidade

de avaliar se o objetivo da rede está sendo

alcançado.

Se a rede social é realmente de fácil acessibilidade e

usabilidade para os deficientes e estes conseguem

interagir com todas as pessoas.

O foco principal deste projeto são os usuários cegos,

pois segundo o IBGE existem 148 mil pessoas

cegas no Brasil. É de grande valia tornar a web mais

acessível para essas pessoas.

Page 5: Apresentação Acesse

Objetivo

Sugerir uma interface mais acessível a fim de atender as expectativas dos usuários cegos.

Page 6: Apresentação Acesse

Objeto de pesquisa

Diretrizes de acessibilidade recomendadas pelo W3C

2 usuários cegos:

- Usuário, assíduo de redes sociais

- Usuária na qual é especialista na área de Acessibilidade na Web.

Page 7: Apresentação Acesse

Metodologia- Avaliação de conformidade com as diretrizes da

Acessibilidade, o WCAG 2.0

- Avaliação cooperativa com usuários cegos para obter

opiniões e identificar elementos que possuam

dificuldade de uso

- Questionário para coletar dados do perfil dos usuários

Page 8: Apresentação Acesse

WCAG 2.0

Níveis de Conformidade:

- Nível A (nível mínimo de conformidade)

- Nível AA (nível mediano de conformidade)

- Nível AAA (nível máximo de conformidade)

Page 9: Apresentação Acesse

Casos de reprovação Nível A

- Nesta página não existe uma descrição de que existe um vídeo para ser acessado.

Page 10: Apresentação Acesse

Casos de reprovação Nível A

- O ícone ao lado de alguns amigos significa que ele é atleta, não existe uma descrição deste.

Page 11: Apresentação Acesse

Casos de reprovação Nível A

- O link “Editar Imagem” confunde o usuário, dando uma alusão de que poderá fazer uma edição de qualquer imagem que ele possuir.

Page 12: Apresentação Acesse

Casos de reprovação Nível A

- As páginas não estão em conformidade com a especificação de tipo de documento XML 1.0 Transictional, segundo o validador do W3C ( http://validator.w3.org/ ).

Page 13: Apresentação Acesse

Casos de reprovação Nível AA

- Não existe uma audiodescrição no vídeo existente na página inicial

- Apesar de existir a funcionalidade de aumentar o texto ela só aumenta o texto em média 22 porcentos, quando deveria aumentar em até 200 porcentos.

Page 14: Apresentação Acesse

Casos de reprovação Nível AA

- Existem hyperlinks, que possuem a aparência de botão.

Page 15: Apresentação Acesse

Casos de reprovação Nível AA

- Apresentação visual em relação ao contraste foram reprovadas, o contraste mínimo seria de 4:5:1

Título descritivo da rede social

Valor do Contraste: 3.4:1

Barras de Saltos das páginas

Valor do Contraste: 1.9.1

Botões da cor Laranja

Valor do Contraste: 3.6.1

Page 16: Apresentação Acesse

Casos de reprovação

Título descritivo da rede social

Valor do Contraste: 3.4:1

Nível AA

Page 17: Apresentação Acesse

Casos de aprovação Nível A

- Na execução do vídeo é fornecido uma legenda, durante a fala dos atletas

Page 18: Apresentação Acesse

Casos de aprovação Nível A

- Apesar de não haver audiodescrição, existe uma alternativa de texto, descrevendo as falas do vídeo

Page 19: Apresentação Acesse

Casos de aprovação Nível A

- O código do HTML é semântico, possuindo listagens. As imagens existentes no site possuem descrições.

- A informação no código é estrutrada de acordo com a sequência de leitura.

- Não existem visualizações do site que sejam feitas somente através de imagens, todo conteúdo mostrado por imagem possui uma descrição visível para o leitor de telas.

- Todo conteúdo do site está acessível via teclado. Não há restrição de tempo para a entrada de dados.

- Não é oferecido limite de tempo para o acesso da interface. Não existem alterações inesperadas durante o acesso.

Page 20: Apresentação Acesse

Casos de aprovação Nível A

- As páginas Web não incluem qualquer conteúdo com mais de três flashes no período de um segundo.

- A rede social possui links com saltos que são exibidos no topo da página para conteúdos principais facilitando a navegação

Page 21: Apresentação Acesse

Casos de aprovação Nível A

Page 22: Apresentação Acesse

Casos de aprovação Nível A

- Todas as páginas possuem títulos no cabeçalho das páginas.

- Todo os conteúdos do site estão estruturados na ordem de leitura.

- O idioma do site é definido programaticamente nas páginas.

- Todos os elementos do site ao receberem foco, não iniciam alterações no contexto.

- Os campos de formulários e hyperlinks podem ser identificadas de forma programática.

Page 23: Apresentação Acesse

Casos de aprovação Nível A

- Toda a informação de erro é exibida no início do formulário e na etiqueta do campo relacionado.

Page 24: Apresentação Acesse

Casos de aprovação Nível A

- Todos formulários possuem etiquetas antes das entrada de dados.

Page 25: Apresentação Acesse

Casos de aprovação Nível AA

- O site possui uma boa navegação, o usuário pode localizar qualquer informação de várias formas possíveis.

Page 26: Apresentação Acesse

Casos de aprovação Nível AA

- Existem cabeçalhos dos conteúdos principais e rótulos nos campos de preenchimento.

Page 27: Apresentação Acesse

Casos de aprovação Nível AA

- Todos mecanismos de repetição são exibidos sempre da mesma forma, tornando a navegação consistente

- Toda informação de erro é descritiva , informando o que se pode fazer para a correção da ação.

Page 28: Apresentação Acesse

Casos de aprovação Nível AA

- Todos mecanismos de repetição são exibidos sempre da mesma forma, tornando a navegação consistente

- Toda informação de erro é descritiva , informando o que se pode fazer para a correção da ação.

Page 29: Apresentação Acesse

Avaliação CooperativaA avaliação foi realizada em ambientes calmos, sem

interferência de outras pessoas.

O sintetizador de telas usado na avaliação foi o DOSVOX, criado pelo NCE (Núcleo de Computação Eletrônica da UFRJ).

Page 30: Apresentação Acesse

Avaliação CooperativaAs seguintes tarefas foram propostas para os usuários:

1. Cadastre-se no site

2. Acesse o site

3. Inclua outras informações em seu perfil

4. Me adicionar como amiga

5. Leia seu perfil

6. Desconecte a rede social

Page 31: Apresentação Acesse

Avaliação Cooperativa• Pontos Negativos encontrados:

1. Dificuldade de incluir imagem pelo leitor de telasem questão

2. Confusão no rótulo “Redigite a senha” no campo de Senha no Cadastro após exibido um erro

3. Confusão no link “Editar Imagem”

4. Na opinião de uma usuária link “Opine sobreeste site” não deveria estar na listagens de links sobre mim

5. Confusão para entender o link “Perfil” dentro dacategoria “Editar Perfil”. Porque os nomes se repetem?

6. Confusão no campo Apelido por ele ser

Page 32: Apresentação Acesse

Avaliação Cooperativa• Pontos Positivos encontrados:

1. Encontraram facilidade navegação, algumasvezes não foi necesário usar os Saltos

2. Os saltos o ajudaram a pular rapidamente para o conteúdo na qual desejavam

3. A existência de feedbacks após as ações.

Page 33: Apresentação Acesse

QuestionárioO questionário foi feito logo após a avaliação

cooperativa com o usuário.

Foi verificado que os usuários acessam a internet todos os dias , mais de 3 horas por dia.

Um usuário não é assíduo de redes socias maisnavega em outros sites na internet.

O usuário que usa rede social , usa também o Orkut.

Os dois usuários costumam usar o Jaws comosintetizador de telas, mas sabem manusiar o DOSVOX.

Os usuários não interagem em comunidades emuma rede social.

Page 34: Apresentação Acesse

Conclusão

Apesar de não existir um site totalmente acessívelna web, esta avaliação concluiu que a redesocial está bem próxima de uma navegação semdificuldades para cegos.

As dificuldades encontradas são pequenas e nãoimpediram dos usuários realizarem suas tarefas.

Apesar do site não ter validado totalmente peloW3C, a sua navegação é de fácil entendimento.

Para que o site tanha uma maior facilidade, é preciso rever os problemas encontrados e melhorá-los de acordo com o sugerido.

Page 35: Apresentação Acesse

Seguimentos futuros1. Abranger um pouco mais a pesquisa de

acessibilidade no site, incluindo a parte de Comunidades e Fotos, que é uma parte curiosa para os cegos

2. Novas avaliações cooperativas para que sejamdadas mais opiniões sobre a acessibilidade darede social