{"id":52510,"date":"2021-07-09T07:00:00","date_gmt":"2021-07-09T14:00:00","guid":{"rendered":"https:\/\/dhblog.dream.press\/blog\/?p=52510"},"modified":"2025-05-26T10:34:53","modified_gmt":"2025-05-26T17:34:53","slug":"guia-de-acessibilidade-na-web-para-designers","status":"publish","type":"post","link":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/guia-de-acessibilidade-na-web-para-designers\/","title":{"rendered":"Guia de Acessibilidade na Web para Designers (6 Dicas Essenciais)"},"content":{"rendered":"\n

Como designer de websites, voc\u00ea desempenha um papel significativo na acessibilidade do website<\/a><\/span> e inclus\u00e3o.  Muitos elementos de design, desde a tipografia at\u00e9 a m\u00eddia, podem criar barreiras para pessoas com defici\u00eancia. Com tantos itens que precisam ser abordados, pode parecer uma tarefa imposs\u00edvel.<\/p>\n\n\n\n

Felizmente, h\u00e1 muita orienta\u00e7\u00e3o dispon\u00edvel para projetar um site<\/a><\/span> que seja acess\u00edvel a todos. Ao prestar aten\u00e7\u00e3o cuidadosa a algumas \u00e1reas-chave, voc\u00ea deve conseguir incluir acessibilidade no seu processo de design<\/a> sem interromper o fluxo.<\/p>\n\n\n\n

Neste guia, vamos apresentar o conceito de acessibilidade na web e sua import\u00e2ncia. Em seguida, abordaremos seis \u00e1reas-chave a serem consideradas ao projetar um site acess\u00edvel. Vamos come\u00e7ar!<\/p>\n\n\n\n

Introdu\u00e7\u00e3o \u00e0 Acessibilidade na Web<\/span><\/h2>\n\n\n\n

Acessibilidade na Web<\/a><\/span> significa que todos os aspectos de um site s\u00e3o utiliz\u00e1veis por pessoas com defici\u00eancia. Sem isso, muitas das informa\u00e7\u00f5es na internet seriam inacess\u00edveis para uma grande porcentagem da popula\u00e7\u00e3o. Para os propriet\u00e1rios de neg\u00f3cios online, isso tamb\u00e9m equivaleria a perder vendas potenciais.<\/p>\n\n\n\n

Desde 2019, cerca de 60%<\/a><\/span> da popula\u00e7\u00e3o dos Estados Unidos com defici\u00eancias vive em uma casa com acesso \u00e0 internet. Isso significa muitas pessoas que dependem de um design acess\u00edvel para usar a web plenamente. Pessoas com defici\u00eancias tamb\u00e9m tendem a adotar tecnologia em taxas menores<\/a><\/span>, o que significa que elas podem n\u00e3o ter uma op\u00e7\u00e3o de escolha de dispositivo ao acessar um site.<\/p>\n\n\n\n

O World Wide Web Consortium (W3C)<\/a><\/span> desenvolveu as Diretrizes de Acessibilidade para Conte\u00fado Web (WCAG) para fornecer um conjunto de padr\u00f5es para desenvolvedores, designers e outros respons\u00e1veis pela cria\u00e7\u00e3o e manuten\u00e7\u00e3o de conte\u00fado na web.<\/p>\n\n\n\n

As diretrizes de acessibilidade s\u00e3o organizadas em quatro princ\u00edpios, \u00e0s vezes referidos pela sigla POUR:<\/p>\n\n\n\n

    \n
  1. Percept\u00edvel:<\/span>\u00a0Os componentes do site devem ser apresentados de forma que os usu\u00e1rios possam perceber, independentemente da defici\u00eancia.<\/li>\n\n\n\n
  2. Oper\u00e1vel:<\/span>\u00a0A navega\u00e7\u00e3o e opera\u00e7\u00e3o n\u00e3o devem exigir a\u00e7\u00f5es de entrada que o usu\u00e1rio n\u00e3o possa executar.<\/li>\n\n\n\n
  3. Compreens\u00edvel:<\/span>\u00a0Os usu\u00e1rios devem entender como usar e navegar no site e o conte\u00fado nele.<\/li>\n\n\n\n
  4. Robusto:<\/span>\u00a0O conte\u00fado precisa ser compat\u00edvel com a tecnologia assistiva atual e futura.<\/li>\n\n\n<\/ol>\n\n\n\n

    Esses princ\u00edpios podem parecer esmagadores e at\u00e9 um pouco vagos. No entanto, existem passos concretos que voc\u00ea pode tomar para garantir que seu site seja acess\u00edvel a todos.<\/p>\n\n\n\n\n\n

    \"Ad<\/div>\n\n\n\n\n
    \n \n Obtenha um Design Inclusivo do Qual se Orgulhar\u00e1\n <\/h2>\n \n Nossos designers criar\u00e3o um site incr\u00edvel para sua marca, tendo em mente as diretrizes de usabilidade e a conformidade com a ADA. Aqui n\u00e3o h\u00e1 problemas de acessibilidade!\n <\/p>\n\n \n Saiba Mais <\/a>\n\n <\/div>\n<\/div>\n\n\n

    Guia de Acessibilidade na Web para Designers (6 Dicas Principais)<\/span><\/h2>\n\n\n\n

    Tendo abordado como a acessibilidade na web \u00e9 vital, vamos considerar seis \u00e1reas ao projetar um site acess\u00edvel.<\/p>\n\n\n\n

    1. Torne os Elementos Visuais de Design Leg\u00edveis<\/span><\/h3>\n\n\n\n

    A tipografia \u00e9 uma \u00e1rea divertida para mostrar seu estilo criativo, mas o prop\u00f3sito principal do texto do seu site \u00e9 transmitir informa\u00e7\u00f5es. Existem algumas diretrizes que voc\u00ea deve ter em mente ao trabalhar com tipografia.<\/p>\n\n\n\n

    Primeiro, voc\u00ea vai querer pensar no contraste entre o texto e o fundo. O contraste \u00e9 expresso como uma raz\u00e3o, e de acordo com as diretrizes WCAG, o contraste m\u00ednimo \u00e9 de 4.5:1 para texto normal e 3:1 para texto grande.<\/p>\n\n\n\n

    Existem v\u00e1rias ferramentas que voc\u00ea pode usar para testar combina\u00e7\u00f5es de cores. O Verificador de Contraste do WebAIM<\/a><\/span> \u00e9 uma delas.<\/p>\n\n\n

    \n
    \"Ferramenta<\/figure><\/div>\n\n\n

    O espa\u00e7amento entre linhas e letras tamb\u00e9m s\u00e3o importantes no que diz respeito \u00e0 acessibilidade. Para manter o texto leg\u00edvel, o W3C fornece as seguintes orienta\u00e7\u00f5es<\/a><\/span>:<\/p>\n\n\n\n