Acessibilidade

12 nov, 2014

Dica de acessibilidade: atributos Alt vazios

Publicidade

Como um desenvolvedor quase autodidata, minhas impressões sobre boas práticas foram formadas por mim mesmo, e ao longo dos anos eu percebi que elas estavam incorretas ou que os padrões associados a elas tinham mudado rapidamente. Uma prática pequena, mas importante, é o uso de atributos alt em tags img, então pensei que era preciso configurar atributos alt em todas as imagens em uma página. Mal sabia eu que não era o caso.

<!-- BAD: image URL will be read out -->
<img src="/wp-content/themes/punky/images/logo.png">

<!-- BAD: adding useless cruft alt -->
<img src="/wp-content/themes/punky/images/logo.png" alt="Logo">

<!-- GOOD: empty alt is silent -->
<img src="/wp-content/themes/punky/images/logo.png" alt="">

Imagens com valor ou apelo apenas visual devem ter um atributo alt vazio. Ao omitir o atributo, você permite que a maioria dos leitores de tela leia toda a URL da imagem, e colocar um atributo alt quando a imagem é apenas decorativa também é desnecessário.

Você não pode culpar os jovens desenvolvedores por não saberem isso ou qualquer outro assunto relacionado a acessibilidade – acessibilidade (e usabilidade também) não é ensinada na maioria das faculdades. E sejamos honestos, a maioria dos desenvolvedores fica animada quando as coisas funcionam, e acessibilidade e usabilidade acabam sendo apenas bônus.

Bom, agora você tem uma razão para usar atributos alt da forma correta!

***

Artigo traduzido pela Redação iMasters com autorização do autor. Publicado originalmente em http://davidwalsh.name/accessibility-tip-empty-alt-attributes