HTML 5.3: O que existe além de a11y e SEO?

Transcript

1. afonsopacifer.github.io HTML 5 O que existe além de A11y e SEO? .3 1
2. Afonso Pacifer @afonsopacifer afonsopacifer.github.io DevRel & Front-End Specialist 2
3. Como está o HTML? O que tem de novo ? 3
4. Lek, 4
5. O Básico HTML === Semântica? 5
6. fi Semântica https://pt.wikipedia.org/wiki/Semântica Foi explicado brilhantemente pelo Moreno na ultima Talk <3 6
7. Importa Para quem? 7
8. Existe diferença Div X Button? 8
9. Live Code https://codepen.io/afonsopacifer/pen/BaPmKXr • Aparência • UI feedbacks (Hover, Active, etc…) • Acessível via teclado (tabIndex) •Leitor de tela (Wai-Aria) •Evento click mapeado para teclado 9
10. Acessibilidade Foi explicado brilhantemente pela Amanda na primeira Talk <3 10
11. Sobre empatia A hora de criar um componente que não existe no HTML 11
12. Voltando… 12
13. HTML 5.1 voltando para 2016 13
14. A tag dialog https://afonsopacifer.github.io/talks 14
15. https://codepen.io/afonsopacifer/pen/zYLPBRB <dialog > HTML SP </dialog> open <button> Dialog </button> const btn = document.querySelector('button'); const dialog = document.querySelector('dialog'); btn.addEventListener('click', () => { }) dialog.showModal(); 15
16. HTML Ou Javascript dialog.showModal(); 16
17. Voltando… 17
18. O que realmente vale a pena 18
19. HTML 5 voltando para 2014 19
20. WHATWG X W3C A treta do HTML 5 VS XHTML 20
21. https://www.w3.org/html/logo/ • SEMANTICS •OFFLINE & STORAGE •DEVICE ACCESS •CONNECTIVITY •MULTIMEDIA •3D, GRAPHICS & EFFECTS •PERFORMANCE & INTEGRATION •CSS3 HTML 5 Classes 21
22. https://codepen.io/afonsopacifer/pen/xxJPKab CONNECTIVITY DEMO navigator.getGamepads() 22
23. (WEB APIS) HTML Ou Javascript TC39 W3C 23
24. Avançando… 24
25. https://www.w3.org/html/ Acordo em 2019 25
26. https://www.w3.org/TR/2021/NOTE-html53-20210128/ HTML 5.3 2021 26
27. https://html.spec.whatwg.org/multipage/introduction.html HTML 2023 27
28. https://github.com/whatwg/html Contribua 28
29. Descubra por você kkkJ O que existe além de A11y e SEO? 29
30. @afonsopacifer Obrigado HTML SP afonsopacifer.github.io 30