kit-selo

Selo de Usabilidade e Acessibilidade

Índice

Introdução

O Selo de Usabilidade e Acessibilidade destina-se principalmente às entidades que estão obrigadas ao cumprimento da Lei n.º 36/2011, de 21 de junho, que estabelece a adoção de normas abertas nos sistemas informáticos do Estado, na sequência da qual surgiu o Regulamento Nacional de Interoperabilidade Digital (RNID). O último diploma que alterou a legislação que estabelece o RNID (Lei n.º 36/2011, de 21 de junho e Resolução do Conselho de Ministros n.º 2/2018, de 5 de janeiro) foi o Decreto-Lei n.º 83/2018, de 19 de outubro. Neste diploma, onde se estabelecem os requisitos de acessibilidade dos sítios Web e das aplicações móveis de organismos públicos, o grupo-alvo do RNID ficou assim definido:

«Artigo 2.º
Âmbito de aplicação

  1. A presente lei aplica-se às seguintes entidades:
    • a) Estado;
    • b) Regiões Autónomas;
    • c) Institutos públicos;
    • d) Entidades administrativas independentes;
    • e) Fundações públicas;
    • f) Associações públicas;
    • g) Entidades do setor público empresarial.
  2. No que se refere à acessibilidade dos sítios Web e das aplicações móveis, a presente lei aplica-se igualmente às seguintes entidades:
    • a) Autarquias locais;
    • b) Organizações Não Governamentais que prestam serviços essenciais ao público ou que prestam serviços que visam especificamente responder às necessidades das pessoas com deficiência ou que lhes são diretamente dirigidos;
    • c) Instituições de ensino superior, estabelecimentos de educação pré-escolar e de educação escolar, públicos e privados com financiamento público, no que se refere ao conteúdo relativo a funções administrativas essenciais por via eletrónica.»
Redação introduzida na Lei n.º 36/2011 pelo DL n.º 83/2018, de 19 de outubro

Como se observa da enumeração anterior, para além do setor público, há um alargamento a alguns setores privados. O cumprimento dos requisitos prescritos pelo Selo de Usabilidade e Acessibilidade é fator de qualidade dos conteúdos e dos serviços disponibilizados em linha pelo que todos os setores estão convidados à sua adoção.

O Selo está estruturado em três níveis, correspondendo a 3 etapas de esforço diferenciadas. Cada uma destas etapas é chancelada por um Selo. O Selo Bronze chancela a conformidade para com os requisitos de nível 1. Ao nível intermédio corresponde o Selo Prata e ao nível mais elevado corresponde o Selo Ouro. Para obter o Selo Ouro, é necessário adicionar aos testes com utilizadores, os requisitos definidos para o Selo Bronze e para o Selo Prata.

O Selo de Usabilidade e Acessibilidade é também ele um instrumento pedagógico. A lista de requisitos não é exaustiva e dela fazem parte aspetos básicos que respondem a preocupações funcionais práticas dos utilizadores. Para o caso das pessoas com deficiências ou incapacidades a seleção dos requisitos levou em conta o princípio básico de “antes de usar é preciso aceder”, significando isto que é importante eliminar todo o tipo de barreiras que impedem estes utilizadores - utilizadores de tecnologias de apoio - de aceder aos serviços e à informação disponibilizada na Internet. Só depois de aceder podemos falar de usabilidade.

Processo de Candidatura

A AMA elaborou os requisitos a observar para a obtenção de cada um dos Selos - Bronze, Prata, Ouro - numa lógica de prática corrente, diária, a usar pelas equipas de desenvolvimento e de edição de conteúdos. As checklists não são para serem usadas apenas no momento da candidatura ao Selo. As listas de requisitos e todo o trabalho efetuado para a sua verificação - ferramentas utilizadas, estudos efetuados, etc. -, à medida que for sendo produzido, deve ser publicado no sítio Web da entidade.

Uma vez que todas as entidades abrangidas pelo DL n.º 83/2018 estão obrigadas a disponibilizar para cada sítio Web uma página com a Declaração de Acessibilidade e Usabilidade onde se faça referência a todos os esforços levados a efeito para tornar o seu sítio Web mais acessível e mais usável, é nesta página que devem ser sintetizadas todas as evidências e todas as hiperligações para relatórios e estudos que sustentam as mesmas. Para elaborar a página da Declaração de Acessibilidade e Usabilidade, a AMA criou uma ferramenta que permite gerar a Declaração de acordo com os requisitos definidos na legislação. Esta Declaração deve ficar na pasta /acessibilidade do sítio Web (i.e. www.dominio_do_site.pt/acessibilidade).

A Declaração de Acessibilidade e Usabilidade é tudo aquilo que precisa para se candidatar ao Selo. Preenchida a Declaração de Acessibilidade e Usabilidade e publicada no respetivo sítio Web, a entidade pode candidatar-se a um dos Selos, enviando à AMA um pedido de candidatura. Do pedido deve apenas fazer parte o endereço onde publicou a Declaração de Acessibilidade e Usabilidade e qual é o Selo a que se candidata: Bronze, Prata ou Ouro. O pedido pode ser feito para o endereço de correio eletrónico: selo@ama.pt.

Após confirmar a veracidade das análises apresentadas, a AMA entrará em contacto com a entidade e, em caso afirmativo, disponibilizará o código necessário para a afixação do Selo no respetivo sítio Web.

Níveis de Classificação

O Selo de Usabilidade e Acessibilidade está estruturado em 3 níveis de classificação, correspondendo a 3 níveis de esforço distintos:

Nível 1 - Selo Bronze

Para a atribuição do Selo Bronze, o sítio Web tem de cumprir com os requisitos constantes da checklist “Conteúdo” e ainda passar a bateria de testes de um validador de acessibilidade Web para o ‘AA’ das WCAG 2.1, de acordo com a metodologia constante no artigo 9.º, n.º 1, alínea a) do DL nº 83/2018, de 19 de outubro.

O nível de cumprimento desses parâmetros durante o primeiro ano deverá ser de 75%.

Nível 2 - Selo Prata

Para a atribuição do Selo Prata, cumulativamente ao que é exigido para o nível 1, o sítio Web tem de estar em conformidade para com a checklist “Transação” e da checklist “10 aspetos funcionais”.

A checklist “10 aspetos funcionais” é para ser usada de acordo com a metodologia referida no artigo 9.º, n.º 1, alínea b) do DL n.º 83/2018, de 19 de outubro.

O nível de cumprimento desses parâmetros durante o primeiro ano deverá ser de 75%.

Nível 3 - Selo Ouro

Para a atribuição do Selo Ouro, cumulativamente ao que é exigido para o nível 2, a entidade tem de efetuar testes com utilizadores ao sítio Web. Os testes deverão ser realizados por uma entidade entidade devidamente credenciada.

Este nível está também alinhado com a recomendação constante na metodologia sugerida pelo DL n.º 83/2018 no artigo 9.º, n.º 1, alínea c).

Requisitos para obter o Selo Bronze

Usabilidade: conformidade para com a Checklist “Conteúdo”

Acessibilidade: conformidade ‘AA’ das WCAG 2.1 de acordo com uma ferramenta automática

O sítio Web tem de passar a bateria de testes de um validador automático de acessibilidade Web para a conformidade ‘AA’ das Diretrizes de Acessibilidade para Conteúdo Web (WCAG 2.1), de acordo com a metodologia constante no artigo 9.º, n.º 1, alínea a) do DL nº 83/2018, de 19 de outubro:

  1. Para os sítios Web, as entidades referidas no artigo 2.º devem adotar os seguintes procedimentos de monitorização:
    • a) Procedimento simplificado automático ou semiautomático, correspondente a uma avaliação automática a uma amostra de páginas do sítio Web composta, no mínimo, pela página de entrada e por todas as páginas hiperligadas à página de entrada e contemplando, sempre que possível, os vários tipos de templates utilizados, recorrendo a um validador automático ou semiautomático de acessibilidade Web comummente utilizado no mercado;

Apresentam-se a seguir algumas das ferramentas de validação automática que podem ser usadas para proceder à análise da conformidade ‘AA’ das WCAG 2.1. Fazemos notar que a grande maioria das ferramentas atualmente existentes no mercado têm como referência a versão 2.0 das WCAG, o que é aceitável para a determinação da conformidade.

Requisitos para obter o Selo Prata

Usabilidade: conformidade para com a checklist “Transação”

Acessibilidade: conformidade para com a checklist “10 aspetos funcionais”

A checklist “10 aspetos funcionais” é para ser usada de acordo com a metodologia referida no artigo 9.º, n.º 1, alínea b) do DL n.º 83/2018:

  1. Para os sítios Web, as entidades referidas no artigo 2.º devem adotar os seguintes procedimentos de monitorização:
    (...)
    • b) Procedimento simplificado manual, correspondente a uma avaliação manual pericial a uma amostra de páginas que permita responder à diversidade de elementos constantes da lista de verificação para sítios Web publicada no sítio Web www.acessibilidade.gov.pt;

Consulte a Checklist “10 aspetos funcionais”

Requisitos para obter o Selo Ouro

Testes de Usabilidade

Para obter o Selo Ouro, além dos procedimentos descritos para o Selo Bronze e para o Selo Prata, as entidades deverão apresentar prova da realização de testes com utilizadores.

Este nível está também alinhado com a recomendação constante na metodologia sugerida pelo DL n.º 83/2018 no artigo 9.º, n.º 1, alínea c):

  1. Para os sítios Web, as entidades referidas no artigo 2.º devem adotar os seguintes procedimentos de monitorização:
    (...)
    • c) Testes de usabilidade com pessoas com deficiência, dos quais devem fazer parte como objeto de análise, pelo menos, uma tarefa e uma tipologia de utilizadores.

1 · NÚMERO DE UTILIZADORES

Nos testes com utilizadores devem participar, no mínimo, um bloco de 4 utilizadores + 2 utilizadores com necessidades especiais pertencentes a uma das seguintes tipologias: visão, audição, motora, intelectual. :
No mínimo 2 participantes com necessidades especiais por tipologia. Deve ser realizado um bloco de testes por cada 5 ações principais do sítio Web em causa.

2 · PROTOCOLO ADEQUADO

O teste deve focar-se nas principais funções do sítio Web e ser comum a todos os utilizadores. No caso de utilizadores com necessidades especiais, o protocolo deve ser aplicado no seu local de trabalho/consulta habitual usando as tecnologias de apoio habituais e com as configurações personalizadas pelo próprio participante.

3 · PROTOCOLO DE TESTES SEM VIÉS

O teste procurará não influenciar as opções do utilizador e não deverá fornecer pistas sobre a realização das tarefas, incluindo termos usados. Sempre que apropriado deve ser solicitado aos participantes que verbalizem o que estão a pensar enquanto desempenham a sua tarefa no sítio Web.

4 . Autorizações e registos das sessões

A entidade deve solicitar autorização por escrito aos participantes e, sempre que apropriado, deve efetuar registos vídeo ou áudio das sessões.

5 · RELATÓRIO FINAL COM OBSERVAÇÕES E RECOMENDAÇÕES

O relatório final deve incluir uma lista de observações e recomendações para cada uma das tarefas.

6 · INCORPORAÇÃO DE RECOMENDAÇÕES

As entidades deverão evidenciar que as recomendações foram incorporadas no sítio Web.

Condições de atribuição e afixação do Selo

Período de Atribuição

A atribuição do Selo é válida por um período de 12 meses. Contudo, se se verificar que o sítio Web sofreu uma alteração profunda o Selo será revogado.

Método de Aplicação

Após a atribuição do Selo, é disponibilizado à entidade um código que permite afixar no sítio Web o Selo que lhe foi atribuído. A entidade poderá selecionar um de quatro estilos de exibição disponíveis (ver anexo: Selos em formato svg), de forma a que se enquadre melhor na estrutura do seu sítio Web.

Qualquer utilizador que acione a hiperligação existente no Selo será direcionado para o sítio Web do Selo (https://selo.usabilidade.gov.pt) onde poderá comprovar a autenticidade do mesmo.

A entidade tem completa liberdade para afixar o Selo de Usabilidade e Acessibilidade em qualquer página ou páginas do sítio Web e nestas selecionar a posição que considerar mais apropriada.

Caducidade do Selo

As entidades podem renovar o Selo por igual período de 12 meses remetendo à AMA um processo composto de evidências atualizadas à data da renovação. Caso a entidade opte por não renovar o Selo, o mesmo caduca e será solicitado à entidade que retire o código que o afixa no respetivo sítio Web.

Anexos

Formato SVG do Selo Usabilidade e Acessibilidade

Todos os selos que se encontram abaixo estão em formato SVG, o formato vetorial gráfico do W3C. Na prática, é possível escalar qualquer um destes gráficos sem perda de resolução - pode ter um pequeno ícone ou um gráfico do tamanho de um múpi. Para os descarregar, basta selecionar a imagem e com o menu contextual (botão direito do rato) selecionar “guardar como”.

Para cada nível existem 4 versões do selo. Pode optar por afixar aquela que melhor se adequa ao seu design.

Versões do Selo Ouro

Selo Ouro
Selo Ouro - vertical
Selo Ouro - horizontal e letra branca
Selo Ouro - horizontal

Versoões do Selo Prata

Selo Prata
Selo Prata - vertical
Selo Prata - horizontal e letra branca
Selo Prata - horizontal

Versões do Selo Bronze

Selo Bronze
Selo Bronze - vertical
Selo Bronze - horizontal e letra branca
Selo Bronze - horizontal

Checklist “10 aspetos funcionais de acessibilidade”

Nota: a entidade deve preencher esta Checklist, publicá-la no sítio Web, e disponibilizar um link para a mesma na Declaração de Acessibilidade e Usabilidade. Deve igualmente disponibilizar um relatório que evidencie a prova para cada um dos aspetos assinalados com “Sim” na Checklist.

10 aspetos funcionais - Checklist para sítios Web
1. Menus de navegação sim não n.a.
1.1 O menu de navegação está estruturado como uma lista de opções (com elementos nativos, do tipo <ul>, ou com a semântica e o estado dos elementos identificados com técnicas em ARIA)?
1.2 É possível selecionar as opções e as subopções do menu quer com rato quer com teclado?
As imagens-link, caso existam no menu, têm um equivalente alternativo em texto correto?
2. Títulos e subtítulos sim não n.a.
2.1 Existe um título <h1> marcado na página?
2.2 Existe uma marcação hierarquizada de títulos e subtítulos na página (<h1>...<h6>)?
3. Tabelas de dados sim não n.a.
3.1 As células que constituem os cabeçalhos da tabela estão marcadas com o elemento <th>?
3.2 A legenda da tabela está marcada com o elemento <caption>?
4. Formulários sim não n.a.
4.1 Ao clicar com o rato na etiqueta, o cursor surge no respetivo campo de edição?
4.2 É possível identificar os campos de preenchimento obrigatório quando usa apenas um leitor de ecrã?
É possível localizar e ler as mensagens de erro usando apenas um leitor de ecrã?
5. Gráficos e imagens-link sim não n.a.
A imagem ou gráfico tem uma legenda curta (i.e. atributo alt)?
5.1 O gráfico é acompanhado de uma descrição longa (p.e. tabela de dados que deu origem ao gráfico)?
5.2 As imagens-link têm equivalentes alternativos em texto corretos?
6. contrastes sim não n.a.
6.1 Para texto de tamanho normal (menor que 18pt ou menor que 14pt negrito), o rácio de contraste entre a cor do texto e a cor do fundo é superior a 4,5:1?
6.2 Para texto de tamanho grande (maior ou igual que 18pt ou maior ou igual que 14pt negrito), o rácio de contraste entre a cor do texto e a cor do fundo é superior a 3:1?
7. Players (leitores) de vídeo ou de áudio sim não n.a.
7.1 É possível ativar os botões de controlo do leitor quer com o rato quer com o teclado?
7.2 O vídeo ou o áudio têm legendas fechadas sincronizadas e/ou, no mínimo, está disponível uma transcrição textual?
8. Estrutura da página sim não n.a.
8.1 Quando se retira a CSS, todos os elementos (x)HTML alinham à esquerda?
8.2 Quando se retira a CSS, a informação aparece numa ordem lógica?
8.3 Quando se retira a CSS, é possível reconhecer a semântica dos diversos elementos (títulos, subtítulos, parágrafos, listas, ...)?
8.4 Quando se retira a CSS, a informação relevante permanece visível?
8.5 A maquetização da página é feita sem recorrer ao elemento <table> (tabelas layout)?
9. Sintaxe de (x)HTML sim não n.a.
9.1 A página apresenta-se sem erros de (x)HTML?
10. Ficheiros PDF sim não n.a.
10.1 Usando a aplicação Adobe Reader, é possível, no mínimo, efetuar uma cópia do texto do documento PDF e passar o respetivo conteúdo para um processador de texto sem perda de informação?

Checklist “Conteúdo”

Conteúdo - Checklist para sítios Web
1. Clareza do conteúdo sim não n.a.
1.1 O sítio _Web_ apresenta um resumo breve do seu propósito, visível sem se fazer scroll
1.2 Os termos mais complexos têm uma definição agregada
1.3 Cada bloco de conteúdo contém a sua data de atualização
1.4 A informação sobre a entidade responsável pelo conteúdo está em todas as páginas
2. Usabilidade do conteúdo sim não n.a.
2.1 O tipo de letra do corpo do documento é adequado e o tamanho da letra é, no mínimo, de 12 pontos
2.2 A informação secundária (datas, autores) utiliza, no mínimo, um tamanho de letra de 10 pontos
2.3 Blocos e linhas de texto com largura não superior a 100 caracteres
2.4 O espaçamento entre linhas não é inferior a 1.5x do tamanho da letra
3. Estrutura da navegação sim não n.a.
3.1 Nenhum nível de navegação tem mais de 9 opções
3.2 A navegação principal está sempre visível e sempre no mesmo local
3.3 As hiperligações de texto não devem ser diferenciados apenas com base na cor
4. Estrutura da informação sim não n.a.
4.1 Os documentos longos têm um índice no topo com hiperligações internas para o mesmo
4.2 O layout do sítio Web é adaptável a plataformas móveis sem necessidade de efetuar varrimento horizontal
5. Elementos interativos sim não n.a.
5.1 Não existem elementos interativos acionados apenas com a passagem do rato (hover)
5.2 Os elementos interativos têm uma dimensão mínima de 44px CSS (44pt) (vertical e horizontal)
5.3 Há apenas um botão de ação principal por página e o mesmo encontra-se destacado
5.4 Elementos gráficos interativos têm de aparentar ser clicáveis

Checklist “Transação”

Transação - Checklist para sítios Web
1. Formulários sim não n.a.
1.1 A sequência de tabulação entre campos segue a sequência de preenchimento
1.2 Os formulários com mais de 2 ecrãs de altura devem ser distribuídos por várias páginas
1.3 Os formulários com mais de uma página têm a sequência de passos ilustrada
2. Campos sim não n.a.
2.1 O tamanho dos campos deve refletir o tamanho previsível dos dados
2.2 É usada revelação progressiva em vez de campos inativos
2.3 As legendas dos campos são breves e claras
2.4 Campos obrigatórios devem ser claramente indicados como tal
3. Resposta sim não n.a.
3.1 Em ações longas, o sistema deve indicar o que está a acontecer
3.2 Deve ser confirmado o sucesso da transação/envio de informação
4. erros sim não n.a.
4.1 A informação já introduzida deve poder ser corrigida a qualquer momento
4.2 As ações destrutivas nunca devem ser permanentes; deve ser sempre possível desfazer a operação
4.3 As mensagens de erro são claramente identificadas junto aos campos de origem
4.4 As mensagens de erro devem mostrar os passos concretos para a resolução dos mesmos