Tornar seu aplicativo HTML/JavaScript acessível
Um dos destaques de um aplicativo Windows 8 é que a acessibilidade é inserida na plataforma. Você pode usar recursos de acessibilidade para aumentar o alcance de seu aplicativo com muito pouco esforço. Recebemos de desenvolvedores e usuários comentários positivos sobre essa abordagem e refinamos a plataforma. Agora o ajudamos a pensar na acessibilidade em seus aplicativos HTML e JavaScript durante a fase de design, mostraremos como implementar e testar a acessibilidade de alguns padrões comuns de interface do usuário, forneceremos algumas práticas recomendadas que usamos ao criar controles personalizados de interface do usuários, e discutiremos a oportunidade que você tem de alcançar o espectro completo de usuários do Windows lidando com a acessibilidade.
As informações e exemplos deste blog são específicos para HTML/JavaScript, mas inserimos a acessibilidade em aplicativos XAML também. Você pode usar os modelos e os controles que as ferramentas de desenvolvimento fornecem, e consultar as diretrizes e práticas a serem evitadas disponíveis no Centro de Desenvolvimento para ajudá-lo a criar seus aplicativos XAML acessíveis.
Problemas de acessibilidade
Ao criar o Windows 8, quisemos capacitar todos os usuários para se beneficiarem do rico ecossistema de aplicativos e enriquecer suas vidas diárias com incríveis aplicativos acessíveis. Por isso inserimos a acessibilidade nos modelos do Visual Studio, IntelliSense, controles comuns, e fornecemos ferramentas de teste e uma forma de declarar o aplicativo como acessível. Habilitar a acessibilidade em seu aplicativo é importante, já que atinge cerca de 15% da população mundial. Queremos ser capazes de alcançar essa base de usuários e adotar algumas das práticas recomendadas que usamos internamente em nossos próprios aplicativos. Essas práticas são um ótimo ponto de partida para tornar seu aplicativo acessível. Nesta postagem, você aprenderá como:
- Identificar os cenários de acessibilidade e como dar suporte a eles facilmente em seu aplicativo.
- Usar os controles de plataforma, já que há muita acessibilidade interna que você obtém gratuitamente.
- Determinar se o seu aplicativo atende aos requisitos de acessibilidade.
- Planejar o teste de acessibilidade, usar as ferramentas de SDK (Inspect e UI Accessibility Checker), focalizar a habilitação de cenários para usuários que requerem o uso de leitor de tela, que usam apenas o teclado, e/ou precisam alterar os contrastes ou escalonamento.
- Aprenda como a declaração de acessibilidade da Loja funciona e como ela pode ajudá-lo a atingir mais usuários.
Seguindo as melhores práticas, você não só compreenderá como um usuários com deficiências experimenta seu aplicativo, mas também desenvolverá um aplicativo que atenda às necessidades de uma gama mais ampla de usuários.
Fundamentos dos aplicativos acessíveis
Os aplicativos consistem em elementos essenciais como blocos, barras de aplicativos, ListViews e navegação. Vamos observar estes elementos e ver como é fácil torná-los acessíveis.
Blocos
Blocos representam seu aplicativo na tela inicial e são a primeira coisa que o usuário experimenta em seu aplicativo. Blocosficam acessíveis por padrão na experiência de leitura de tela! E para habilitar a experiência de Alto Contraste, você precisa apenas adicionar versões de Alto Contraste de seus blocos ao seu projeto do Visual Studio.
 |
 |
 |
/ProjectFolder /images/ logo.png /contrast-black logo.png /contrast-white logo.png |
/ProjectFolder /images logo.png /contrast-black logo.png /contrast-white logo.png |
/ProjectFolder /images logo.png /contrast-black logo.png /contrast-white logo.png |
Figura 1. Os blocos Música, Vídeo e Jogos do Xbox LIVE aceitam os temas Preto e Branco em Alto Contraste. A fonte negrito identifica a versão do bloco acima dela.
Além disso, você pode habilitar mais usuários com deficiências visuais, configurando as cores de primeiro e de segundo plano do texto para atender a um índice de contraste de 4.5:1. Você pode verificar o índice de contraste, comparando códigos de cor de primeiro e de segundo plano, usando uma das ferramentas W3C recomendadas (dark= #2A2A2A, light=#FFFFFF).
Figura 2. Configurações de manifesto do Visual Studio para o texto do logotipo do bloco.
Apenas o texto do Bloco resultante à esquerda possui contraste de texto suficiente.
Garantir uma ótima experiência de Alto Contraste e contraste suficiente do texto do logotipo para seus blocos tornará seu aplicativo mais atraente para usuários com deficiências visuais.
Barras de aplicativos
Barras de aplicativos fornecem acesso rápido e fácil a comandos relacionados a aplicativos, portanto, elas precisam ser acessíveis.
Assim como os blocos, os comandos da barra de aplicativos ficam acessíveis por padrão, se você usar os controles HTML padrão. Por exemplo, se você estiver usando os controles Botão de plataforma, como na marcação existente aqui, seus comandos ficarão totalmente acessíveis por padrãosem qualquer trabalho adicional!
Exemplo 1: Marcação da barra de aplicativos inferior padrão. Não há atributos especiais de acessibilidade, tudo está inserido.
<div id="appbar" data-win-control="WinJS.UI.AppBar"> <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdAdd',label:'Add',icon:'add', section:'global'}"> </button> <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdRemove',label:'Remove',icon:'remove', section:'global'}"> </button> <hr data-win-control="WinJS.UI.AppBarCommand" data-win-options="{type:'separator',section:'global'}" /> <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'cmdDelete',label:'Delete',icon:'delete',section:'global'}" > </button> </div>
Figura 3. A barra de aplicativos fica acessível por padrão e aceita leitura de tela, uso apenas do teclado, alto contraste e contraste de texto.
Usar a barra de aplicativos para expor comandos usados com frequência torna-os facilmente acessíveis para usuários com deficiências visuais. Por exemplo, no aplicativo Música que desenvolvemos, os controles de reprodução da barra de aplicativos ficam acessíveis e podem ser lidos por leitores de tela como o Narrator.
Figura 4: Controles de reprodução do aplicativo Música da barra de aplicativos permitindo acesso rápido e fácil.
Semelhante aos blocos, garante os elementos da sua barra de aplicativos aceitem alto contraste e que as cores que você escolhe atendam aos requisitos de contraste de texto.
Controles ListView
Um ListView (como mostrado na Figura 5) é um dos controles WinJS mais comuns. Ele oferece uma experiência rica para visualizar e gerenciar coleções de dados. Assim como os outros controles de plataforma que discutimos, o ListView fica totalmente acessível por padrão!
Figura 5: List Views são usados frequentemente em aplicativos.
A próxima marcação do modelo Grid App do Visual Studio 2012 demonstra como configurar os atributos de acessibilidade do controle ListView. Ela mostra como:
- Definir o nome acessível com aria-label para o controle ListView.
- Definir a vinculação de dados do modelo de item de lista: mapear o atributo IMG Alt para a coluna do título da fonte de dados.
Observe que os nomes acessíveis dos itens de lista são definidos por padrão, com base no conteúdo do texto do item.
Exemplo 2: O modelo Grid app do Visual Studio 2012 é acessível. Atributos realçados são definidos para acessibilidade.
<!-- These templates display each item in the ListView declared here. --> <div class="itemtemplate" data-win-control="WinJS.Binding.Template"> <img class="item-image" src="#" data-win-bind="src: backgroundImage; alt: title" /> <div class="item-info"> <h4 class="item-title" data-win-bind="textContent: title"></h4> <h6 class="item-subtitle " data-win-bind="textContent: subtitle"></h6> <h4 class="item-description" data-win-bind="textContent: description"></h4> </div> </div> <!-- The content that will be loaded and displayed. --> <div class="fragment groupeditemspage"> … <section aria-label="Main content" role="main"> <div class="groupeditemslist" aria-label="List of groups" data-win-control="WinJS.UI.ListView" data-win-options="{ selectionMode: 'none' }"> </div> </section> </div>
Figura 6: Modelo de projeto acessível Grid app do Visual Studio 2012 mostrando as propriedades de acessibilidade da ferramenta de SDK Inspect.
Depois de definir os atributos de acessibilidade, garanta que o conteúdo de seus itens de lista aceitem alto contraste e que as cores que você escolher atendam aos requisitos de contraste de texto.
Navegação de teclado eficiente
A navegação de teclado é essencial por vários motivos. Os entusiastas ainda contam com o teclado para impulsionar o uso do Windows e existe um segmento dos usuários do Windows que contam somente com o teclado para navegar e usar o sistema. Usuários com deficiências visuais, de mobilidade ou destreza dependem do suporte do teclado para usar seus computadores. Ao criar seu aplicativo, leve em consideração um suporte bom e eficiente à navegação de teclado para esses usuários.
As ótimas notícias: também tornamos mais fácil o suporte à navegação de teclado. Todos os controles de plataforma já possuem navegação de teclado inserida. Todos os elementos interativos ficam em ordem de tabulação por padrão e elementos de contêiner, como o ListView, implementam a navegação de tecla de seta interna para que você possa usar as teclas de seta para percorrer a lista. Usar os controles de plataforma proporciona muitos recursos de acessibilidade gratuitos, incluindo a navegação de teclado eficiente.
Figura 7: Pequeno número de paradas de tabulação e seta do ListView a navegação de teclas torna eficiente a navegação de teclado do aplicativo Email.
Uma pergunta interessante que surgiu quando estávamos criando nossos aplicativos que talvez você se pergunte é “Preciso adicionar elementos de texto à ordem de tabulação para que os leitores de tela os leiam?”
A resposta é não. Texto estático não deve estar na ordem de tabulação porque ele já é exposto pela plataforma na árvore de automação de interface do usuário (UIA) e é assim que ele fica acessível para os leitores de tela. O Narrator e outros leitores de tela possuem comandos de leitura (por exemplo, Caps + M, que lê o texto a partir da posição do cursor do Narrator) e os comandos da árvore de navegação UIA (Caps + seta para esquerda/direita) para ler todos os elementos da árvore UIA sequencialmente. Portanto, você não precisa adicionar um elemento de tabulação extra para eles.
Tornar sua interface do usuário acessível
Nas seções anteriores, observamos os benefícios da acessibilidade interna quando você usa os controles padrão. Mas para aplicativos complexos, talvez você precise criar uma interface do usuário personalizada. Aqui estão algumas dicas baseadas em nossas experiências que podem ajudá-lo a tornar sua interface do usuário acessível.
Descrevendo a interface do usuário personalizada para acessibilidade
Ao criar a interface do usuário personalizada acessível com HTML/JavaScript, leia também os padrões ARIA (Accessbile Rich Internet Application) W3C para compreender as funções e propriedades ARIA disponíveis. Isso, além do guia sobre como tornar seus aplicativos acessíveis no Centro de Desenvolvimento pode ajudá-lo a fazer as escolhas certas ao modelar sua interface do usuário e configurar as propriedades de acessibilidade. Vamos abordar alguns padrões comuns de interface do usuário personalizada e o que fizemos em nossos aplicativos para torná-los acessíveis. Seguindo nossas dicas e as informações dos guias, você pode facilmente adotar a acessibilidade em suas implementações de interface do usuário personalizada.
Controlando o conteúdo com listas de tabulações
O aplicativo Travel, que fica disponível no release preview, usa interface do usuário personalizada para o formulário de pesquisa de voos. Embora essa interface do usuário seja relativamente complexa, torná-la acessível foi simples. Fizemos isso configurando os atributos: role, aria-controls e aria-selected.
Comece escolhendo o padrão correto
Em vez de usar botões para os elementos Pesquisa, Agenda e Status, decidimos descrever todo o formulário de pesquisa de voo no aplicativo Travel como uma lista de tabulações ARIA para navegação e isso nos permitiu fornecer mais informações. A lista de tabulações continha os elementos Pesquisa, Agenda e Status como tabulações ARIA, com o atributo aria selecionado para refletir a tabulação selecionada no momento, e o atributo ARIA-controls para apontar para o conteúdo relacionado. Essa abordagem nos permitiu fornecer mais informações aos usuários sobre a interface do usuário e uma experiência de usuário mais rica.
Exemplo 3: Aplicativo Bing Travel, Pesquisa de Voo, usando lista de tabulações e elementos de tabela.
<div class="…" role="tablist"> <div … id="flightSearchTripTab" role="tab" aria-controls="flightSearchTripView"> … </div> <div … id="flightSearchFlightSchedulesTab" role="tab" aria-controls="flightSearchFlightSchedulesView"> … </div> <div … id="flightSearchFlightStatusTab" role="tab" aria-controls=" flightSearchFlightStatusView"> … </div> </div> … <!-- Trip view--> <div … role="tabpanel" role="tabpanel" id="flightSearchTripView"> … </div> <!-- Flight status view--> <div … role="tabpanel" id="flightSearchFlightSchedulesView"> … </div> <!-- Flight status view--> <div … role="tabpanel" role="tabpanel" id="flightSearchFlightStatusView"> … </div> _showTabView: function (tab) { … if (tabElement) { WinJS.Utilities.removeClass(tabElement, "flightSearchUnselectedTab"); WinJS.Utilities.addClass(tabElement, "flightSearchSelectedTab"); tabElement.setAttribute("aria-selected", "true"); … } … }
Figura 8: A ferramenta de SDK, Inspect, mostrando os dados de acessibilidade da lista de tabulações e os elementos de tabulação do aplicativo Bing Travel.
Se você usa controles ARIA em seu aplicativo para expor informações sobre a relação entre os elementos de tabulação e o conteúdo que eles estão controlando, os usuários poderão usar o comando Jump do Narrator para mover o foco para uma tabulação com conteúdo vinculado (usando Caps + teclas Insert).
Selecionando guias programaticamente
Para habilitar o formulário de pesquisa do aplicativo Travel para funcionar sem problemas com o Narrator apenas em dispositivos sensíveis ao toque, precisamos permitir aos usuários selecionar elementos de tabulação programaticamente (Caps + Espaço ou toque duplo com o Narrator).
Fizemos isso, descrevendo a Pesquisa, Agenda e Status como tabulações ARIA, o que resultou na plataforma expondo-as como o padrão de controle SelectionItem UIA. Por sua vez, o gesto de toque duplo do Narrator altera a propriedade ARIA-selected desses elementos de tabulação. Portanto, para garantir que o conteúdo correto seja carregado para a tabulação selecionada, também precisamos adicionar um manipulador de eventos propertychange do atributo ARIA-selected da tabulação. Este é o exemplo:
Exemplo 4: Manipule onpropertychange da propriedade ARIA-selected para detectar alteração programática da seleção de tabulações.
tabElement.attachEvent("onpropertychange", selectionChanged); function selectionChanged(event) { if (event.propertyName === "aria-selected") if (event.srcElement.getAttribute("aria-selected") === "true") { // execute code to load the content that corresponds with the selected tab element } else { // execute code for deselected tab, if needed } }
Quando falamos sobre controlar programaticamente a interface do usuário, existe um outro tópico que você precisa considerar para garantir que a experiência de toque do Narrator tenha suporte. Tratam-se dos eventos de toque acessíveis.
Eventos de toque acessíveis
Considerando que a experiência do Windows 8 tenha sido projetada como um primeiro ambiente de toque, recomendamos que você use eventos de toque para um fluxo suave da interface do usuário e o desempenho do toque.
Caso use apenas os eventos de toque MSPointerUp e MSPointerDown, você precisa manipular eventos Click para aceitar experiências de acessibilidade com leitores de tela. Isso permite que o Narrator, como um exemplo, interaja programaticamente com sua interface do usuário usando Caps + Espaço ou toque duplo. Uma forma de fazer isso é encapsular o código do manipulador de eventos MSPointerUp em uma função separada e chamar o manipulador de eventos Click do formulário dessa mesma função (delayedPointerUp). Aqui está um exemplo de como fazer isso em um dos aplicativos Bing (código simplificado):
Exemplo 5: Solução para tornar eventos de toque acessíveis programaticamente e habilitar a experiência de toque do Narrator.
Bing apps, platform\js\utilities.js: element.addEventListener("click", onClick); element.addEventListener("MSPointerUp", onMsPointerUp); … var pointerUpEventObject = null; var pressedElement = null; var isClick = false; function onClick(evt) { isClick = true; delayedPointerUp(); } function onMsPointerUp(evt) { pointerUpEventObject = evt; msSetImmediate(delayedPointerUp); } … function delayedPointerUp() { if (isClick || pointerUpEventObject && (pointerUpEventObject.srcElement == pressedElement || … right button checks…)) { pointerUpEventObject = null; isClick = false; invokeItem(pressedElement); } } …
Para evitar que o delayedPointerUp seja executado duas vezes para um clique do mouse, o que disparará Click e onMsPointerUp, você pode:
- Usar msSetImmediate para adiar a chamada MSPointerUp de delayedPointerUp
- Usar a variável pointerUpEventObject para manter a referência ao objeto do evento MSPointerUp
- Usar a variável isClick para controlar se o manipulador Click foi executado
- Evite a segunda execução de delayedPointerUp, redefinindo as variáveis isClick e pointerUpEventObject após a primeira execução de delayedPointerUp.
Adicionando algumas linhas de código, você habilitará a experiência de toque do Narrator de forma que o gesto de toque duplo ative programaticamente a funcionalidade associada a elementos interativos em sua interface do usuário.
Preenchimento automático
Outro exemplo de um recurso personalizado que fizemos no aplicativo Email que funciona bem com leitores de tela como o Narrator é o preenchimento automático encontrado no controle de endereço.
A ideia por trás da solução de preenchimento automático do controle de endereço do aplicativo Email (addressbarToField) é exibir uma lista (toDDDDList) para as sugestões de endereço e outra lista (toL) para armazenar os contatos escolhidos. Para tornar isso acessível, definimos o atributo role do campo de entrada (toIF) como uma caixa de combinação para refletir que ele tinha uma lista suspensa relacionada. Também definimos o atributo ARIA-controls do campo de entrada (toIF) para apontar para a lista de sugestões, que aparece conforme o usuário começa a digitar. Isso permite que o Narrator anuncie os eventos de seleção da lista de sugestões (toDDDDList), enquanto o foto do teclado permanece no campo de entrada principal (toIF). Aqui está como fizemos isso
Exemplo 6: Solução de acessibilidade do campo de endereço do aplicativo Email para preenchimento automático.
<div id=" addressbarToField" class="…"> <div id=" toOC" class="…"> <div id="toL" role="listbox" ><!--chosen contacts--></div> <input id="toIF" size="1" type="email" role="combobox" aria-autocomplete="list" aria-controls="toDDDDArea" aria-activedescendant="toDDList0" /> </div> <div id="toDDDDArea" role="group" class="…"> <div id=" toDDDDList" role="listbox"> <div id="toDDList0" role="option" aria-selected="true">…</div> <div id="toDDList1" role="option" aria-selected="false">…</div> … </div> </div> </div>
A solução de preenchimento automático permite que o usuário digite no campo de entrada, a lista de sugestões aparece, e o Narrator anuncia o primeiro contato selecionado. Conforme o usuário continua a digitar, a lista de sugestões é reduzida, fazendo com que um novo evento de seleção seja disparado, o que novamente faz o Narrator anunciar o novo elemento de contato principal na lista. Se o usuário usa as teclas de seta do teclado para se mover para cima e para baixo na lista de sugestões, o Narrator continua a anunciar os contatos selecionados. O tempo todo o foco do teclado permanece no campo de entrada.
Figura 9: O Narrator lê as sugestões conforme a lista muda, o Inspect mostra as informações da UIA exposta com ARIA (activedescendant, controls)
Elementos gráficos acessíveis
Os elementos gráficos sempre foram um desafio para a acessibilidade porque não há uma forma direta de torná-los acessíveis. No mínimo, defina um nome e uma função acessíveis (geralmente para ARIA img) para esses elementos, de forma que os usuários que usem um leitor de tela saibam que esses elementos de tela estão na tela. Se esses elementos gráficos forem interativos, o usuário precisa ter uma forma de navegá-los.
Por outro lado, se você puder tornar um elemento gráfico interativo acessível, ele pode ser efetivo e pode atrair comentários positivos dos clientes. Um bom exemplo é o aplicativo Bing Weather e seu gráfico Historical Weather. Ele é acessível para cenários de teclado do Narrator e os temas Alto Contraste. Fizemos isso expondo cada mês no gráfico como elementos de árvore UIA separados com nomes acessíveis. Adicionamos o ARIA-described por ponteiro para as informações históricas do mês exibidas ao lado do gráfico à direita. Conforme o usuário percorre para esquerda ou para direita os meses, o destaque se move e o Narrator anuncia o nome do mês e, em seguida, lê as informações históricas do mês. Aqui está o trecho do código:
Exemplo 7: Aplicativo Bing Weather, configurando dinamicamente o ARIA-described by para o elemento do mês selecionado.
SetArrowKeyHandler: function (parentNode, chartObject) { … for (var index = 0, len = tickLabels.length; index < len; index++) { tickLabels[index].addEventListener("keydown", function (event) { … if (newMonth) { newMonth.focus(); newMonth.tabIndex = "0"; newMonth.,setAttribute("aria-describedby", "hwModuleShifted"); hwChart.HandleMonthClick(newMonthIndex, chartObject); this.blur(); this.tabIndex = "-1"; this.removeAttribute("aria-describedby"); } }); } }
Figura 10: Bing Weather, gráfico Historical Weather – a navegação de teclas de seta permite ao Narrator ler informações do mês.
Referenciando elementos com ARIA
Se você usa atributos de relacionamento ARIA como ARIA-controls ou ARIA-described by para referenciar outros elementos, certifique-se de que os elementos de destino devem ser reconhecidos pela plataforma como objetos UIA. Você pode verificar isso, usando Inspect para localizar esse elemento na área UIA. A não ser que ele esteja explicitamente oculto da árvore com ARIA-hidden=”true” ou configurando seu estilo para ficar visualmente oculto.
No próximo exemplo, a marca “A” DIV referenciada não está participando do nome acessível do campo INPUT, nem está na árvore UIA porque as marcas DIV não consideradas como um objeto UIA por padrão. Em compensação, a marca “B” DIV está participando do nome do campo INPUT e está presente na árvore UIA porque possui um conjunto de atributos role.
Exemplo 8: Os elementos DOM referenciados devem ser objetos UIA regulares representados na árvore da interface do usuário ou explicitamente ocultos dela.
<input type="text" aria-labelledby="idA idB" /><div id="idA">A</div><div id="idB" role="heading">B</div>Cenários de teste para acessibilidade
Os objetivos do teste de acessibilidade dos aplicativos são para garantir que os usuários possam experimentar seu aplicativo independentemente de suas habilidades. Isso significa testar cada elemento da interface do usuário em seu aplicativo para acessibilidade, verificar se os usuários podem realizar cada uma das tarefas do aplicativo do início ao fim com o Narrator (usando teclado e toque), em Alto Contraste (preto e branco), e com Make everything bigger (Tornar tudo maior) (veja a configuração Ease of Access (Facilidade de Acesso) em Settings (Configurações) -> Change PC Settings (Alterar Configurações do PC)).
Testar com o Narrator é muito útil, já que ele lê e interage com sua interface do usuário, contando com a API de automação da interface do usuário, que aceita os padrões ARIA que abordamos anteriormente. Em dispositivos apenas de toque, o Narrator permite que você inspecione a interface do usuário, movendo seu dedo sobre os elementos da interface do usuário e usando gestos para mover o foco do teclado, navegar a árvore da UIA, chamar ou selecionar, e muito mais.
Alcançando mais usuários com a declaração de acessibilidade da Loja
Depois que você criar e testar seu aplicativo acessível usando alguns exemplos que fornecemos neste blog, e seguir as diretrizes de acessibilidade, você pode declarar seu aplicativo como acessível! Isso significa que ele pode ser usado por um conjunto maior de usuários em comparação a outros aplicativos que não consideraram a acessibilidade.
Para obter crédito por seu trabalho e expandir sua base de usuários, declare seu aplicativo como acessível, marcando a caixa de verificação da acessibilidade durante o processo de publicação.
Figura 11: A página de entrada da Windows Store exibindo a opção para marcar a caixa, se o aplicativo for acessível.
Se você declarar seu aplicativo acessível, os usuários poderão filtrar por isso, selecionando-o em suas preferências. Dessa forma, eles podem rapidamente encontrar os aplicativos que podem usar com leitores de tela, tornar tudo maior ou usar as configurações de alto contraste.
Conclusão
O tempo que você leva para tornar seus aplicativos acessíveis é um investimento valioso que aumentará o alcance de seu aplicativo para uma base maior de usuários e aprimorará a qualidade de seu aplicativo. Muito desse trabalho já foi feito para você quando usa os controles padrão que ficam acessíveis por padrão. Mas se você precisar adicionar experiências mais complexas ou interface do usuário personalizada, siga as melhores práticas que fornecemos aqui e os materiais de referência para tornar seu aplicativo acessível.
--Jennifer Norberg - Gerente de programas líder
