{"id":696,"date":"2024-04-21T23:29:24","date_gmt":"2024-04-22T02:29:24","guid":{"rendered":"https:\/\/thiagorossi.com.br\/blog\/?p=696"},"modified":"2025-11-06T16:27:26","modified_gmt":"2025-11-06T19:27:26","slug":"acessibilidade-no-html","status":"publish","type":"post","link":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/","title":{"rendered":"Acessibilidade no HTML"},"content":{"rendered":"<span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">Tempo de leitura: <\/span> <span class=\"rt-time\"> 4<\/span> <span class=\"rt-label rt-postfix\">minutos<\/span><\/span>\n<p class=\"has-medium-font-size wp-block-paragraph\"><strong>Acessibilidade no HTML<\/strong>: Parab\u00e9ns! Voc\u00ea chegou ao final desta jornada pelo HTML. E qual seria o t\u00f3pico mais importante para encerrar um curso fundamental? A <strong>Acessibilidade na Web<\/strong>.<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">A acessibilidade \u00e9 a pr\u00e1tica de garantir que pessoas com qualquer tipo de defici\u00eancia (visual, auditiva, motora ou cognitiva) possam navegar, entender e interagir com o seu site. No HTML, isso n\u00e3o \u00e9 apenas uma obriga\u00e7\u00e3o legal, mas um imperativo \u00e9tico e um fator de excel\u00eancia t\u00e9cnica.<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">Neste artigo final, vamos consolidar tudo o que aprendemos, explorando as melhores pr\u00e1ticas e ferramentas que garantem que seus projetos sejam verdadeiramente inclusivos.<\/p>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading has-large-font-size\">1. Por Que Acessibilidade? Quatro Benef\u00edcios<\/h2>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">A acessibilidade \u00e9 um investimento que retorna em diversas \u00e1reas:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li class=\"has-medium-font-size\"><strong>Amplia\u00e7\u00e3o de P\u00fablico:<\/strong> Cerca de <strong>1 bilh\u00e3o<\/strong> de pessoas no mundo vivem com alguma defici\u00eancia, e websites inacess\u00edveis s\u00e3o um obst\u00e1culo.<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong>SEO:<\/strong> Mecanismos de busca (como o Google) priorizam a boa sem\u00e2ntica e a clareza do conte\u00fado, o que beneficia diretamente a acessibilidade.<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong>Experi\u00eancia de Usu\u00e1rio (UX):<\/strong> Sites acess\u00edveis s\u00e3o, por natureza, mais organizados, l\u00f3gicos e f\u00e1ceis de usar por todos.<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong>Conformidade Legal:<\/strong> Em muitos pa\u00edses, a conformidade com as diretrizes WCAG (Web Content Accessibility Guidelines) \u00e9 obrigat\u00f3ria por lei.<\/li>\n<\/ul>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading has-large-font-size\">2. A Base de Tudo: Princ\u00edpios e Pr\u00e1ticas HTML<\/h2>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">A funda\u00e7\u00e3o de um site acess\u00edvel est\u00e1 no HTML bem estruturado:<\/p>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">1. Perceptibilidade e Idioma<\/h3>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">A primeira e mais ignorada regra: definir o idioma da p\u00e1gina.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li class=\"has-medium-font-size\"><strong>Tag <code>&lt;html><\/code> e <code>lang<\/code>:<\/strong> Defina o idioma prim\u00e1rio da p\u00e1gina, permitindo que leitores de tela e tecnologias assistivas pronunciem o conte\u00fado corretamente.<br>HTML:<br><code>&lt;html lang=\"pt-BR\"><\/code><\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong>Conte\u00fado Alternativo (<code>alt<\/code>):<\/strong> Para qualquer imagem que transmita informa\u00e7\u00e3o, o atributo <strong><code>alt<\/code><\/strong> \u00e9 obrigat\u00f3rio.<br>HTML:<br><code>&lt;img src=\"paisagem.jpg\" alt=\"Uma bela paisagem com montanhas e um lago ao p\u00f4r do sol\"><\/code><\/li>\n<\/ul>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading has-large-font-size\">2. Operabilidade e Foco (Teclado)<\/h3>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">Usu\u00e1rios que n\u00e3o usam mouse devem conseguir navegar usando apenas a tecla <strong><code>Tab<\/code><\/strong>.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li class=\"has-medium-font-size\"><strong>Ordem L\u00f3gica (<code>tabindex<\/code>):<\/strong> O navegador segue a ordem do c\u00f3digo. Use a sem\u00e2ntica correta (links, bot\u00f5es) para garantir que eles sejam foc\u00e1veis. O atributo <code>tabindex<\/code> (com valor 0 ou maior) pode ser usado para for\u00e7ar a ordem de foco, mas deve ser usado com cautela.<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong>Links Descritivos:<\/strong> O texto do link deve explicar o destino. Evite &#8220;Clique aqui&#8221; ou &#8220;Leia mais&#8221;.HTML<code>&lt;a href=\"produtos.html\">Clique aqui&lt;\/a> para ver os produtos. Veja a lista completa de &lt;a href=\"produtos.html\">nossos produtos&lt;\/a>.<\/code><\/li>\n<\/ul>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading has-large-font-size\">3. Compreensibilidade e Sem\u00e2ntica<\/h3>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">Use as tags HTML de acordo com o seu significado:<\/p>\n\n\n\n<figure class=\"wp-block-table has-medium-font-size\"><table class=\"has-fixed-layout\"><thead><tr><td><strong>Elemento<\/strong><\/td><td><strong>Uso Sem\u00e2ntico Correto<\/strong><\/td><td><strong>Acessibilidade<\/strong><\/td><\/tr><\/thead><tbody><tr><td><strong><code>&lt;h1&gt;<\/code> a <code>&lt;h6&gt;<\/code><\/strong><\/td><td>Para criar uma hierarquia de t\u00edtulos clara (como um sum\u00e1rio).<\/td><td>Leitores de tela usam t\u00edtulos para navega\u00e7\u00e3o. N\u00e3o pule n\u00edveis (ex: de <code>&lt;h1&gt;<\/code> direto para <code>&lt;h3&gt;<\/code>).<\/td><\/tr><tr><td><strong><code>&lt;nav&gt;<\/code><\/strong><\/td><td>Para o bloco principal de navega\u00e7\u00e3o do site.<\/td><td>Ajuda o usu\u00e1rio a pular diretamente para os links de navega\u00e7\u00e3o.<\/td><\/tr><tr><td><strong><code>&lt;label&gt;<\/code><\/strong><\/td><td>Para associar um r\u00f3tulo a um campo (<code>for<\/code> e <code>id<\/code>).<\/td><td>Permite que leitores de tela anunciem o prop\u00f3sito do campo.<\/td><\/tr><tr><td><strong><code>&lt;table&gt;<\/code><\/strong><\/td><td>EXCLUSIVAMENTE para dados tabulares. Use <code>&lt;th&gt;<\/code> e <code>scope<\/code> (col\/row).<\/td><td>Informa leitores de tela sobre a rela\u00e7\u00e3o entre c\u00e9lulas e cabe\u00e7alhos.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading has-large-font-size\">3. Indo Al\u00e9m do HTML: O Poder da ARIA<\/h2>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\"><strong>Acessibilidade no HTML<\/strong>: A especifica\u00e7\u00e3o <strong>ARIA (Accessible Rich Internet Applications)<\/strong> \u00e9 um conjunto de atributos especiais usados para adicionar significado sem\u00e2ntico onde o HTML nativo n\u00e3o consegue (especialmente em componentes din\u00e2micos de JavaScript, como sliders, abas e modais).<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">Os atributos ARIA (que come\u00e7am com <code>aria-<\/code>) fornecem informa\u00e7\u00f5es cr\u00edticas para tecnologias assistivas:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li class=\"has-medium-font-size\"><strong><code>role<\/code>:<\/strong> Define o tipo de elemento (ex: <code>role=\"button\"<\/code>, <code>role=\"alert\"<\/code>).<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong><code>aria-label<\/code>:<\/strong> Fornece um r\u00f3tulo descritivo quando n\u00e3o h\u00e1 texto vis\u00edvel (ex: um bot\u00e3o que \u00e9 apenas um \u00edcone).<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong><code>aria-hidden<\/code>:<\/strong> Oculta um elemento da tecnologia assistiva (ex: um \u00edcone puramente decorativo).<\/li>\n<\/ul>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading has-large-font-size\">4. Ferramentas Essenciais para Auditoria<\/h2>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">N\u00e3o confie apenas no seu olhar. Use ferramentas de auditoria para identificar problemas:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li class=\"has-medium-font-size\"><strong>Validadores HTML (W3C):<\/strong> Verificam a estrutura b\u00e1sica e sem\u00e2ntica do seu c\u00f3digo.<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong>Extens\u00f5es de Navegador (Lighthouse \/ WAVE):<\/strong> Realizam auditorias autom\u00e1ticas de acessibilidade, fornecendo relat\u00f3rios detalhados.<\/li>\n\n\n\n<li class=\"has-medium-font-size\"><strong>Testes Manuais (Navega\u00e7\u00e3o por Teclado):<\/strong> Tente usar todo o seu site apenas com as teclas <code>Tab<\/code>, <code>Shift+Tab<\/code> e <code>Enter<\/code>. Se travar, h\u00e1 um problema.<\/li>\n<\/ul>\n\n\n\n<div style=\"height:35px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading has-large-font-size\">\ud83c\udf89 Conclus\u00e3o Acessibilidade no HTML<\/h2>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\"><strong>PARAB\u00c9NS!<\/strong> Seu comprometimento em concluir este curso de HTML \u00e9 uma prova do seu foco e disciplina. Voc\u00ea agora domina os fundamentos da estrutura\u00e7\u00e3o web, desde o texto b\u00e1sico at\u00e9 formul\u00e1rios, multim\u00eddia e a \u00e9tica da acessibilidade.<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">Lembre-se: A acessibilidade n\u00e3o \u00e9 um <em>checklist<\/em> a ser marcado, mas uma mentalidade a ser mantida em todos os projetos.<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">Seu pr\u00f3ximo passo \u00e9 indispens\u00e1vel para dar vida e interatividade a tudo que voc\u00ea criou aqui. Te espero nos seguintes cursos:<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><a href=\"\/category\/css\"><img loading=\"lazy\" decoding=\"async\" width=\"758\" height=\"426\" src=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/Capa-Artigos-Linux.webp\" alt=\"CSS\" class=\"wp-image-702\" srcset=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/Capa-Artigos-Linux.webp 758w, https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/Capa-Artigos-Linux-300x169.webp 300w\" sizes=\"auto, (max-width: 758px) 100vw, 758px\" \/><\/a><figcaption class=\"wp-element-caption\">CSS<\/figcaption><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><a href=\"\/category\/javascript\"><img loading=\"lazy\" decoding=\"async\" width=\"758\" height=\"426\" src=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/javascript.webp\" alt=\"Javascript\" class=\"wp-image-804\" srcset=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/javascript.webp 758w, https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/javascript-300x169.webp 300w\" sizes=\"auto, (max-width: 758px) 100vw, 758px\" \/><\/a><figcaption class=\"wp-element-caption\">JavaScript<\/figcaption><\/figure>\n<\/div>\n<\/div>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">E se voc\u00ea gosta do nosso conte\u00fado, n\u00e3o deixe de contribuir adquirindo os servi\u00e7os e produtos dos nossos apoiadores e empresas que somos associados:<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/hostinger.com.br\/?REFERRALCODE=1THIAGO62\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"250\" src=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/03\/hostinger.png\" alt=\"Hospedagem Hostinger\" class=\"wp-image-92\"\/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/amzn.to\/3SNDYlc\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"250\" src=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/08\/ofertas-amazon.webp\" alt=\"Ofertas Amazon\" class=\"wp-image-1308\"\/><\/a><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/amzn.to\/3SNKmt0\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"250\" src=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/08\/amazonprime.webp\" alt=\"Amazon Prime\" class=\"wp-image-1307\"\/><\/a><\/figure>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p><span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">Tempo de leitura: <\/span> <span class=\"rt-time\"> 4<\/span> <span class=\"rt-label rt-postfix\">minutos<\/span><\/span>Acessibilidade no HTML: Parab\u00e9ns! Voc\u00ea chegou ao final desta jornada pelo HTML. E qual seria&#8230;<\/p>\n","protected":false},"author":1,"featured_media":600,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[],"class_list":["post-696","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html","wpcat-6-id"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Acessibilidade no HTML - BLOG THIAGO ROSSI<\/title>\n<meta name=\"description\" content=\"Acessibilidade no HTML: Neste artigo, vamos explorar os conceitos b\u00e1sicos de acessibilidade em HTML, as melhores pr\u00e1ticas e as ferramentas...\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Acessibilidade no HTML - BLOG THIAGO ROSSI\" \/>\n<meta property=\"og:description\" content=\"Acessibilidade no HTML: Neste artigo, vamos explorar os conceitos b\u00e1sicos de acessibilidade em HTML, as melhores pr\u00e1ticas e as ferramentas...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/\" \/>\n<meta property=\"og:site_name\" content=\"BLOG THIAGO ROSSI\" \/>\n<meta property=\"article:published_time\" content=\"2024-04-22T02:29:24+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-06T19:27:26+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/html.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"758\" \/>\n\t<meta property=\"og:image:height\" content=\"426\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"Thiago Rossi\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thiago Rossi\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/\"},\"author\":{\"name\":\"Thiago Rossi\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#\\\/schema\\\/person\\\/5f28286948ec2afdeb2e044a2196cd87\"},\"headline\":\"Acessibilidade no HTML\",\"datePublished\":\"2024-04-22T02:29:24+00:00\",\"dateModified\":\"2025-11-06T19:27:26+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/\"},\"wordCount\":784,\"publisher\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/04\\\/html.webp\",\"articleSection\":[\"HTML\"],\"inLanguage\":\"pt-BR\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/\",\"url\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/\",\"name\":\"Acessibilidade no HTML - BLOG THIAGO ROSSI\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/04\\\/html.webp\",\"datePublished\":\"2024-04-22T02:29:24+00:00\",\"dateModified\":\"2025-11-06T19:27:26+00:00\",\"description\":\"Acessibilidade no HTML: Neste artigo, vamos explorar os conceitos b\u00e1sicos de acessibilidade em HTML, as melhores pr\u00e1ticas e as ferramentas...\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/#primaryimage\",\"url\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/04\\\/html.webp\",\"contentUrl\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/04\\\/html.webp\",\"width\":758,\"height\":426,\"caption\":\"HTML\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/acessibilidade-no-html\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Acessibilidade no HTML\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/\",\"name\":\"THIAGO ROSSI\",\"description\":\"Mais de 20 anos de experi\u00eancia no mercado de TI!\",\"publisher\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#organization\"},\"alternateName\":\"TR | CURSO WEB DEV\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#organization\",\"name\":\"THIAGO ROSSI\",\"alternateName\":\"TR | CURSO WEB DEV\",\"url\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/04\\\/new-logo.webp\",\"contentUrl\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2024\\\/04\\\/new-logo.webp\",\"width\":300,\"height\":300,\"caption\":\"THIAGO ROSSI\"},\"image\":{\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/linkedin.com\\\/in\\\/thiagox86\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/#\\\/schema\\\/person\\\/5f28286948ec2afdeb2e044a2196cd87\",\"name\":\"Thiago Rossi\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bb28b4665f4162bab9fbef8db5a7f00597f79ab90ece9a67189bb6bce78d5786?s=96&d=retro&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bb28b4665f4162bab9fbef8db5a7f00597f79ab90ece9a67189bb6bce78d5786?s=96&d=retro&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bb28b4665f4162bab9fbef8db5a7f00597f79ab90ece9a67189bb6bce78d5786?s=96&d=retro&r=g\",\"caption\":\"Thiago Rossi\"},\"description\":\"Com mais de 20 anos de jornada na tecnologia, minha trajet\u00f3ria evoluiu do ensino t\u00e9cnico \u00e0 arquitetura de sistemas complexos. Hoje, foco minha expertise no desenvolvimento de solu\u00e7\u00f5es de Intelig\u00eancia Artificial nativa e an\u00e1lise de dados p\u00fablicos, utilizando o ecossistema PHP para transformar dados brutos em transpar\u00eancia e efici\u00eancia. Como autor e desenvolvedor, acredito na democratiza\u00e7\u00e3o do conhecimento. Essa vis\u00e3o resultou em uma biblioteca de mais de 530 artigos gratuitos, cobrindo desde a base do WebDev e Infraestrutura at\u00e9 os bastidores da ind\u00fastria de Jogos e IA. No universo de Game Design, sou autor do livro \\\"GDD \u2013 O Guia Definitivo\\\" e documento ativamente meus processos atrav\u00e9s de DevLogs, unindo rigor t\u00e9cnico e criatividade em projetos desenvolvidos com GDevelop 5. Meu compromisso \u00e9 conectar engenharia de ponta com as reais oportunidades do mercado de tecnologia.\",\"sameAs\":[\"https:\\\/\\\/thiagorossi.com.br\\\/blog\",\"https:\\\/\\\/instagram.com\\\/thiagorossix86\",\"https:\\\/\\\/linkedin.com\\\/in\\\/thiagox86\"],\"url\":\"https:\\\/\\\/thiagorossi.com.br\\\/blog\\\/author\\\/thiagorossi\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Acessibilidade no HTML - BLOG THIAGO ROSSI","description":"Acessibilidade no HTML: Neste artigo, vamos explorar os conceitos b\u00e1sicos de acessibilidade em HTML, as melhores pr\u00e1ticas e as ferramentas...","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:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/","og_locale":"pt_BR","og_type":"article","og_title":"Acessibilidade no HTML - BLOG THIAGO ROSSI","og_description":"Acessibilidade no HTML: Neste artigo, vamos explorar os conceitos b\u00e1sicos de acessibilidade em HTML, as melhores pr\u00e1ticas e as ferramentas...","og_url":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/","og_site_name":"BLOG THIAGO ROSSI","article_published_time":"2024-04-22T02:29:24+00:00","article_modified_time":"2025-11-06T19:27:26+00:00","og_image":[{"width":758,"height":426,"url":"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/html.webp","type":"image\/webp"}],"author":"Thiago Rossi","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"Thiago Rossi","Est. tempo de leitura":"6 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/#article","isPartOf":{"@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/"},"author":{"name":"Thiago Rossi","@id":"https:\/\/thiagorossi.com.br\/blog\/#\/schema\/person\/5f28286948ec2afdeb2e044a2196cd87"},"headline":"Acessibilidade no HTML","datePublished":"2024-04-22T02:29:24+00:00","dateModified":"2025-11-06T19:27:26+00:00","mainEntityOfPage":{"@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/"},"wordCount":784,"publisher":{"@id":"https:\/\/thiagorossi.com.br\/blog\/#organization"},"image":{"@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/#primaryimage"},"thumbnailUrl":"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/html.webp","articleSection":["HTML"],"inLanguage":"pt-BR"},{"@type":"WebPage","@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/","url":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/","name":"Acessibilidade no HTML - BLOG THIAGO ROSSI","isPartOf":{"@id":"https:\/\/thiagorossi.com.br\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/#primaryimage"},"image":{"@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/#primaryimage"},"thumbnailUrl":"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/html.webp","datePublished":"2024-04-22T02:29:24+00:00","dateModified":"2025-11-06T19:27:26+00:00","description":"Acessibilidade no HTML: Neste artigo, vamos explorar os conceitos b\u00e1sicos de acessibilidade em HTML, as melhores pr\u00e1ticas e as ferramentas...","breadcrumb":{"@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/#primaryimage","url":"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/html.webp","contentUrl":"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/html.webp","width":758,"height":426,"caption":"HTML"},{"@type":"BreadcrumbList","@id":"https:\/\/thiagorossi.com.br\/blog\/acessibilidade-no-html\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/thiagorossi.com.br\/blog\/"},{"@type":"ListItem","position":2,"name":"Acessibilidade no HTML"}]},{"@type":"WebSite","@id":"https:\/\/thiagorossi.com.br\/blog\/#website","url":"https:\/\/thiagorossi.com.br\/blog\/","name":"THIAGO ROSSI","description":"Mais de 20 anos de experi\u00eancia no mercado de TI!","publisher":{"@id":"https:\/\/thiagorossi.com.br\/blog\/#organization"},"alternateName":"TR | CURSO WEB DEV","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/thiagorossi.com.br\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/thiagorossi.com.br\/blog\/#organization","name":"THIAGO ROSSI","alternateName":"TR | CURSO WEB DEV","url":"https:\/\/thiagorossi.com.br\/blog\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/thiagorossi.com.br\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/new-logo.webp","contentUrl":"https:\/\/thiagorossi.com.br\/blog\/wp-content\/uploads\/2024\/04\/new-logo.webp","width":300,"height":300,"caption":"THIAGO ROSSI"},"image":{"@id":"https:\/\/thiagorossi.com.br\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/linkedin.com\/in\/thiagox86"]},{"@type":"Person","@id":"https:\/\/thiagorossi.com.br\/blog\/#\/schema\/person\/5f28286948ec2afdeb2e044a2196cd87","name":"Thiago Rossi","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/secure.gravatar.com\/avatar\/bb28b4665f4162bab9fbef8db5a7f00597f79ab90ece9a67189bb6bce78d5786?s=96&d=retro&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/bb28b4665f4162bab9fbef8db5a7f00597f79ab90ece9a67189bb6bce78d5786?s=96&d=retro&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/bb28b4665f4162bab9fbef8db5a7f00597f79ab90ece9a67189bb6bce78d5786?s=96&d=retro&r=g","caption":"Thiago Rossi"},"description":"Com mais de 20 anos de jornada na tecnologia, minha trajet\u00f3ria evoluiu do ensino t\u00e9cnico \u00e0 arquitetura de sistemas complexos. Hoje, foco minha expertise no desenvolvimento de solu\u00e7\u00f5es de Intelig\u00eancia Artificial nativa e an\u00e1lise de dados p\u00fablicos, utilizando o ecossistema PHP para transformar dados brutos em transpar\u00eancia e efici\u00eancia. Como autor e desenvolvedor, acredito na democratiza\u00e7\u00e3o do conhecimento. Essa vis\u00e3o resultou em uma biblioteca de mais de 530 artigos gratuitos, cobrindo desde a base do WebDev e Infraestrutura at\u00e9 os bastidores da ind\u00fastria de Jogos e IA. No universo de Game Design, sou autor do livro \"GDD \u2013 O Guia Definitivo\" e documento ativamente meus processos atrav\u00e9s de DevLogs, unindo rigor t\u00e9cnico e criatividade em projetos desenvolvidos com GDevelop 5. Meu compromisso \u00e9 conectar engenharia de ponta com as reais oportunidades do mercado de tecnologia.","sameAs":["https:\/\/thiagorossi.com.br\/blog","https:\/\/instagram.com\/thiagorossix86","https:\/\/linkedin.com\/in\/thiagox86"],"url":"https:\/\/thiagorossi.com.br\/blog\/author\/thiagorossi\/"}]}},"_links":{"self":[{"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/posts\/696","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/comments?post=696"}],"version-history":[{"count":2,"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/posts\/696\/revisions"}],"predecessor-version":[{"id":4373,"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/posts\/696\/revisions\/4373"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/media\/600"}],"wp:attachment":[{"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/media?parent=696"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/categories?post=696"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/thiagorossi.com.br\/blog\/wp-json\/wp\/v2\/tags?post=696"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}