How To Make Loveliness: an HTML treasure hunt
summary
Shows how using picture element for WebP-first responsive images, label wrapping input for checkbox hit targets, and schema.org microdata (article/itemprop) yields concrete wins: Eventbrite reports 100% organic traffic lift, Jobrapido 115% and 270% new registrations in Google case studies; WebAIM finds 98% of top million homepages have accessibility issues; BuzzFeed logs 13 million JS timeouts (1% of JS requests); median mobile site sends 385 KB of JavaScript. Demonstrates less JavaScript, built-in browser behaviors, and simple semantic HTML that improves performance, accessibility, and future-proofing.
AI-written summary · about
chapters (15)
- 0:00Intro
- 2:21Treasure!
- 3:52The treasure map
- 5:40Introduction
- 11:37HTML is declarative
- 12:01HTML is fault-tolerant
- 13:05Paving a cowpath
- 14:24HTML is interoperable.
- 15:26JavaScript is NOT declarative
- 18:32Wooooh code
- 22:14Screen reader users
- 25:30Structured data
- 31:16Sir Uncle Timbo
- 31:29What can you do?
- 33:45react-bootstrap
related talks
22mHTML: How to Make Loveliness
44mThe HTML Treasure Hunt: from JavaScripter to Front End Superhero in 29 Minutes- 44mThe HTML Treasure Hunt: from JavaScripter to Front End Superhero in 29 Minutes
30mAdvanced HTML for Performance & Accessibility
50mAdvanced HTML for Good Developers
57mAdvanced HTML for Performance & Accessibility
01h 01mA web for anyone, anywhere, anytime
31mAdvanced HTML for good developers