Declaração de acessibilidade

1. O meu compromisso

Quero que este site seja utilizável por todos, incluindo quem navega com teclado, com um leitor de ecrã, com ampliação ou com uma definição de movimento reduzido ou contraste elevado. A acessibilidade é aqui tratada como parte da construção, e não como uma verificação no final: várias das medidas abaixo são asseguradas por testes automáticos que fazem falhar a compilação em caso de regressão.

2. Estado de conformidade

Este site procura estar em conformidade com as Diretrizes de Acessibilidade para o Conteúdo da Web (WCAG) 2.2 no nível AA. Considero que está substancialmente conforme, ou seja, que cumpre os critérios de sucesso do nível AA tanto quanto sei e de acordo com os meus testes.

Deliberadamente não reivindico conformidade total. Não foi realizada qualquer auditoria de acessibilidade independente e não existe um relatório formal de avaliação WCAG-EM para este site. Trata-se de um limite da evidência que sustenta a afirmação, não de uma falha conhecida — quando encontro uma falha, ela consta da secção 5.

3. O que está implementado

Teclado e foco

• Uma ligação para saltar para o conteúdo é o primeiro elemento focável de cada página que apresenta a navegação do site, e move o foco para o conteúdo principal em vez de apenas deslocar a página até ele.
• Cada elemento interativo apresenta um indicador de foco visível. A regra que o desenha não pode ser desligada por nenhuma classe utilitária, o que um teste assegura.
• O menu para telemóvel é uma armadilha de foco: ao abrir, o foco entra nele, circula lá dentro com Tab, fecha com Escape e regressa ao botão que o abriu.
• Nenhum elemento recebe um tabindex positivo, pelo que a ordem de tabulação segue a página.

Estrutura e leitores de ecrã

• Exatamente uma marca main por página e — sempre que o cabeçalho e o rodapé do site estão presentes — uma marca banner e uma contentinfo, além de marcas de navegação com nome.
• Exatamente um h1 por página, com os títulos aninhados por ordem abaixo dele e sem níveis saltados.
• Cada imagem tem texto alternativo, e os elementos gráficos decorativos são ocultados às tecnologias de apoio em vez de receberem descrições de preenchimento.
• Quando um ícone transporta o significado de um controlo, esse controlo tem um nome textual — a etiqueta visível inicia sempre esse nome, para que a entrada por voz o possa invocar pelo que nele está escrito.
• O idioma da página está declarado e cada página tem um título único e descritivo.

Cor, contraste e tipografia

• As cores de texto e de interface são derivadas na compilação e verificadas face aos seus próprios fundos: o texto corrente é mantido em pelo menos 4,5:1, o texto principal em 7:1, e qualquer preenchimento sólido de botão é escurecido até a sua etiqueta ultrapassar 4,5:1.
• Nenhum texto do site é apresentado abaixo de 12 px. É um mínimo, assegurado por um teste.
• A cor nunca é a única forma de transmitir informação: os estados selecionados apresentam também uma etiqueta, uma forma ou um valor aria-current.
• Estão disponíveis um tema claro e um tema escuro. O site abre em escuro em vez de ler a sua definição de sistema, e memoriza aquele que escolher com o comutador do cabeçalho.

Movimento, zoom e ponteiro

• O movimento reduzido é respeitado. Se o seu sistema o solicitar, as animações de entrada, as revelações ao deslocar e as transições de vista são suprimidas.
• O contraste aumentado e o modo de contraste elevado do Windows são contemplados: o texto com gradiente recorre a uma cor sólida, e os estados indicados apenas por preenchimento recebem um contorno com cor do sistema.
• O zoom não é bloqueado. A página pode ser ampliada até 500 % e, à largura de 320 px que o critério WCAG 1.4.10 «Refluxo» especifica, dispõe-se numa única coluna sem deslocação horizontal. É verificada cada largura entre 320 px e 1920 px, e não apenas os pontos de rutura com nome.
• Os controlos interativos apresentam um alvo de pelo menos 44 × 44 px, o que excede o mínimo de 24 × 24 px da WCAG 2.2. Quando um controlo é desenhado mais pequeno, a sua área clicável é ampliada por trás em vez de ficar pequena. A única exceção é uma ligação dentro de uma frase, que beneficia da isenção em linha da WCAG 2.5.8 — impor aí uma altura fixa quebraria a entrelinha do parágrafo que a rodeia.

Formulários

• Cada campo tem um nome associado por programação. Quando um formulário tem mais do que um campo — o formulário de contacto e o painel de preferências de cookies —, esse nome é uma <label> visível. Os controlos de campo único (subscrição da newsletter, pesquisa nas listagens, caixa de comentários, pedido de início de sessão por e-mail) retiram o nome de um aria-label, cabendo ao título, ao ícone ou ao botão ao lado transmitir o mesmo significado no ecrã.
• Os erros são descritos por texto junto ao campo a que pertencem, e não apenas por cor, e estão associados a ele para que um leitor de ecrã anuncie a mensagem quando o campo recebe o foco.
• Submeter um formulário com um campo inválido move o foco para esse campo, de modo que o problema o encontra a si, e não o contrário.
• Os campos de texto são apresentados a 16 px em dispositivos táteis, para que focá-los não force um zoom do iOS que não consiga anular.

4. Como foi avaliado

Por autoavaliação, combinando verificações automáticas e manuais:

• Testes automáticos na bateria de testes do próprio projeto, que fazem falhar a compilação perante regressões nos indicadores de foco, no tamanho mínimo do texto, no tamanho dos alvos, na estrutura de marcas, no texto alternativo das imagens e na ordem dos títulos.
• Contraste medido a partir dos pixels apresentados, compondo as camadas translúcidas em vez de ler as cores declaradas.
• Um varrimento da janela de visualização de 320 px a 1920 px que verifica, em cada passo intermédio, o transbordo horizontal, a sobreposição de elementos e o texto cortado — e não apenas nos pontos de rutura com nome.
• Percursos manuais com teclado e verificações em vários motores: Chromium, Firefox e WebKit.

5. Limitações conhecidas

• Sem auditoria independente. Tudo o que antecede é autoavaliado. Uma auditoria por alguém que não o autor constituiria uma base mais sólida para a declaração de conformidade da secção 2.
• Testes limitados com tecnologias de apoio. A estrutura e o comportamento são verificados face à árvore de acessibilidade e com teclado, mas o site não foi testado de ponta a ponta com todos os principais leitores de ecrã.
• Conteúdo de terceiros. A marcação de reuniões é assegurada por um serviço externo, no seu próprio domínio. Não controlo a respetiva acessibilidade. Se isso constituir uma barreira para si, utilize antes uma das vias de contacto da secção 6 — uma chamada pode sempre ser combinada por e-mail.
• Multimédia incorporada. Não há hoje qualquer vídeo publicado neste site. O vídeo de apresentação que a página «Sobre mim» anuncia ainda não foi gravado; quando o for, os critérios WCAG 1.2.2 e 1.2.3 exigirão legendas e uma transcrição para o nível de conformidade declarado acima.

6. Comentários e como contactar-me

Se encontrar uma barreira neste site, diga-me — é a forma mais rápida de a corrigir, e os relatos são bem-vindos mesmo que não tenha a certeza de que o problema é do meu lado.

• Escreva para contact@mhsaeed.com — indique «Acessibilidade» no assunto se pretender que seja tratado com prioridade.
• Ou utilize o formulário de contacto.

Respondo no prazo de 24 horas, o mesmo compromisso que a página de contacto assume. Descreva, por favor, a página, o que estava a tentar fazer e o navegador ou a tecnologia de apoio que utilizava, se estiver à vontade para partilhar — torna o problema muito mais rápido de reproduzir.