{"id":57018,"date":"2024-05-20T01:00:00","date_gmt":"2024-05-20T08:00:00","guid":{"rendered":"https:\/\/dhblog.dream.press\/blog\/?p=57018"},"modified":"2025-05-26T12:43:03","modified_gmt":"2025-05-26T19:43:03","slug":"otimos-exemplos-de-acessibilidade-na-web","status":"publish","type":"post","link":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/","title":{"rendered":"12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es"},"content":{"rendered":"\n<p>Aqui na DreamHost, acreditamos que todos devem poder usar qualquer site na internet, independentemente de defici\u00eancia ou incapacidade. No entanto, embora nos importemos com <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/pt\/legal\/accessibility\/\" rel=\"noopener\">acessibilidade na web<\/a>, tamb\u00e9m entendemos que projetar um site que seja acess\u00edvel e visualmente atraente pode ser desafiador.<\/p>\n\n\n\n<p>A boa not\u00edcia \u00e9 que voc\u00ea pode projetar sites acess\u00edveis sem sacrificar o impacto visual. De fato, alguns dos sites mais impressionantes s\u00e3o projetados especificamente para serem mais acess\u00edveis a pessoas com defici\u00eancias \u2014 e todos n\u00f3s poder\u00edamos aprender uma ou duas coisas com eles.<\/p>\n\n\n\n<p>\n\n\n\n<div class=\"glossary-term\">\n\t<a\n\t\tclass=\"glossary-term__above-title\"\n\t\thref=\"\"\n\t\ttarget=\"_blank\"\n\t\trel=\"noopener noreferrer\"\n\t>\n\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 640 512\"><path d=\"M320 32c-8.1 0-16.1 1.4-23.7 4.1L15.8 137.4C6.3 140.9 0 149.9 0 160s6.3 19.1 15.8 22.6l57.9 20.9C57.3 229.3 48 259.8 48 291.9v28.1c0 28.4-10.8 57.7-22.3 80.8c-6.5 13-13.9 25.8-22.5 37.6C0 442.7-.9 448.3 .9 453.4s6 8.9 11.2 10.2l64 16c4.2 1.1 8.7 .3 12.4-2s6.3-6.1 7.1-10.4c8.6-42.8 4.3-81.2-2.1-108.7C90.3 344.3 86 329.8 80 316.5V291.9c0-30.2 10.2-58.7 27.9-81.5c12.9-15.5 29.6-28 49.2-35.7l157-61.7c8.2-3.2 17.5 .8 20.7 9s-.8 17.5-9 20.7l-157 61.7c-12.4 4.9-23.3 12.4-32.2 21.6l159.6 57.6c7.6 2.7 15.6 4.1 23.7 4.1s16.1-1.4 23.7-4.1L624.2 182.6c9.5-3.4 15.8-12.5 15.8-22.6s-6.3-19.1-15.8-22.6L343.7 36.1C336.1 33.4 328.1 32 320 32zM128 408c0 35.3 86 72 192 72s192-36.7 192-72L496.7 262.6 354.5 314c-11.1 4-22.8 6-34.5 6s-23.5-2-34.5-6L143.3 262.6 128 408z\"\/><\/svg>\n\t\t<span><\/span>\n\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 384 512\"><path d=\"M342.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L274.7 256 105.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z\"\/><\/svg>\n\t<\/a>\n    <h3>Acessibilidade<\/h3>\n    <p>Acessibilidade \u00e9 a pr\u00e1tica de tornar um site acess\u00edvel para o maior n\u00famero poss\u00edvel de usu\u00e1rios. Sites acess\u00edveis podem ser visualizados por qualquer pessoa em qualquer dispositivo.<\/p>\n            <a\n            href=\"https:\/\/www.dreamhost.com\/glossary\/web-design\/accessibility\/\"\n                        class=\"btn btn--white-outline btn--sm btn--round\"\n                                    target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            >\n                            Leia Mais                    <\/a>\n\n<\/div>\n\n<\/p>\n\n\n\n<p>Neste post, come\u00e7aremos mostrando como \u00e9 uma forte acessibilidade na web, e abordaremos alguns padr\u00f5es de acessibilidade na web projetados para ajudar a democratizar o acesso aos sites. Em seguida, mostraremos 12 dos melhores exemplos de acessibilidade na web na internet, incluindo alguns sites populares que se comprometeram com a acessibilidade, e veremos o que eles podem nos ensinar.<\/p>\n\n\n\n<p>Comece Agora!<\/p>\n\n\n\n<h2 id=\"looks\" class=\"wp-block-heading\">Como \u00e9 uma \u00d3tima Acessibilidade na Web<\/h2>\n\n\n\n<p>De acordo com <a target=\"_blank\" href=\"https:\/\/www.worldbank.org\/en\/topic\/disability\" rel=\"noopener\">O Banco Mundial<\/a>, cerca de um bilh\u00e3o de pessoas, ou 15% da popula\u00e7\u00e3o mundial, possuem algum tipo de defici\u00eancia. Estas podem incluir:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Defici\u00eancias visuais<\/strong>: Alguns usu\u00e1rios t\u00eam uma defici\u00eancia visual que inibe a capacidade de ver claramente ou perceber contrastes de cores. Uma variedade de pessoas pode se enquadrar nesta categoria, incluindo usu\u00e1rios cegos ou aqueles com daltonismo. Para usu\u00e1rios com defici\u00eancias visuais, voc\u00ea pode usar descri\u00e7\u00f5es em \u00e1udio ou combina\u00e7\u00f5es de cores acess\u00edveis (por exemplo, evite usar texto escuro em cores de fundo escuras).<\/li>\n\n\n\n<li><strong>Defici\u00eancias auditivas<\/strong>: Usu\u00e1rios com defici\u00eancias auditivas podem incluir pessoas surdas ou com perda auditiva parcial (com dificuldade de audi\u00e7\u00e3o). Legendas para conte\u00fado de \u00e1udio podem proporcionar a esses usu\u00e1rios uma experi\u00eancia mais acess\u00edvel.<\/li>\n\n\n\n<li><strong>Defici\u00eancias f\u00edsicas<\/strong>: Algumas pessoas t\u00eam defici\u00eancias de mobilidade que podem impactar sua destreza e capacidade de fazer movimentos precisos, possivelmente tornando dif\u00edcil o uso de um mouse. Aqueles com defici\u00eancias f\u00edsicas podem ser usu\u00e1rios de tecnologias assistivas. Garanta que seu site esteja devidamente codificado para dispositivos assistivos para fornecer conte\u00fado acess\u00edvel para usu\u00e1rios com defici\u00eancias f\u00edsicas.<\/li>\n\n\n\n<li><strong>Defici\u00eancias cognitivas<\/strong>: Alguns usu\u00e1rios podem ter defici\u00eancias cognitivas como dislexia, dem\u00eancia ou um transtorno de processamento auditivo. Voc\u00ea pode considerar o uso de uma fonte espec\u00edfica, como <a target=\"_blank\" href=\"https:\/\/dyslexiefont.com\/en\/\" rel=\"noopener\">Dyslexie<\/a>. Voc\u00ea tamb\u00e9m deve garantir que qualquer conte\u00fado em \u00e1udio tenha uma transcri\u00e7\u00e3o dispon\u00edvel para aqueles com defici\u00eancias de processamento auditivo.<\/li>\n\n\n\n\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"900\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like.webp\" alt=\"15% da popula\u00e7\u00e3o global possui algum tipo de defici\u00eancia\" class=\"wp-image-45651 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-300x169.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-1024x576.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-768x432.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-1536x864.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-600x338.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-1200x675.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-730x411.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-1460x821.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-784x441.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-1568x882.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/00_what_great_web_accessibility_looks_like-877x493.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/900;\" \/><\/figure>\n\n\n\n<p>\u00c9 importante considerar todas essas diferentes habilidades ao criar seu site para garantir que n\u00e3o haja barreiras para usu\u00e1rios com defici\u00eancia. Para auxiliar os web designers nisso, o W3C desenvolveu um conjunto de <a target=\"_blank\" href=\"https:\/\/www.w3.org\/TR\/WCAG20\/\" rel=\"noopener\">Diretrizes de Acessibilidade para o Conte\u00fado Web (WCAG)<\/a>.<\/p>\n\n\n\n<p>Uma s\u00f3lida acessibilidade na web significa aderir a essas diretrizes e seguir cuidadosamente os quatro princ\u00edpios orientadores do <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/torne-seu-site-acessivel\/\" rel=\"noopener\">design acess\u00edvel<\/a>. Esses princ\u00edpios orientadores afirmam que todos os websites devem ser:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Percept\u00edvel<\/strong><\/li>\n\n\n\n<li><strong>Oper\u00e1vel<\/strong><\/li>\n\n\n\n<li><strong>Compreens\u00edvel<\/strong><\/li>\n\n\n\n<li><strong>Robusto<\/strong><\/li>\n\n\n\n\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1700\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1.webp\" alt=\"Quatro capturas de tela para ilustrar percept\u00edvel, oper\u00e1vel, compreens\u00edvel e robusto em uma grade.\" class=\"wp-image-45653 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-282x300.webp 282w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-964x1024.webp 964w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-768x816.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-1446x1536.webp 1446w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-600x638.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-1200x1275.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-730x776.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-1460x1551.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-784x833.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-1568x1666.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/01_wcag_standards_for_website_accessibility_1-877x932.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1700;\" \/><\/figure>\n\n\n\n<p>Garantir que seu site seja \u201coper\u00e1vel\u201d pode significar implementar navega\u00e7\u00e3o amig\u00e1vel para teclado para pessoas que n\u00e3o podem usar um mouse. \u201cPercept\u00edvel\u201d pode significar usar cores de alto contraste para pessoas com defici\u00eancias visuais.<\/p>\n\n\n\n<p>Pronto para ver como esses princ\u00edpios funcionam na pr\u00e1tica? Abaixo, temos 12 exemplos de sites que est\u00e3o fazendo o design acess\u00edvel corretamente.<\/p>\n\n\n\n<h2 id=\"examples\" class=\"wp-block-heading\">12 \u00d3timos Exemplos de Acessibilidade na Web Para Inspirar Voc\u00ea<\/h2>\n\n\n\n<p>Aqui, voc\u00ea encontrar\u00e1 alguns dos nossos exemplos favoritos de acessibilidade na web. Estes 12 sites s\u00e3o exemplos de design web acess\u00edvel no seu melhor.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-1-scope\">1. <a target=\"_blank\" href=\"https:\/\/www.scope.org.uk\/\" rel=\"noopener\">Scope<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1238\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope.webp\" alt=\"Captura de tela da p\u00e1gina inicial do Scope com cores ousadas, texto de alto contraste e um menu de navega\u00e7\u00e3o claro no topo.\" class=\"wp-image-45654 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-300x232.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-1024x792.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-768x594.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-1536x1188.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-600x464.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-1200x929.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-730x565.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-1460x1130.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-784x607.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-1568x1213.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/02_scope-877x679.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1238;\" \/><\/figure>\n\n\n\n<p>Scope \u00e9 uma institui\u00e7\u00e3o de caridade para igualdade de pessoas com defici\u00eancia, sediada na Inglaterra e no Pa\u00eds de Gales, dedicada a criar uma sociedade mais justa e igualit\u00e1ria. Como defensora da igualdade para pessoas com defici\u00eancia, espera-se que o site desta organiza\u00e7\u00e3o seja o mais acess\u00edvel poss\u00edvel \u2014 e ele \u00e9.<\/p>\n\n\n\n<p>N\u00e3o s\u00f3 adere completamente \u00e0s diretrizes WCAG 2.0 e WCAG 2.1, mas o site tamb\u00e9m \u00e9 personaliz\u00e1vel para usu\u00e1rios individuais. Por exemplo, os usu\u00e1rios podem alterar as cores do site, aumentar o tamanho do texto ou at\u00e9 ativar a narra\u00e7\u00e3o de texto para ter o conte\u00fado lido em voz alta.<\/p>\n\n\n\n<p>Se voc\u00ea olhar para a se\u00e7\u00e3o superior esquerda da p\u00e1gina inicial, ver\u00e1 uma aba <strong>Acessibilidade<\/strong>. Clique nela, e o site o direcionar\u00e1 para sua p\u00e1gina de acessibilidade, que inclui instru\u00e7\u00f5es sobre como adaptar a experi\u00eancia \u00e0s suas necessidades, links para <a target=\"_blank\" href=\"https:\/\/www.atia.org\/home\/at-resources\/what-is-at\/\" rel=\"noopener\">tecnologias assistivas<\/a>, e uma lista de problemas conhecidos de acessibilidade que est\u00e3o sendo trabalhados.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1289\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement.webp\" alt=\"P\u00e1gina de Declara\u00e7\u00e3o de Acessibilidade da Scope, delineando seus compromissos e adaptando a experi\u00eancia \u00e0s necessidades dos usu\u00e1rios.\" class=\"wp-image-45655 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-300x242.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-1024x825.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-768x619.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-1536x1237.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-600x483.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-1200x967.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-730x588.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-1460x1176.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-784x632.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-1568x1263.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/03_scope_web_accessibility_statement-877x707.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1289;\" \/><\/figure>\n\n\n\n<p>Scope utiliza frases curtas e <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/fontes-seguras-para-a-web\/\" rel=\"noopener\">fontes grandes e limpas<\/a> em todo o site para m\u00e1xima legibilidade. Al\u00e9m disso, o site \u00e9 totalmente compat\u00edvel com softwares leitores de tela.<\/p>\n\n\n\n<p>Apesar de j\u00e1 ser um exemplo fant\u00e1stico de acessibilidade de sites, a equipe da Scope continua a fazer melhorias. A cada quatro meses, eles testam o site para acessibilidade e fazem atualiza\u00e7\u00f5es sempre que necess\u00e1rio.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">2. <a target=\"_blank\" href=\"https:\/\/www.harvard.edu\/\" rel=\"noopener\">Universidade de Harvard<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1005\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university.webp\" alt=\"P\u00e1gina inicial da Universidade de Harvard com o cabe\u00e7alho Solu\u00e7\u00f5es Clim\u00e1ticas em frente a uma fotografia de moinhos de vento em um campo.\" class=\"wp-image-45656 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-300x188.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-1024x643.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-768x482.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-1536x965.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-600x377.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-1200x754.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-730x459.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-1460x917.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-784x492.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-1568x985.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/04_harvard_university-877x551.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1005;\" \/><\/figure>\n\n\n\n<p>A educa\u00e7\u00e3o em Harvard n\u00e3o \u00e9 seu \u00fanico ponto forte. O site da renomada universidade mundial tamb\u00e9m se destaca por sua acessibilidade, oferecendo um arsenal de ferramentas de leitura, legendas de v\u00eddeo multil\u00edngues e <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/esquemas-de-cores-para-sites\/\" rel=\"noopener\">esquemas de cores<\/a> cuidadosamente selecionados que atendem \u00e0s necessidades de visitantes dalt\u00f4nicos.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1021\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation.webp\" alt=\"Menu de navega\u00e7\u00e3o principal da Universidade de Harvard com abas para Sobre e Acad\u00eamico em texto branco grande, contra um fundo preto, \" class=\"wp-image-45657 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-300x191.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-1024x653.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-768x490.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-1536x980.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-600x383.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-1200x766.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-730x466.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-1460x932.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-784x500.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-1568x1001.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/05_harvard_university_website_navigation-877x560.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1021;\" \/><\/figure>\n\n\n\n<p>O menu de navega\u00e7\u00e3o de Harvard tamb\u00e9m ganha pontos por acessibilidade. \u00c9 simples, mas eficaz, com texto grande e f\u00e1cil de ler em uma cor de alto contraste. Tamb\u00e9m \u00e9 claro e f\u00e1cil de encontrar.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-3-paralympic-org\">3. <a target=\"_blank\" href=\"https:\/\/www.paralympic.org\/\" rel=\"noopener\">Paralympic.org<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1414\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org.webp\" alt=\"P\u00e1gina inicial do IPC com um v\u00eddeo em destaque na se\u00e7\u00e3o hero, cabe\u00e7alho e bot\u00f5es sociais no canto superior direito.\" class=\"wp-image-45658 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-300x265.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-1024x905.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-768x679.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-1536x1357.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-600x530.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-1200x1061.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-730x645.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-1460x1290.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-784x693.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-1568x1386.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/06_paralympic_org-877x775.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1414;\" \/><\/figure>\n\n\n\n<p>Paralympic.org \u00e9 o site oficial do Comit\u00ea Paral\u00edmpico Internacional (IPC). O IPC \u00e9 um poderoso defensor da inclus\u00e3o social, e seu site \u00e9 uma prova disso.<\/p>\n\n\n\n<p>Ele possui navega\u00e7\u00e3o por abas amig\u00e1vel ao teclado e um bot\u00e3o de seta instant\u00e2neo &#8220;rolar para o topo&#8221; para facilitar a movimenta\u00e7\u00e3o pela p\u00e1gina. As imagens e v\u00eddeos s\u00e3o grandes e visivelmente destacados, e h\u00e1 bastante espa\u00e7o em branco para fazer os <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/elementos-do-webdesign\/\" rel=\"noopener\">elementos visuais<\/a> se destacarem.<\/p>\n\n\n\n<p>Se voc\u00ea acessar a p\u00e1gina inicial, notar\u00e1 um ajustador de tamanho de texto no canto superior direito da tela. Isso \u00e9 facilmente vis\u00edvel e permite que usu\u00e1rios com defici\u00eancias visuais personalizem rapidamente o tamanho do texto para atender \u00e0s suas necessidades.<\/p>\n\n\n\n<div class=\"article-newsletter article-newsletter--gradient\">\n\n\n<h2>Get Content Delivered Straight to Your Inbox<\/h2><p>Subscribe now to receive all the latest updates, delivered directly to your inbox.<\/p><form class=\"nwsl-form\" id=\"newsletter_block_\" novalidate><div class=\"messages\"><\/div><div class=\"form-group\"><label for=\"input_newsletter_block_\"><input type=\"email\"name=\"email\"id=\"input_newsletter_block_\"placeholder=\"Enter your email address\"novalidatedisabled=\"disabled\"\/><\/label><button type=\"submit\"class=\"btn btn--brand\"disabled=\"disabled\"><span>Sign Me Up!<\/span><svg width=\"21\" height=\"14\" viewBox=\"0 0 21 14\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<path d=\"M13.8523 0.42524L12.9323 1.34521C12.7095 1.56801 12.7132 1.9304 12.9404 2.14865L16.7241 5.7823H0.5625C0.251859 5.7823 0 6.03416 0 6.3448V7.6573C0 7.96794 0.251859 8.2198 0.5625 8.2198H16.7241L12.9405 11.8535C12.7132 12.0717 12.7095 12.4341 12.9323 12.6569L13.8523 13.5769C14.072 13.7965 14.4281 13.7965 14.6478 13.5769L20.8259 7.39879C21.0456 7.17913 21.0456 6.82298 20.8259 6.60327L14.6477 0.42524C14.4281 0.205584 14.0719 0.205584 13.8523 0.42524Z\" fill=\"white\"\/>\n<\/svg>\n<\/button><\/div><\/form><\/div>\n\n\n \/wp:shortcode &#8211;>\n\n\n<h3 class=\"wp-block-heading\">4. <a target=\"_blank\" href=\"https:\/\/www.walmart.com\/\" rel=\"noopener\">Walmart<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"696\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-1024x696.webp\" alt=\"captura de tela da p\u00e1gina inicial do Walmart\" class=\"wp-image-45659 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-1024x696.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-300x204.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-768x522.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-1536x1044.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-600x408.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-1200x816.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-730x496.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-1460x993.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-784x533.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-1568x1066.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart-877x596.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/07_walmart.webp 1600w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/696;\" \/><\/figure>\n\n\n\n<p>Um dos requisitos do WCAG para websites acess\u00edveis \u00e9 que eles precisam ser &#8220;vis\u00edveis ao foco&#8221;, o que significa que a parte do site que est\u00e1 em uso \u00e9 destacada. O site da Walmart \u00e9 um \u00f3timo exemplo disso. Ele possui uma tonelada de elementos interativos como <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/a-pagina-de-contato-perfeita\/\" rel=\"noopener\">bot\u00f5es, links e campos de formul\u00e1rio<\/a> \u2014 mas os visitantes s\u00f3 podem focar em um de cada vez, e aquele com o qual est\u00e3o interagindo \u00e9 distintamente destacado para m\u00e1xima visibilidade.<\/p>\n\n\n\n<p>Tamb\u00e9m \u00e9 f\u00e1cil navegar entre diferentes elementos interativos, desde o <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/design-do-menu-de-navegacao\/\" rel=\"noopener\">menu de navega\u00e7\u00e3o<\/a> at\u00e9 diferentes bot\u00f5es, a barra de pesquisa, links para a sua p\u00e1gina de conta e carrinho de compras, e mais, seja usando navega\u00e7\u00e3o por mouse ou teclado.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">5. <a target=\"_blank\" href=\"https:\/\/www.kidzwishfoundation.org.au\/\" rel=\"noopener\">KidsWish<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"968\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish.webp\" alt=\"Captura de tela da p\u00e1gina inicial do KidsWish com cores vivas e marcantes e texto grande e f\u00e1cil de ler, com o slogan em destaque no centro.\" class=\"wp-image-45660 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-300x182.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-1024x620.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-768x465.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-1536x929.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-600x363.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-1200x726.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-730x442.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-1460x883.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-784x474.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-1568x949.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/08_kidswish-877x531.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/968;\" \/><\/figure>\n\n\n\n<p>KidsWish \u00e9 uma organiza\u00e7\u00e3o que oferece terapia, servi\u00e7os de apoio e uma festa anual de Natal para crian\u00e7as desfavorecidas ou com defici\u00eancia. Ela atende a muitas pessoas com diferentes defici\u00eancias, ent\u00e3o, naturalmente, seus desenvolvedores criaram um site que fosse o mais acess\u00edvel poss\u00edvel.<\/p>\n\n\n\n<p>E adivinha s\u00f3? Eles acertaram em cheio. O site KidsWish \u00e9 maravilhosamente projetado, com uma estrutura l\u00f3gica, navega\u00e7\u00e3o amig\u00e1vel para teclado, <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/aumentar-a-taxa-de-conversao-do-site\/\" rel=\"noopener\">cores de alto contraste<\/a> e texto grande. Al\u00e9m disso, \u00e9 f\u00e1cil de navegar com elementos proeminentes e clic\u00e1veis.<\/p>\n\n\n\n<p>O design tamb\u00e9m \u00e9 muito amig\u00e1vel para crian\u00e7as. Ele possui um esquema de cores brilhante e ousado e toneladas de gr\u00e1ficos divertidos.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">6. <a target=\"_blank\" href=\"https:\/\/www.nomensa.com\/\" rel=\"noopener\">Nomensa<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1096\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa.webp\" alt=\"P\u00e1gina inicial da Nomensa com o cabe\u00e7alho &quot;Design de experi\u00eancia de usu\u00e1rio estrat\u00e9gico&quot; sobreposta em uma foto de pessoas no escrit\u00f3rio.\" class=\"wp-image-45661 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-300x206.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-1024x701.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-768x526.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-1536x1052.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-600x411.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-1200x822.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-730x500.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-1460x1000.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-784x537.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-1568x1074.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/09_nomensa-877x601.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1096;\" \/><\/figure>\n\n\n\n<p>Nomensa \u00e9 uma ag\u00eancia de design de experi\u00eancia do usu\u00e1rio (UX) estrat\u00e9gica baseada em Londres. Eles colocam tanto foco em design acess\u00edvel, que oferecem um teste de acessibilidade na web que seus clientes atuais e potenciais podem fazer para ver como seus sites est\u00e3o em conformidade com os padr\u00f5es internacionais.<\/p>\n\n\n\n<p>A ag\u00eancia ent\u00e3o oferece <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/pt\/servicos-profissionais\/design\/\" rel=\"noopener\">servi\u00e7os de design<\/a> para ajudar os clientes a corrigir quaisquer problemas descobertos pela ferramenta de teste de acessibilidade.<\/p>\n\n\n\n<p>Veja s\u00f3: o co-fundador da empresa \u00e9 co-presidente do World Wide Web Consortium (W3C) e ajudou a escrever as diretrizes WCAG que orientam as melhores pr\u00e1ticas de acessibilidade na web. N\u00e3o \u00e9 \u00e0 toa que a Nomensa leva as solu\u00e7\u00f5es de acessibilidade t\u00e3o a s\u00e9rio!<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">7. <a target=\"_blank\" href=\"https:\/\/www.ovoenergy.com\/\" rel=\"noopener\">Ovo Energy<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1357\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy.webp\" alt=\"Captura de tela do site da Ovo Energy com texto grande, muito espa\u00e7o negativo, fotografias em molduras e bot\u00f5es verdes n\u00edtidos.\" class=\"wp-image-45662 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-300x254.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-1024x868.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-768x651.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-1536x1303.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-600x509.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-1200x1018.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-730x619.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-1460x1238.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-784x665.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-1568x1330.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/10_ovo_energy-877x744.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1357;\" \/><\/figure>\n\n\n\n<p>Ovo Energy \u00e9 uma empresa de energia sediada no Reino Unido. Seu site apresenta informa\u00e7\u00f5es sobre tarifas e pacotes e inclui um portal principal de login para os clientes gerenciarem suas contas.<\/p>\n\n\n\n<p>A empresa fez um trabalho maravilhoso ao tornar o site acess\u00edvel a todos, usando texto grande e leg\u00edvel e uma interface clara. Tamb\u00e9m incorpora navega\u00e7\u00e3o por teclado para facilitar a movimenta\u00e7\u00e3o pelo site.<\/p>\n\n\n\n<p>Os designers se esfor\u00e7aram ao m\u00e1ximo para garantir que o site seja acess\u00edvel a usu\u00e1rios com defici\u00eancia visual e auditiva. Existem <a target=\"_blank\" href=\"https:\/\/signvideo.co.uk\/\" rel=\"noopener\">servi\u00e7os SignVideo<\/a> para usu\u00e1rios da L\u00edngua de Sinais Brit\u00e2nica, e o contraste de cores atende \u00e0s diretrizes WCAG.<\/p>\n\n\n\n<p>Os clientes tamb\u00e9m podem solicitar faturas em Braille e em formatos maiores. Al\u00e9m de tudo isso, o site \u00e9 compat\u00edvel com tecnologia assistiva.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">8. <a target=\"_blank\" href=\"https:\/\/bleacherreport.com\/\" rel=\"noopener\">Bleacher Report<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1102\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report.webp\" alt=\"P\u00e1gina inicial do site Bleacher Report com um artigo em destaque, quatro v\u00eddeos abaixo da se\u00e7\u00e3o principal, e texto branco sobre fundo preto.\" class=\"wp-image-45663 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-300x207.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-1024x705.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-768x529.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-1536x1058.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-600x413.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-1200x827.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-730x503.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-1460x1006.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-784x540.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-1568x1080.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/11_bleacher_report-877x604.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1102;\" \/><\/figure>\n\n\n\n<p>O site de not\u00edcias esportivas Bleacher Report faz algo diferente que \u00e9 extremamente \u00fatil para usu\u00e1rios que acessam o site usando leitores de tela ou controles de teclado. Os primeiros pontos de foco s\u00e3o a notifica\u00e7\u00e3o de cookies, a Pol\u00edtica de Privacidade e os Termos de Uso, e se voc\u00ea clicar no link externo para esses, eles abrem em uma nova janela.<\/p>\n\n\n\n<p>Para usu\u00e1rios sem defici\u00eancias, isso pode n\u00e3o parecer importante, mas isso d\u00e1 a <em>todos<\/em> os visitantes do site do Bleacher Report acesso a informa\u00e7\u00f5es legais importantes. Na maioria dos sites, os avisos legais e de cookies est\u00e3o no final da p\u00e1gina, o que significa que visitantes que usam controles de teclado ou leitores de tela chegam a eles ao final de sua visita, ap\u00f3s navegar pelo restante do site. Esta \u00e9 uma pequena mudan\u00e7a com um grande impacto para pessoas com defici\u00eancias.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">9. <a target=\"_blank\" href=\"https:\/\/www.bbc.co.uk\/iplayer\/\" rel=\"noopener\">BBC iPlayer<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1215\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer.webp\" alt=\"P\u00e1gina inicial do BBC iPlayer com um programa em destaque na se\u00e7\u00e3o her\u00f3i e programas &quot;Novos &amp; em Tend\u00eancia&quot; abaixo.\" class=\"wp-image-45664 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-300x228.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-1024x778.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-768x583.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-1536x1166.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-600x456.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-1200x911.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-730x554.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-1460x1109.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-784x595.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-1568x1191.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/12_bbc_iplayer-877x666.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1215;\" \/><\/figure>\n\n\n\n<p>BBC iPlayer \u00e9 o servi\u00e7o de streaming online da BBC. Os usu\u00e1rios assistem a programas online em seu site. \u00c9 tamb\u00e9m outro excelente exemplo de acessibilidade na web do qual todos podemos aprender.<\/p>\n\n\n\n<p>Primeiro, o website \u00e9 f\u00e1cil de navegar e compat\u00edvel com tecnologia assistiva. Voc\u00ea pode se mover pela p\u00e1gina clicando no bot\u00e3o <strong>Tab<\/strong>. Navegar sobre o logo do iPlayer exibe uma op\u00e7\u00e3o para ajuda de <strong>Acessibilidade<\/strong>, que direciona para uma p\u00e1gina de recursos com muitas informa\u00e7\u00f5es \u00fateis para usu\u00e1rios com defici\u00eancias.<\/p>\n\n\n\n<p>O conte\u00fado est\u00e1 organizado de forma l\u00f3gica, e todos os bot\u00f5es usam um design visual claro com cores de alto contraste. Existem tamb\u00e9m dicas de ferramentas acess\u00edveis por teclado e mouse que fornecem informa\u00e7\u00f5es adicionais para os usu\u00e1rios e <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/criar-imagem-destacada-no-wordpress\/\" rel=\"noopener\">texto alternativo descritivo<\/a> para todas as imagens.<\/p>\n\n\n\n<p>O conte\u00fado em v\u00eddeo tamb\u00e9m \u00e9 acess\u00edvel. Todos os programas no BBC iPlayer possuem legendas. H\u00e1 tamb\u00e9m categorias de conte\u00fado com descri\u00e7\u00e3o de \u00e1udio e com linguagem de sinais.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">10. <a target=\"_blank\" href=\"https:\/\/new.mta.info\/\" rel=\"noopener\">Autoridade de Transporte Metropolitano<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1100\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority.webp\" alt=\"Site da MTA com menus suspensos para &quot;Planejar uma Viagem&quot; e &quot;Status do Servi\u00e7o&quot; mostrando atrasos e viagens planejadas em diferentes cores.\" class=\"wp-image-45665 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-300x206.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-1024x704.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-768x528.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-1536x1056.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-600x413.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-1200x825.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-730x502.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-1460x1004.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-784x539.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-1568x1078.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/13_metropolitan_transportation_authority-877x603.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1100;\" \/><\/figure>\n\n\n\n<p>Al\u00e9m de ter um site responsivo que \u00e9 f\u00e1cil de usar em dispositivos com telas de todos os tamanhos, a Autoridade de Transporte Metropolitano da Cidade de Nova York tamb\u00e9m possui uma experi\u00eancia de pesquisa integrada que ajuda os usu\u00e1rios a encontrar as informa\u00e7\u00f5es que est\u00e3o procurando de maneira mais r\u00e1pida e f\u00e1cil. Como? A fun\u00e7\u00e3o de pesquisa ainda fornece resultados mesmo que os usu\u00e1rios errem na ortografia das palavras ou forne\u00e7am entradas em formatos incorretos.<\/p>\n\n\n\n<p>Por exemplo, se um usu\u00e1rio inserir um endere\u00e7o ou bairro no planejador de viagens da MTA com um erro de digita\u00e7\u00e3o, a barra de pesquisa ainda sugerir\u00e1 endere\u00e7os com base em sua melhor suposi\u00e7\u00e3o do que o usu\u00e1rio estava procurando.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">11. <a target=\"_blank\" href=\"https:\/\/www.nsw.gov.au\/\" rel=\"noopener\">Governo de NSW<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1345\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government.webp\" alt=\"Site do governo de NSW com uma barra de pesquisa em destaque, e uma se\u00e7\u00e3o &quot;O que voc\u00ea est\u00e1 procurando?&quot; abaixo com links.\" class=\"wp-image-45666 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-300x252.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-1024x861.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-768x646.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-1536x1291.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-600x504.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-1200x1009.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-730x614.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-1460x1227.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-784x659.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-1568x1318.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/14_nsw_government-877x737.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1345;\" \/><\/figure>\n\n\n\n<p>O site do Governo de NSW \u00e9 o centro governamental para a \u00e1rea de New South Wales na Austr\u00e1lia. O site \u00e9 projetado para ser amig\u00e1vel para residentes de todos os antecedentes e habilidades.<\/p>\n\n\n\n<p>O site possui navega\u00e7\u00e3o por abas, facilitando a navega\u00e7\u00e3o pelas p\u00e1ginas usando um teclado ou leitor de tela. Gra\u00e7as a <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/pt\/melhores-fontes-do-google\/\" rel=\"noopener\">fontes grandes<\/a> e cores contrastantes, \u00e9 tamb\u00e9m extremamente leg\u00edvel e ganha pontos por ser compat\u00edvel com tecnologia assistiva.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">12. <a target=\"_blank\" href=\"https:\/\/www.gov.uk\/\" rel=\"noopener\">GOV.UK<\/a><\/h3>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1228\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk.webp\" alt=\"Website GOV.UK em um esquema de cores azul e branco com uma barra de pesquisa e links abaixo de &quot;Popular no GOV.UK&quot; para melhor navega\u00e7\u00e3o.\" class=\"wp-image-45667 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-300x230.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-1024x786.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-768x589.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-1536x1179.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-600x461.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-1200x921.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-730x560.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-1460x1121.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-784x602.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-1568x1203.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/15_gov_uk-877x673.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1228;\" \/><\/figure>\n\n\n\n<p>GOV.UK \u00e9 o centro principal para todas as p\u00e1ginas web do governo do Reino Unido. O site fornece informa\u00e7\u00f5es sobre tudo, desde aux\u00edlio para defici\u00eancia e benef\u00edcios at\u00e9 suporte para vistos e imigra\u00e7\u00e3o.<\/p>\n\n\n\n<p>O Governo do Reino Unido fez um trabalho incr\u00edvel ao tornar seu site acess\u00edvel para todos que precisam dele. O site possui navega\u00e7\u00e3o por teclado e atributos ARIA, para que voc\u00ea possa encontrar as p\u00e1ginas facilmente. Al\u00e9m disso, \u00e9 projetado para suportar um zoom de 300% para leitores com defici\u00eancia visual.<\/p>\n\n\n\n<h2 id=\"statement\" class=\"wp-block-heading\">Fa\u00e7a uma Declara\u00e7\u00e3o de Acessibilidade<\/h2>\n\n\n\n<p>Garantir que seu site seja o mais acess\u00edvel poss\u00edvel \u00e9 uma obriga\u00e7\u00e3o moral e profissional. Pode parecer um desafio, mas n\u00f3s prometemos \u2014 vale a pena. Os exemplos acima ir\u00e3o gui\u00e1-lo na cria\u00e7\u00e3o de um site inclusivo que ser\u00e1 acess\u00edvel a todos os usu\u00e1rios.<\/p>\n\n\n\n<p>Pronto para construir seu site acess\u00edvel? Deixe-nos cuidar do lado t\u00e9cnico para voc\u00ea, para que voc\u00ea possa focar mais do seu tempo e energia no que importa: o design. Inscreva-se em nosso <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/pt\/hosting\/compartilhado\/\" rel=\"noopener\">Plano de Hospedagem Shared Unlimited<\/a> e obtenha hospedagem ilimitada e segura para todos os seus sites.<\/p>\n\n\n\n<p>Nota: Fazemos uma extensa pesquisa sobre <a target=\"_blank\" href=\"https:\/\/www.ungeneva.org\/sites\/default\/files\/2021-01\/Disability-Inclusive-Language-Guidelines.pdf\" rel=\"noopener\">linguagem inclusiva para pessoas com defici\u00eancia<\/a> para nossos artigos. Lembre-se de utilizar seus recursos ao criar conte\u00fado acess\u00edvel e, em caso de d\u00favida, sempre pergunte.&nbsp;<\/p>\n\n\n\n<p>\n\n\n<div\n\tclass=\"article-cta-shared article-cta-small\"\n>\n    <div class=\"tr-img-wrap-outer jsLoading\"><img decoding=\"async\" class=\"js-img-lazy \" src=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/lazy-loading-transparent.webp\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder.webp 1x, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder-x2.webp 2x\"  alt=\"Ad background image\" \/><\/div>\n\n\n\n\n  <div class=\"content-btm\">\n    <h2\n      class=\"h2--md\"\n    >\n      Voc\u00ea Sonha, N\u00f3s Codificamos\n    <\/h2>\n    <p\n      class=\"p--md\"\n    >\n      Aproveite mais de 20 anos de experi\u00eancia em programa\u00e7\u00e3o quando optar pelo nosso servi\u00e7o de Desenvolvimento Web. Basta nos informar o que voc\u00ea deseja para o seu site \u2014 n\u00f3s cuidamos do resto.\n    <\/p>\n\n            <a\n            href=\"https:\/\/www.dreamhost.com\/pt\/servicos-profissionais\/desenvolvimento\/\"\n                        class=\"btn btn--white-outline btn--sm btn--round\"\n                                    target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            >\n                            Saiba Mais                    <\/a>\n\n  <\/div>\n<\/div>\n<\/p>\n\n\n\n\n\n\n","protected":false},"excerpt":{"rendered":"<p>Quer que seu site seja acess\u00edvel e tamb\u00e9m bem projetado? Aprenda as melhores pr\u00e1ticas e acenda sua criatividade com estes 12 exemplos de acessibilidade de sites.<\/p>\n","protected":false},"author":1058,"featured_media":45646,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_yoast_wpseo_metadesc":"","toc_headlines":"[[\"looks\",\"Como \u00e9 uma \u00d3tima Acessibilidade na Web\"],[\"examples\",\"12 \u00d3timos Exemplos de Acessibilidade na Web Para Inspirar Voc\u00ea\"],[\"statement\",\"Fa\u00e7a uma Declara\u00e7\u00e3o de Acessibilidade\"]]","hide_toc":false,"footnotes":""},"categories":[14407],"tags":[],"class_list":["post-57018","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design-de-sites-pt"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.3 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es - DreamHost Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es\" \/>\n<meta property=\"og:description\" content=\"Quer que seu site seja acess\u00edvel e tamb\u00e9m bem projetado? Aprenda as melhores pr\u00e1ticas e acenda sua criatividade com estes 12 exemplos de acessibilidade de sites.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/\" \/>\n<meta property=\"og:site_name\" content=\"DreamHost Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/DreamHost\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-05-20T08:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-05-26T19:43:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/1460x1095_blog_hero_12_outstanding_accessible_website_examples_that_raise_the_bar.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"1095\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"Ian Hernandez\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:site\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ian Hernandez\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es - DreamHost Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/","og_locale":"en_US","og_type":"article","og_title":"12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es","og_description":"Quer que seu site seja acess\u00edvel e tamb\u00e9m bem projetado? Aprenda as melhores pr\u00e1ticas e acenda sua criatividade com estes 12 exemplos de acessibilidade de sites.","og_url":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/","og_site_name":"DreamHost Blog","article_publisher":"https:\/\/www.facebook.com\/DreamHost\/","article_published_time":"2024-05-20T08:00:00+00:00","article_modified_time":"2025-05-26T19:43:03+00:00","og_image":[{"width":1460,"height":1095,"url":"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/1460x1095_blog_hero_12_outstanding_accessible_website_examples_that_raise_the_bar.webp","type":"image\/webp"}],"author":"Ian Hernandez","twitter_card":"summary_large_image","twitter_creator":"@dreamhost","twitter_site":"@dreamhost","twitter_misc":{"Written by":"Ian Hernandez","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/#article","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/"},"author":{"name":"Ian Hernandez","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/220faf2464d5ae08e41cf5f3b28fdc96"},"headline":"12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es","datePublished":"2024-05-20T08:00:00+00:00","dateModified":"2025-05-26T19:43:03+00:00","mainEntityOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/"},"wordCount":2404,"publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/1460x1095_blog_hero_12_outstanding_accessible_website_examples_that_raise_the_bar.webp","articleSection":["Design de Sites"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/","url":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/","name":"12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es - DreamHost Blog","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/#primaryimage"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/1460x1095_blog_hero_12_outstanding_accessible_website_examples_that_raise_the_bar.webp","datePublished":"2024-05-20T08:00:00+00:00","dateModified":"2025-05-26T19:43:03+00:00","breadcrumb":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/#primaryimage","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/1460x1095_blog_hero_12_outstanding_accessible_website_examples_that_raise_the_bar.webp","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/05\/1460x1095_blog_hero_12_outstanding_accessible_website_examples_that_raise_the_bar.webp","width":1460,"height":1095,"caption":"12 Outstanding Accessible Website Examples That Raise The Bar"},{"@type":"BreadcrumbList","@id":"https:\/\/www-dev.dreamhost.com\/blog\/pt\/otimos-exemplos-de-acessibilidade-na-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/dhblog.dream.press\/blog\/"},{"@type":"ListItem","position":2,"name":"12 Exemplos de Sites Acess\u00edveis que Elevam os Padr\u00f5es"}]},{"@type":"WebSite","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website","url":"https:\/\/www-dev.dreamhost.com\/blog\/","name":"DreamHost Blog","description":"","publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www-dev.dreamhost.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization","name":"DreamHost","url":"https:\/\/www-dev.dreamhost.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","contentUrl":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","width":1200,"height":168,"caption":"DreamHost"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/DreamHost\/","https:\/\/x.com\/dreamhost","https:\/\/www.instagram.com\/dreamhost\/","https:\/\/www.linkedin.com\/company\/dreamhost\/","https:\/\/www.youtube.com\/user\/dreamhostusa"]},{"@type":"Person","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/220faf2464d5ae08e41cf5f3b28fdc96","name":"Ian Hernandez","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/04\/ian-hernandez-dreamhost-150x150.png","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/04\/ian-hernandez-dreamhost-150x150.png","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/04\/ian-hernandez-dreamhost-150x150.png","caption":"Ian Hernandez"},"description":"Ian is a Product Designer based in Los Angeles, California. He is responsible for driving brand and product design at DreamHost, developing and maintaining our internal design system, and writing frontend code when he can. In his free time, he enjoys walking his dog, learning history, and discovering new music online and irl. Connect with him on LinkedIn: https:\/\/www.linkedin.com\/in\/ianhernandez23\/","url":"https:\/\/www-dev.dreamhost.com\/blog\/author\/ianh\/"}]}},"lang":"pt","translations":{"pt":57018,"en":45645,"pl":57015,"de":57012,"es":57008,"uk":57024,"ru":57039,"it":68611,"fr":70800,"nl":70830},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/57018","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/users\/1058"}],"replies":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/comments?post=57018"}],"version-history":[{"count":5,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/57018\/revisions"}],"predecessor-version":[{"id":63820,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/57018\/revisions\/63820"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media\/45646"}],"wp:attachment":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media?parent=57018"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/categories?post=57018"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/tags?post=57018"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}