All the small things… - Awwwards 2016
•
11 likes•5,262 views
A talk about creativity and how we clog up the web. And how that's a bad thing.
Recommended
Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (20)
Similar to All the small things… - Awwwards 2016
Similar to All the small things… - Awwwards 2016 (20)
More from Christian Heilmann
More from Christian Heilmann (20)
Recently uploaded
Recently uploaded (20)
All the small things… - Awwwards 2016
- 1. ALL THE SMALL THINGS… CHRIS HEILMANN (@CODEPO8), AWWWARDS, AMSTERDAM, FEBRUARY 2016 https://www.flickr.com/photos/69135870@N00/4465772463
- 2. WE’RE HERE TODAY TO CELEBRATE THE MOST BEAUTIFUL WEB SITES… 🎉
- 3. A LOT OF WHAT WE CELEBRATE IS BASED ON GORGEOUS INTERACTIONS… 👋
- 4. FIDELITY AND INTERACTIVITY THAT BEFORE HTML5 WAS ONLY POSSIBLE WITH FLASH… 📸
- 8. THE WEB ISN’T AS COOL AS IT USED TO BE…
- 9. MOBILE, TABLETS GREAT HARDWARE AND FAST CONNECTIONS… 🚤
- 11. THE WEB CAN SURPRISE YOU… 😄
- 13. THE STORY OF IGNIGHTER… http://www.nytimes.com/2011/02/20/business/20ignite.html?_r=0 • Group dating site • Founded 2008 • 50,000 users in the first year 💩
- 14. THE STORY OF IGNIGHTER… http://www.nytimes.com/2011/02/20/business/20ignite.html?_r=0 • Spike in traffic from Singapore, Malaysia, India and South Korea. • Pivot to cater to these markets
- 15. IGNIGHTER → STEP OUT http://www.nytimes.com/2011/02/20/business/20ignite.html?_r=0 • 2 Million users • 7000 daily signups on average
- 16. GROWTH HAPPENS WHERE WE ARE NOT THINKING OF RIGHT NOW - IN BADLY CONNECTED COUNTRIES WITH MILLIONS OF POTENTIAL USERS…
- 17. TIME TO BURN SOME OF THE FAT OF THE WEB… 🚴
- 18. Type Size (kB) Images 1426 Scripts 357 Video 174 Fonts 123 Stylesheets 76 HTML 67 Other 4 Total 2232 kB THE AVERAGE WEB SITE DOESN’T LOOK FIT… http://www.httparchive.org/interesting.php#bytesperpage
- 19. 1426 KB OF IMAGES… • Wrong file formats • Delivering scaled hi-res images to everybody • No automatic conversion and optimisation steps • Hero image instead of text content
- 20. 357KB OF SCRIPTS • Starting with libraries because of browsers that are dead and we don’t even bother to test on. • Using frameworks built for complex forms to create static web sites. • Using scripts to create fixed layouts dependent on screen resolution • Social media buttons and tracking
- 21. 174KB OF VIDEO • Background video without testing the connection or resolution • Autostart instead of on- demand loading • Mood reel instead of simple text explanations (I blame kickstarter)
- 22. 123KB OF FONTS • Using a whole font when a few characters are enough • Icon fonts instead of inline SVG • Sending desktop fonts to mobile devices
- 23. MAINTENANCE… ⛏
- 24. STOP BLAMING THE USER!
- 27. BROWSERS CHANGED A LOT. EVERGREEN, CAPABLE AND OPEN!
- 28. THIS IS A GREAT TIME TO CHANGE OUR WAYS!
- 30. PRACTICE FEATURE DETECTION INSTEAD OF PRETENDING TO FIX BROWSERS… if (thing) { dothing(); } if (!thing) { // you probably don’t // need thing, stop // shoe-horning it in. }
- 31. GREAT THINGS TO USE RIGHT NOW…
- 32. FLEXBOX +
- 33. SERVICE WORKER 🔌
- 34. CAMERA ACCESS 📹
- 38. SPEECH AND LANGUAGE RECOGNITION…
- 39. FACIAL DETECTION AND RECOGNITION…
- 41. IMAGE ANALYSIS AND CONVERSION…
- 45. IT IS UP TO YOU TO KEEP THE WEB EXCITING AND USABLE FOR THE NEXT GENERATION OF USERS.
- 46. AND IT IS NOT ABOUT WHO IS THE PRETTIEST…
- 47. IT IS ABOUT WHO PERFORMS BEST, IS MOST ACCESSIBLE AND IS USABLE BY ALL KIND OF PEOPLE - NOT THE ONES WHO ARE ALREADY BORED OF IT…
- 48. A CHECKLIST FOR 2016: • Assume capable browsers - stop trying to detect them • Cut down as much as you can • Use cloud services and automation to optimise your content - don’t rely on maintainers • Leverage new tech like service workers • Stop pretending everything is an iPad.