Acessibilidade | web.dev

Quais ferramentas são usadas com frequência para ajudar pessoas com deficiência a usar a Web?

Escolha quantas respostas você achar adequado.

Dispositivos de saída em braille

Leitores de tela

Bases de encaixe

Configurações do sistema operacional

Qual é uma maneira eficaz de implementar mudanças na Web?

Escolha quantas respostas você achar adequado.

Reclamar nas redes sociais.

Entrar com uma ação judicial.

Entre em contato diretamente com os desenvolvedores de uma empresa.

Qual é o nível mais alto dos padrões das WCAG?

Nível AAA

Nível A

DERIXAR

Quais são exemplos de "operável"?

Escolha quantas respostas você achar adequado.

Todos os vídeos têm controles.

Os usuários têm tempo suficiente para preencher um formulário.

Todos os elementos ativos têm suporte para teclado e tela touchscreen.

Usa linguagem simples.

Qual das opções a seguir é a prática recomendada para criar um botão acessível?

<div id="saveChanges" aria-role="button" aria-pressed="false" tabindex="0">Go to shop</div>

<a id="saveChanges" aria-label="Some awesome article title">Go to shop</a>

<button id="saveChanges" type="button">Go to shop</button>

Seu site é um livro didático on-line multilíngue, em que vários idiomas são mostrados em uma página. Qual é a melhor maneira de informar à tecnologia adaptativa o idioma da cópia?

Defina um lang principal para o <html> e outros idiomas em elementos que contenham conteúdo em um idioma diferente.

Não se preocupe, a TA pode ler automaticamente cada idioma.

Inclua todos os idiomas no elemento <html>. Por exemplo, <html lang="en,lt,pl,pt">

Qual exemplo de estilo CSS `:focus` é o mais acessível em um plano de fundo branco?

outline: 0.5rem solid yellow;

background-color:black;

outline: none; text-decoration:none; background:none;

text-decoration: dotted underline 2px blue;

Qual é a finalidade de um link de navegação?

Ajude um usuário de teclado a pular grupos de links redundantes ou inúteis.

Ajudar um usuário de teclado a pular conteúdo sem interesse.

Qual é a melhor maneira de mudar o estilo de um elemento com JavaScript?

Use JavaScript para alternar a classe de um elemento e adicione o estilo à sua folha de estilo CSS.

Use JavaScript para aplicar um estilo dinâmico diretamente em um elemento HTML.

Todas as ações do JavaScript são compatíveis com usuários de teclado?

Sim, todas as ações são compatíveis automaticamente com usuários de teclado.

Sim, mas talvez seja necessário fazer um trabalho extra.

Não, só é possível oferecer suporte a usuários de teclado com HTML semântico.

Como tornar imagens complexas acessíveis?

Escolha quantas respostas você achar adequado.

Inclua uma explicação mais adiante no artigo.

Adicione texto alternativo longo com uma descrição completa.

Adicione o atributo aria-describedby à imagem.

Use um link para explicações mais longas.

A cor sozinha não é um identificador suficiente para a documentação. O que mais pode ajudar os leitores a identificar elementos da interface?

Padrão

Texto

Ícone

Todas as respostas estão corretas

O que podemos criar que reflita as configurações do sistema operacional para movimento?

@prefers-reduced-motion

Alternâncias de JavaScript

Para uma cópia legível, sempre use alto contraste entre a cópia e o plano de fundo.

Falso

Verdadeiro

Quais fontes são as melhores para acessibilidade?

Tipos de letra acessíveis.

Fontes do sistema, como Arial e Verdana.

Não faz diferença.

Qual das seguintes opções é a entrada de formulário mais acessível?

<label>Email address (required): <input type="email" required aria-describedby="email-validation"> <span id="email-validation" class="validation-message">Please provide a valid email address using the format name@place.com</span></label>

Email address: <input type="email" required>

<label>Email address: <input type="email" required></label>

<label>Email address: <input type="email" required autocomplete="email"></label>

Os componentes acessíveis sempre permanecem acessíveis para os usuários?

Não, primeiro é preciso testar os componentes.

Sim, você pode usar esses componentes sem trabalho adicional.

Que tipo de teste você precisa fazer para garantir que seu site seja acessível?

Escolha quantas respostas você achar adequado.

Testes automatizados

Teste manual

Testes de usuários

Teste de tecnologia adaptativa

Teste de avaliação.

Quais erros são detectados nos testes automatizados?

Escolha quantas respostas você achar adequado.

Linguagem inclusiva

Texto alternativo ausente

Problemas de contraste de cor

Rótulos descritivos de formulários

Erros de ARIA

Quais elementos precisam atender aos padrões de contraste de cores das WCAG?

Ícones

Títulos

Texto do corpo

Todas as anteriores

Qual é o melhor leitor de tela para testar a acessibilidade?

Não há um

JAWS

VoiceOver

Orca

Qual é o objetivo de testar com tecnologia adaptativa?

Para testar falhas no seu site ou app.

Para ter a mesma experiência que pessoas que usam tecnologia adaptativa.

Quais ferramentas são usadas com frequência para ajudar pessoas com deficiência a usar a Web?

Qual é uma maneira eficaz de implementar mudanças na Web?

Qual é o nível mais alto dos padrões das WCAG?

Quais são exemplos de "operável"?

Qual das opções a seguir é a prática recomendada para criar um botão acessível?

Seu site é um livro didático on-line multilíngue, em que vários idiomas são mostrados em uma página. Qual é a melhor maneira de informar à tecnologia adaptativa o idioma da cópia?

Qual exemplo de estilo CSS :focus é o mais acessível em um plano de fundo branco?

Qual é a finalidade de um link de navegação?

Qual é a melhor maneira de mudar o estilo de um elemento com JavaScript?

Todas as ações do JavaScript são compatíveis com usuários de teclado?

Como tornar imagens complexas acessíveis?

A cor sozinha não é um identificador suficiente para a documentação. O que mais pode ajudar os leitores a identificar elementos da interface?

O que podemos criar que reflita as configurações do sistema operacional para movimento?

Para uma cópia legível, sempre use alto contraste entre a cópia e o plano de fundo.

Quais fontes são as melhores para acessibilidade?

Qual das seguintes opções é a entrada de formulário mais acessível?

Os componentes acessíveis sempre permanecem acessíveis para os usuários?

Que tipo de teste você precisa fazer para garantir que seu site seja acessível?

Quais erros são detectados nos testes automatizados?

Quais elementos precisam atender aos padrões de contraste de cores das WCAG?

Qual é o melhor leitor de tela para testar a acessibilidade?

Qual é o objetivo de testar com tecnologia adaptativa?

Qual exemplo de estilo CSS `:focus` é o mais acessível em um plano de fundo branco?