Início do conteúdo

Desenho Universal aplicado à web com foco na acessibilidade


Infográfico com os nomes dos 7 princípios do desenho universal

As páginas, sites, portais, sistemas e conteúdos da web devem ser acessíveis ao maior número possível de usuários. Ser acessível significa permitir que qualquer indivíduo, utilizando qualquer tecnologia de navegação, possa acessar um ambiente na Web e ter completo entendimento das informações contidas nele, além de ter total habilidade de interação. Isso inclui garantir que o ambiente tenha uma boa interação com os recursos de Tecnologia Assistiva, como por exemplo, leitores de tela, mouses e teclados adaptados, acionadores (que são uma alternativa ao clique do mouse), softwares de reconhecimento de voz, dentre outros.

De modo a garantir a acessibilidade na web, é importante que os produtos, ambientes, programas e serviços (conteúdo) em meios digitais levem em consideração o Desenho Universal ou Desenho para Todos. Essa filosofia preconiza que qualquer artefato seja projetado de modo a ser usado por todas as pessoas, sem necessidade de adaptação ou de projeto específico.

Para que conteúdos da web sejam mais acessíveis e apresentem uma melhor interação com os recursos de Tecnologia Assistiva é indispensável seguir os “Sete Princípios do Desenho Universal”. Segundo o Centro para Desenho Universal da Universidade do Estado de Carolina do Norte esses sete princípios são: uso equitativo, flexibilidade do uso, uso simples e intuitivo, informação de fácil percepção, tolerância a erros, baixo esforço físico e dimensão e espaço para acesso e uso. Trazendo esses princípios para o campo da acessibilidade à web, temos:

1. Uso equitativo

Esse princípio diz respeito a possibilitar o uso de diferentes espaços, produtos, serviços e informações por usuários com as mais variadas capacidades. Na web isso significa garantir que a mesma interface mantenha-se intuitiva, atraente e utilizável a usuários com diversas capacidades. Alguns exemplos desse princípio são:

  • Possibilitar o acesso a qualquer conteúdo ou funcionalidade do ambiente via teclado, permitindo o acesso de usuários que não podem usar o mouse;
  • Disponibilizar mecanismos que facilitem a navegação (atalhos, âncoras, divisão de blocos, campos de pesquisa, dentre outros) e o entendimento do conteúdo por usuários cegos que utilizam leitores de tela;
  • Permitir o uso de ampliadores de tela, como também possibilitar alterações visuais de apresentação do conteúdo (tipo e tamanho da fonte, contraste, dentre outros) por usuários com baixa visão;
  • Disponibilizar alternativas para áudio (transcrição textual) e vídeo (transcrição textual, legenda ou alternativa em LIBRAS – Língua Brasileira de Sinais) para garantir o acesso de usuários surdos ao conteúdo multimídia.
2. Flexibilidade de uso

O design é concebido de modo que atenda a usuários com diferentes habilidades e múltiplas preferências. Na web isso significa permitir que o conteúdo possa ser acessado de diferentes formas e por diferentes dispositivos. Alguns exemplos são:

  • A construção de páginas com layout responsivo, de modo que o conteúdo se adapte ao tamanho da tela (computadores, notebooks, smartphones e tablets);
  • O acesso ao conteúdo através de Linha ou Display Braille por usuários cegos ou surdocegos;
  • O acesso ao conteúdo através de softwares que facilitam a leitura e a escrita, como por exemplo, leitores de tela, teclados virtuais, softwares de reconhecimento de voz, dentre outros;
  • A disponibilização de conteúdos e tarefas que podem ser acessados sem limite de tempo, permitindo que o usuário siga seu próprio ritmo;
  • O controle do usuário sobre o ambiente, assegurando a possibilidade de pausar, retroceder, avançar, aumentar e diminuir volume, ocultar e mostrar conteúdos e outras funcionalidades;
  • A oferta de uma interface limpa com facilidade para localizar botões e demais controles.
3. Uso simples e intuitivo

Esse princípio abrange o fácil entendimento para que qualquer pessoa possa compreender o conteúdo, independente de sua experiência, conhecimento, habilidades de linguagem ou nível de concentração. Em ambientes virtuais, esse princípio diz respeito a assegurar informações e instruções claras e concisas, com linguagem simples, fornecendo feedbacks durante a execução e finalização de tarefas. Exemplos são:

  • Evitar parágrafos muito longos;
  • Dividir o texto em tópicos mais curtos sempre que possível;
  • Dar preferência às fontes sem serifa, como Verdana e Arial;
  • Fornecer uma descrição textual para imagens complexas, gráficos e tabelas com muitos dados;
  • Oferecer um glossário para explicação de termos técnicos ou expressões muito rebuscadas;
  • Evitar utilizar imagens decorativas e objetos com animação (gifs, texto e imagens que se movem, etc.) que não transmitem conteúdo, pois acabam por desviar a atenção dos usuários.
4. Informação de fácil percepção

A informação necessária é transmitida de maneira a atender as necessidades de quem a recebe, independente de condições ambientais (estrangeiros) ou habilidades sensoriais do usuário (dificuldades de visão, audição, dentre outras). Na web isso abrange pensar em diferentes formas de apresentar o conteúdo, como também delimitar claramente o que é informação prioritária e o que é secundário. Exemplos são:

  • Fornecer transcrição textual para conteúdo em áudio;
  • Fornecer opção para conteúdo em vídeo, como transcrição textual, legenda, audiodescrição e alternativa em LIBRAS;
  • Não utilizar apenas características sensoriais como cor, forma, posicionamento para identificar ou destacar informações;
  • Oferecer uma boa relação de contraste entre plano de fundo e primeiro plano;
  • Manter o foco de navegação por meio do mouse ou via teclado visualmente evidente;
  • Dividir blocos de informação de maneira lógica e organizada, como por exemplo, topo, conteúdo, menu e rodapé.
5. Tolerância a erros

Busca minimizar erros, diminuindo riscos e possíveis consequências de ações acidentais ou não intencionais. Em aplicações web, se o usuário cometer um erro, o sistema automaticamente o corrige ou fornece um feedback para que o problema possa ser resolvido de maneira fácil e efetiva. São alguns exemplos desse princípio:

  • Fornecer dicas de preenchimento em campos de formulário, prevenindo ou minimizando erros de informação fornecidos pelo usuário;
  • Identificar claramente quais campos são de preenchimento obrigatórios ao solicitar informações ao usuário;
  • Fornecer alertas de erro que sejam claros, perceptíveis e que possam receber foco via teclado.
6. Baixo esforço físico

Preconiza o uso eficiente, é ergonômico, ou seja, confortável e como mínimo de fadiga.
Na web esse princípio pode ser facilitado por meio do layout, que deve ser intuitivo, simples e operável. São exemplos:

  • Oferecer contraste adequado, ou ainda, opções de autocontraste a usuários com baixa visão, de maneira que não necessitem “forçar” seu resíduo visual;
  • Permitir o redimensionamento do conteúdo sem a perda de funcionalidade, ou seja, sem que haja sobreposições de texto ou aparecimento de barras de rolagem;
  • Fornecer teclas de atalho que saltem para blocos específicos do conteúdo (menu, conteúdo, campo de busca, rodapé, dentre outros);
  • Não utilizar uma grande quantidade de teclas na combinação dos atalhos ou para realizar determinada ação;
  • Para conteúdos extensos, fornecer sumário de âncoras que saltem para sessões específicas;
  • Não exigir que o usuário realize diversas ações simultaneamente.
7. Dimensão e espaço para acesso e uso

Estabelece dimensões e espaço apropriado para o acesso, o alcance, a manipulação, e o uso, independente do tamanho do corpo (obesidade, nanismo…), postura ou mobilidade do usuário (movimentos involuntários, dificuldades de preensão…). Para o webdesign, seguir este princípio envolve fornecer espaço suficiente entre os controles de uma página, incluindo controles de navegação e uma área grande o suficiente para receber o foco. São exemplos:

  • Usar os menus em cascata somente quando forem realmente necessários, uma vez que usuários com deficiência físico-motora podem apresentar dificuldades em manter o foco com o mouse;
  • Fornecer um tamanho adequado para os botões e controles de uma página, de maneira que não sejam muito pequenos ou pouco visíveis;
  • Ao separar botões, links, e áreas de conteúdo fornecer uma área de separação que facilite o clique e a visualização do foco.

O Desenho Universal é um paradigma relativamente novo, cujos princípios trazem a ideia de diminuição de barreiras, com o objetivo principal de incluir a maior quantidade de usuários possível. Portanto, os princípios do Desenho Universal estão amplamente relacionados à garantia de acessibilidade, seja no meio físico ou virtual.

Fim do conteúdo