Presented at Web Unleashed on September 16-17, 2015 in Toronto, Canada More info at www.fitc.ca/webu Breaking The Broken Web with Kyle Simpson OVERVIEW The web is fundamentally broken in two deeply profound ways and unfortunately the only way we’re going to move forward is to painfully break from our past and present realities. First, we’ve got to break from the idealistic but untenable notion of unbounded backwards compatibility. Then we’re going to need to break from the notion of building sites/apps that assume fast and unmetered bandwidth, unlimited battery power, and users which want their devices completely maxed out in experience. Let’s stop building a broken Web and break it forward. OBJECTIVE To come to terms with the Web we’ve built broken by its very fundamental design, and break from this past to move forward. TARGET AUDIENCE Designers and Web builders. ASSUMED AUDIENCE KNOWLEDGE Basics of Web design and standards. FIVE THINGS AUDIENCE MEMBERS WILL LEARN Why are there so many bugs in Web technology that never get fixed? What is browser game theory and what does it mean to me? Besides screen size/orientation, what other factors should come into play when deciding what experience to give a user? What limitations do real users face which limit what experience they want or can “afford” on your site? How can we wire user-choice into the fabric of what we build and the way users experience the Web?

1. breaking the broken web
kyle simpson @getify

7. broken by
decision

8. romantic but
impratical
backwards
compatibility

9. tech hacks

17. the web is
broken

18. and we're
determined to
keep it that way

20. do we have to?

22. browser game
theory

24. @BreakWebForward

25. crazy?
already *happening!
*sort of

26. control
characters

27. many break
the web
forwards

29. broken by
design

31. >1mb
>$23

32. WhatDoesMySiteCost.com

40. the web is
totally
suckedF
^we
built

41. progressive
enhancement
responsive
design

42. didn't go
far enough

43. feature
tests
broken
assumption

44. broken
assumption
if the device
can do it, the
user wants it

49. "perfection is achieved,
not when there's
nothing more to add,
but when there's
nothing left to take away"
Antoine de Saint-Exupery

50. http://www.w3.org/TR/html-design-principles/#priority-of-constituencies

51. @UnsuckTheWeb

52. The Unsucked Web Manifesto
WHEREAS, the web is built on an amazing collection of features that's ever-expanding, both in
complexity and in size of resources;
WHEREAS, designers and developers currently exert near-complete control over the experience a
user has on their site or web application;
WHEREAS, designers and developers tend to design for the best experience, making assumptions of
free, fast, unlimited bandwidth to deliver this experience to users;
WHEREAS, user access to a lower fidelity experience is often treated as unimportant to business
goals, and usually given the same amount of (non-)care as Accessibility concerns, which is to say
little to none, or as older "unsupported" browsers (like IE6);
WHEREAS, many users are often disenfranchised from this web because a site or web application is
too big—either too costly in time to download over slow internet, or too costly in money over
metered bandwidth, and must unfortunately therefore make a choice simply not to visit at all;
WHEREAS, principles such as progressive enhancement and responsive design are nearly universally
accepted among the community, but mainly only focus on device capabilities and characteristics
instead of user choice;
WHEREAS, we can build a web that embraces users and gives them choice over their experience;
WE THEREFORE ASSERT the following principles of unsucked web design:
THAT designers and developers of sites and web applications must be free to continue to adopt the
latest and greatest web technologies as appropriate to their goals, including retina images, web
fonts, etc.
THAT all sites and web applications must also at a minimum provide a useful, if significantly
limited, low fidelity version that consists variously of: HTML/text, basic styling, a few (low-
resolution) images, etc.

53. WHEREAS, principles such as progressive enhancement and responsive design are nearly universally
accepted among the community, but mainly only focus on device capabilities and characteristics
instead of user choice;
WHEREAS, we can build a web that embraces users and gives them choice over their experience;
WE THEREFORE ASSERT the following principles of unsucked web design:
THAT designers and developers of sites and web applications must be free to continue to adopt the
latest and greatest web technologies as appropriate to their goals, including retina images, web
fonts, etc.
THAT all sites and web applications must also at a minimum provide a useful, if significantly
limited, low fidelity version that consists variously of: HTML/text, basic styling, a few (low-
resolution) images, etc.
THAT designers and developers of sites and web applications must begin to intentionally design
the web inlayers, not unlike the original principles of progressive enhancement, and not
dissimilar from breakpoints in responsive design. However, these layers of features must adapt
not only to device capabilities, but also to user choice.
THAT no matter how powerful a user's device may be, or how awesome its screen, designers and
developers have to respect that a user may not want to pay the time or money for those retina
images, web fonts, etc.
THAT developers know how to fiddle with settings to control some aspects of this already, but
regular non-technical users do not, and should not have to. User choice over the desired fidelity
of experience on a site or web application must be easily expressible in the main UI of a
browser, and must be on a per-site basis. For instance, a user may choose in loading a particular
site between "Faster Load" or "More Features".
THAT ultimately, if there's a conflict between a user's expressed (or default) choice of fidelity
of experience and the experience offered or forced by the site or web application, user choice
must take precedence. Browsers must respect the user choice and refuse to download (not just
suppress display, as in responsive design) resources that exceed chosen fidelity.

54. vision for the future
of the web

57. low
medium
high
fast, please
i'm patient
more features!

58. browsers
must enforce

59. even
crazier?
already *happening!
*sort of

60. Client Hints

61. "RQ: low"
Resource
Quality

63. what's our
part?

64. build in
<layer>s

68. objections
client
budget
too much
work
boss will
say no

69. build the minimal
web experience a
user needs
build the best
web experience
you can dream up

70. let the
user decide

71. break from the web of the past
break from the web of the current

72. because the better future
web is waiting...

73. kyle simpson @getify
thanks!