Bruno Pulis
Bruno Pulis QA por profissão, apaixonado por web standards, evangelista de acessibilidade digital.

Dica: Font Awesome do jeito certo

👉 Como usamos

Geralmente usamos o Font Awesome assim em nossos projetos:

1
<i class="fas fa-camera"></i>

Semanticamente a marcação está incorreta, a especificação da tag i, diz:

O elemento HTML <i> representa uma parte do texto que é destacada do restante por algum motivo, por exemplo, termos técnicos, expressões de outros idiomas ou pensamentos de personagens fictícios. Normalmente, é apresentado com o uso do tipo “itálico”.

Fonte: MDN

💡 Do jeito certo

A forma semântica é usando a tag <span>, atrelada a um atributo aria o aria-hidden=true. Dessa forma o elemento fica “oculto” para tecnologias assistivas, como um leitor de telas.

1
<span class="fas fa-camera" aria-hidden="true"></span>

comments powered by Disqus