Alt e Lang: atributos essenciais para acessibilidade e em
•
2 gostaram•209 visualizações
Apresentação sobre os recursos e vantagens de dois atributos do HTML: Os atributos ALT e Lang
Recomendados
Recomendados
Mais conteúdo relacionado
Mais de Centro Web
Mais de Centro Web (20)
Alt e Lang: atributos essenciais para acessibilidade e em
- 1. Alt e Lang Dois atributos da pesada Alt e Lang Dois atributos da pesada Reinaldo Ferraz L Classificação indicativa Livre para todos os públicos desenvolvedores Web
- 5. <img src=“#” alt=“Foto do Reinaldo Ferraz”> <html lang=“pt-BR”>
- 7. alt
- 8. alt https://www.w3.org/TR/html5/embedded-content-0.html#alt O atributo “alt” em imagens é um atributo muito importante para acessibilidade. Criação de conteúdo útil para o atributo “alt” requer considerar cuidadosamente o contexto em que a imagem é exibida e a função que a imagem pode ter nesse contexto.
- 11. acessibilidade
- 12. <img src="foto.jpg" alt=“Foto das teclas W, 3 e C fora do teclado" /> <img src=“foto.jph” alt="Foto das teclas W, 3 e C fora do teclado" />
- 13. <img data-aria-label-part src=”https://pbs.twimg.com/media/CewYhp4W4AAoLbv.jpg” alt=”Foto de um bonsai sobre uma superfície de madeira” style=”width: 100%; top: -0px;”>
- 14. acessibilidade
- 16. <img src="http://www.reinaldoferraz.com.br/wp- content/uploads/2014/02/tr47ujhtt767.png" alt="Foto de um pão francês em um prato branco" title="A foto do pão é a primeira a utilizar o atributo title nesse post“> <img src="http://www.reinaldoferraz.com.br/wp- content/uploads/2014/02/aswe98jdk93.png" alt="Foto de uma ampulheta" title="A foto da ampulheta é de autoria de Reinaldo Ferraz"> <img src="http://www.reinaldoferraz.com.br/wp- content/uploads/2014/02/yjjl9675yp.png" alt="Foto de uma placa com o mapa do zoológico de São Paulo" title="Crédito desta foto: Reinaldo Ferraz">
- 17. Pesquisa em Março de 2014
- 19. Google Yahoo Bing Duck Duck Go ALT Sim Não Não Não TITLE Não Não Não Não
- 20. https://www.site-analyzer.com/ https://www.woorank.com/pt http://www.seoworkers.com/ Pesquisa em Março de 2014
- 27. Site Analyzer Woorank SEO Workers ALT Sim Sim Sim TITLE Não Não Não
- 28. <p>A imagem abaixo é a foto de um rádio relógio cinza.</p> <p>A imagem acima é uma foto de um despertador digital.</p> <img src="http://www.reinaldoferraz.com.br/wp- content/uploads/2014/02/2016-02-19-17.51.23.jpg" alt="" >
- 32. lang
- 33. lang https://www.w3.org/TR/html5/dom.html#attr-lang O atributo lang especifica o idioma primário para o conteúdo do elemento e para qualquer um dos atributos do elemento que contêm texto.
- 35. <html lang=”pt-BR”> ..... <p>O texto da página está em português <span lang=”en”>and in english</span>. </p>
- 39. acessibilidade
- 40. styling
- 41. body { font-family: "Times New Roman", Times, serif; } :lang(ar) { font-family: "Traditional Arabic", "Al Bayan", serif; }
- 45. Ortografia
- 46. p { hyphens: auto;} <p>Este é um texto sobre ontologia</p> <p lang="pt-br"> Este é um texto sobre ontologia</p>
- 47. Resumindo:
- 48. Utilize os atributos ALT e LANG em seu projeto