{"id":2578,"date":"2019-04-04T17:36:25","date_gmt":"2019-04-04T20:36:25","guid":{"rendered":"http:\/\/blog.handtalk.me\/?p=2578"},"modified":"2023-04-12T17:11:45","modified_gmt":"2023-04-12T20:11:45","slug":"wcag-2-0","status":"publish","type":"post","link":"https:\/\/www.handtalk.me\/br\/blog\/wcag-2-0\/","title":{"rendered":"Entenda o WCAG 2.0 de forma simples e r\u00e1pida"},"content":{"rendered":"

O WCAG, ou Diretrizes Para o Conte\u00fado de Acessibilidade Web<\/a><\/span>, \u00e9 um documento que estipula os padr\u00f5es de acessibilidade digital que devem ser seguidos pelos sites. A primeira vers\u00e3o (1.0) foi lan\u00e7ada em 1999. Depois disso, as diretrizes foram reformuladas em 2008, e no ano passado, passaram por uma nova atualiza\u00e7\u00e3o, que ainda n\u00e3o est\u00e1 dispon\u00edvel em portugu\u00eas.<\/p>\n

Essas recomenda\u00e7\u00f5es foram todas desenvolvidas pelo W3C, o cons\u00f3rcio World Wide Web.<\/a><\/span><\/p>\n

Nesse texto, vamos tomar como princ\u00edpio o documento mais recente em portugu\u00eas, ou seja, o WCAG 2.0, produzido no ano de 2008.<\/p>\n

As diretrizes s\u00e3o muito \u00fateis, pois com elas, \u00e9 poss\u00edvel ter um direcionamento e saber quais os caminhos para construir um site acess\u00edvel<\/strong>. No entanto, em um primeiro momento, a linguagem do documento, que \u00e9 voltada especialmente para programadores, pode parecer complexa e dif\u00edcil de entender. Mas n\u00e3o se preocupe! Nesse texto, voc\u00ea vai entender como as diretrizes de acessibilidade foram pensadas de forma l\u00f3gica, e a partir disso, compreend\u00ea-las melhor rapidamente.<\/p>\n

\u00c9 importante ter em mente que quando trata-se de acessibilidade digital, o p\u00fablico a ser atingido \u00e9 muito diverso<\/strong>. Por isso, requer diversas medidas diferentes. Para pensar a acessibilidade de pessoas cegas, por exemplo, s\u00e3o imprescind\u00edveis as descri\u00e7\u00f5es alternativas. No caso dos dalt\u00f4nicos, o contraste \u00e9 quest\u00e3o essencial<\/span><\/a>. Grande parta das pessoas com defici\u00eancia auditiva, necessitam de tradu\u00e7\u00e3o em L\u00ednguas de Sinais. E esses s\u00e3o apenas alguns poucos exemplos que podem ser citados. Sendo assim o WCAG 2.0 \u00e9 um documento extenso e que cont\u00e9m diversas especifica\u00e7\u00f5es, para abranger todos os p\u00fablicos da forma mais completa poss\u00edvel.<\/p>\n

Entendendo melhor o WCAG 2.0<\/h3>\n

O infogr\u00e1fico a seguir explica de forma bem did\u00e1tica como est\u00e1 o organizado o documento. Ele \u00e9 divido em quatro princ\u00edpios, que possuem recomenda\u00e7\u00f5es. Essas \u00faltimas, por sua vez, s\u00e3o avaliadas por meio crit\u00e9rios de sucesso, alcan\u00e7ados atrav\u00e9s de t\u00e9cnicas espec\u00edficas.<\/p>\n

\"imagem<\/p>\n

Os princ\u00edpios<\/h3>\n

Percept\u00edvel<\/strong>: de acordo com esse princ\u00edpio, \u00e9 necess\u00e1rio que os conte\u00fados sejam apresentados de mais de uma forma. Para isso, uma descri\u00e7\u00e3o alternativa das imagens, legendas em v\u00eddeos ou outros tipos de multim\u00eddia, e um c\u00f3digo de HTML que consiga compreender leitores de tela s\u00e3o requisitos.<\/p>\n

Com essas medidas, o conte\u00fado do site n\u00e3o estar\u00e1 sendo transmitido de uma \u00fanica maneira, o que o torna percept\u00edvel para um p\u00fablico que antes estaria impossibilitado de acess\u00e1-lo.<\/p>\n

Oper\u00e1vel<\/strong>: \u00a0como o pr\u00f3prio nome diz, um site adequadamente oper\u00e1vel \u00e9 aquele em que todos os usu\u00e1rios consigam realizar as diversas opera\u00e7\u00f5es sem barreiras de acesso. Por isso, \u00e9 necess\u00e1rio que a codifica\u00e7\u00e3o de HTML esteja ajustada, a fim de permitir a navega\u00e7\u00e3o pelo teclado. Al\u00e9m disso, a velocidade da p\u00e1gina deve ser equilibrada: nem muito r\u00e1pida, nem muito devagar e estruturar os cabe\u00e7alhos de forma organizada tamb\u00e9m \u00e9 necess\u00e1rio. Por fim, devem ser evitados o uso de dispositivos que sejam um gatilho para ataques epil\u00e9ticos: o excesso de cores e ilumina\u00e7\u00e3o, ou a utiliza\u00e7\u00e3o exagerada de pop-ups costumam ser prejudiciais nesse sentido.<\/p>\n

Compreens\u00edvel<\/strong>: o terceiro princ\u00edpio diz respeito sobretudo ao conte\u00fado textual dos sites. Al\u00e9m de uma escolha adequada de fontes, \u00e9 necess\u00e1rio evitar express\u00f5es espec\u00edficas, escrever senten\u00e7as de forma clara e objetiva. Medidas como essa tornam o site acess\u00edvel sobretudo para pessoas com dislexia ou defici\u00eancias intelectuais<\/a>,<\/span> mas tamb\u00e9m podem ser muito \u00fateis para aqueles que n\u00e3o fazem parte de determinado contexto, ou t\u00eam dificuldades de leitura por algum motivo.<\/p>\n

Robusto<\/strong>: o \u00faltimo conceito diz respeito \u00e0 codifica\u00e7\u00e3o do website. O WCAG estipula que o HTML deve estar alinhado a ponto de estar apto para rodar as tecnologias assistivas existentes e tamb\u00e9m para tornar o site naveg\u00e1vel pelo teclado, o que neste \u00faltimo caso \u00e9 imprescind\u00edvel para pessoas com defici\u00eancia motora.<\/p>\n

Recomenda\u00e7\u00f5es e crit\u00e9rios<\/h3>\n

Em cada princ\u00edpio do WCAG existem recomenda\u00e7\u00f5es a serem seguidas que s\u00e3o niveladas a partir dos chamados crit\u00e9rio de sucesso.<\/p>\n

Para ficar mais claro, vamos tomar como exemplo uma recomenda\u00e7\u00e3o do terceiro princ\u00edpio (compreens\u00edvel).<\/p>\n

\u201c3.1.4 Abreviaturas: Est\u00e1 dispon\u00edvel um mecanismo para identificar a forma completa ou o significado das abrevia\u00e7\u00f5es. (N\u00edvel AAA)\u201d<\/strong><\/p>\n

\"Imagem<\/a><\/p>\n

Os crit\u00e9rios de sucesso s\u00e3o separados por n\u00edveis de conformidade: A, AA, ou AAA<\/strong>. No n\u00edvel A est\u00e3o alguns crit\u00e9rios mais simples, que representam apenas barreiras mais significativas de acessibilidade. J\u00e1 um site que segue as recomenda\u00e7\u00f5es do n\u00edvel AA, apresenta para a maior parte dos usu\u00e1rios, garantindo acesso \u00e0 grande maioria dos conte\u00fados. E por fim, as recomenda\u00e7\u00f5es do n\u00edvel AAA, s\u00e3o um refinamento das anteriores, sendo especifica\u00e7\u00f5es mais detalhadas e que trazem um n\u00edvel mais sofisticado de acessibilidade.<\/p>\n

Como j\u00e1 foi dito no come\u00e7o do texto, no ano de 2018 o WCAG foi atualizado, e agora a vers\u00e3o mais recente do documento \u00e9 o WCAG 2.1<\/a><\/span>, mas ainda n\u00e3o h\u00e1 tradu\u00e7\u00e3o para o portugu\u00eas. De forma geral, o conte\u00fado continua muito parecido, mas os crit\u00e9rios de sucesso agora est\u00e3o mais completos. Agora, eles est\u00e3o explicados com mais detalhes e al\u00e9m disso, h\u00e1 links e exemplos para que seja de mais f\u00e1cil compreens\u00e3o. Isso pode ser \u00fatil para tornar ainda mais claro quais os caminhos a serem seguidos na hora de tornar um site acess\u00edvel.<\/p>\n

Conte com a ajuda dos avaliadores<\/h3>\n

Num primeiro momento, essas recomenda\u00e7\u00f5es parecem muitas e dif\u00edceis de serem colocadas em pr\u00e1tica. Mas calma! Existem v\u00e1rios avaliadores de acessibilidade<\/a> que seguem as diretrizes do WCAG 2.0. Com eles, voc\u00ea consegue entender no que precisa melhorar, e em alguns casos, como pode fazer isso<\/strong>. No ASES<\/a><\/span>, por exemplo, que foi realizado pelo minist\u00e9rio do planejamento, voc\u00ea pode corrigir os problemas do seu c\u00f3digo. No <\/span>DaSilva<\/span>,<\/a> o primeiro avaliador em l\u00edngua portuguesa, voc\u00ea consegue ver quantas URLs j\u00e1 foram analisadas anteriormente, e no Avaliador do MWPT<\/a><\/span>, \u00e9 poss\u00edvel ver em que n\u00edvel est\u00e1 o seu site em rela\u00e7\u00e3o a outros que j\u00e1 foram avaliados. Essa \u00e9 uma forma simples e r\u00e1pida de saber por onde come\u00e7ar!<\/p>\n

Depois de ler o WCAG 2.0 e avaliar o seu site, fica a d\u00favida sobre quais t\u00e9cnicas utilizar para conseguir de fato ter um conte\u00fado acess\u00edvel. N\u00f3s preparamos um Guia de Ferramentas de acessibilidade digital que vai te auxiliar muito nisso<\/a>!<\/span> L\u00e1, selecionamos algumas das melhores tecnologias presentes no mercado, desde avaliadores mais espec\u00edficos para quest\u00f5es pontuais, at\u00e9 plugins e leitores de tela. Confira esse material!<\/p>\n

\"banner-ebook-acess.<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

O WCAG, ou Diretrizes Para o Conte\u00fado de Acessibilidade Web, \u00e9 um documento que estipula os padr\u00f5es de acessibilidade digital que devem ser seguidos pelos sites. A primeira vers\u00e3o (1.0) foi lan\u00e7ada em 1999. Depois disso, as diretrizes foram reformuladas em 2008, e no ano passado, passaram por uma nova atualiza\u00e7\u00e3o, que ainda n\u00e3o est\u00e1 […]<\/p>\n","protected":false},"author":2,"featured_media":2583,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,14],"tags":[466,91,467,468],"class_list":["post-2578","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-acessibilidade","category-acessibilidade-digital","tag-acessibildade","tag-acessibilidade-digital","tag-diretrizes-de-acessibilidade","tag-wcag-2-0"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/posts\/2578","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/comments?post=2578"}],"version-history":[{"count":0,"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/posts\/2578\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/media\/2583"}],"wp:attachment":[{"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/media?parent=2578"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/categories?post=2578"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.handtalk.me\/br\/wp-json\/wp\/v2\/tags?post=2578"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}