This document discusses challenges facing the open web in a mobile-dominated world. It describes how mobile native platforms are stacked against the mobile web, providing better monetization and a perception that everything must work offline. It discusses the five stages of mourning for the open web, from denial to acceptance. It argues for focusing on simplicity, understanding other perspectives, and promoting the web through love instead of criticism.

1. ERASE AND REWIND
A tale of innovation and impatience
CHRIS HEILMANN (@CODEPO8), OPEN WEB CAMP, SAN JOSE, 2015

2. The Levellers - Dance before the Storm

3. WE ARE HERE AT THE OPEN WEB
CAMP, WHICH IS ABOUT A FEW
DREAMS I TRIED TO MAKE SURE
COME TRUE OVER THE LAST YEARS.

4. SIMPLE DREAMS,
GOOD DREAMS
THAT PEOPLE CAN
BENEFIT FROM…
✓ Maintainability
✓ Accessibility
✓ Predictability
✓ Flexibility
✓ Extensibility

5. WE, WHO WEAR THE
BATTLE SCARS OF
THE MEMORY OF
PRE-HTML5 AND
CSS DAYS SEE
SIMPLE
SOLUTIONS…
✓ Stick to web standards
✓ Bet on the open web
✓ Practice your craft
✓ Question everything and
don’t assume functionality
✓ If it has no URL, and can’t
be view-sourced or crawled,
don’t trust it - it is faux web.

6. AND, OF COURSE
WE HAD AN OLD
ENEMY THAT IS
EASILY TO BLAME
FOR ANYTHING…

7. I GOT SO ANNOYED
WITH THIS, THAT I
TOOK DRASTIC
MEASURES…

8. I JOINED MICROSOFT
TO HELP WITH ONE
VERY IMPORTANT FIX
THE WEB VERY MUCH
NEEDED…

9. THE PLAN WAS
SIMPLE:
BURN IE AND LET A
NEW BROWSER
EMERGE FROM THE
ASHES…

10. THE IDEA WAS TO GET
RID OF ALL THE BAD
IDEAS OF THE PAST…
✘ VML
✘ attachEvent()
✘ currentStyle
✘ X-UA-Compatible (render modes)
✘ IE Layout Quirks
✘ VBScript
✘ Conditional Comments
✘ MS-Prefixed Events

11. AND REPLACE THEM WITH YUMMY GOODNESS.

12. THERE ARE MANY WEBS, IT SEEM…

13. before
after
before
after
-webkit-appearance: none -webkit-gradient
EXPERIMENTAL? PROBABLY SAFE TO USE…

14. COPY + PASTE BEATS VALIDATION?
https://github.com/search?l=html&q=charset+%22UTF8%22&ref=searchresults&type=Code&utf8=%E2%9C%93
<meta http-equiv="content-type"
content="text/html;charset=utf-8" />
<meta charset="utf-8">
<meta charset=“utf8"> ✘
✔
> 600k times in use on GitHub!

15. THINGS I LEARNED
WORKING FOR
BROWSER MAKERS
✓ It is a constant race not to break the
web - every mistake web developers
make needs to get catered for.
✓ The pressure is immense. Instead of
pushing for an interoperable web,
browsers are constantly compared
and expected to be different.
✓ When implementing standards, we
find a lot of problems and feed them
back. That’s why a score of 100% in
feature tests makes no sense.
✓ Most speed increases are based on
analysing and fixing developer
mistakes/sloppiness.

16. BACK TO WHAT WE
DO HERE…

17. MOST OF THE BEST PRACTICES WE
CELEBRATE HERE ARE PROMISES.

18. THE BIGGEST THING WE PROMISE
PEOPLE IS LONGEVITY AND RE-USE
OF THEIR WORK.

19. The web is not binary, one or zero, on or
off. It’s not a platform where you get one
hundred per cent or zero per cent. It’s
this continuum.
The web is not a platform.
It’s a continuum.
https://adactio.com/journal/6692
– Jeremy Keith

20. The web is not a
platform. It’s a
continuum.
– Jeremy Keith
✓ 100% true
✓ Deep, future-focused
thinking
✓ Insightful
✓ Inspiring
✓ Techno hippie horseshit

21. OUR PROMISES OF NOW AND
FUTURE SUCCESS AND
EVERLASTING RE-USE ARE NOT AN
INCENTIVE ANY LONGER…

22. WHY IS THAT?

23. THE WEB ISN’T
EXCITING ANY
MORE - IT IS
PLUMBING.

24. THE COOL, NEW AND
EXCITING THINGS
AREN’T WEB
TECHNOLOGY
BASED.

25. COMPUTING CHANGED
AND THE MOST IMPORTANT
PLATFORM WORKS ON
OTHER PRINCIPLES THAN
THE WEB.

26. MOBILE HAS BEEN SOLD TO
US AND BY US AS
TOTALLY DIFFERENT
• The app is a much better form factor
than web sites with URLs
• Everything needs to work offline
• Everything needs to be much simpler
interfaces - people are busy and on
the road
• Every app should take full advantage
over what the operating system and
hardware offers

27. THE BIGGEST THING
THE WEB NEEDS TO
MATCH IS MAKING
MONEY.

28. REGARDLESS OF
HYPED NUMBERS,
MOBILE NATIVE
PLATFORMS ALLOW
YOU TO MAKE
MONEY…
✓ Mobile native platforms have a
monetisation plan that is not
“show some ads”
✓ It is incredibly easy to spend
money on iOS
✓ There is no preconception that
“everything is free”
✓ Releasing on iOS means you target
an affluent audience.
✓ Payments for upgrades are a
normal thing

29. WE ARE STILL FAR, FAR AWAY FROM
BEING ABLE TO DELIVER THAT…
✘

30. TROUBLE WITH THE MOBILE WEB…
www.theverge.com/2015/7/20/9002721/the-mobile-web-sucks

31. TROUBLE WITH THE MOBILE WEB…
www.theverge.com/2015/7/20/9002721/the-mobile-web-sucks

32. ON MOBILE, THE
DECK IS STACKED
AGAINST THE WEB…

33. ON MOBILE, THE
DECK IS STACKED
AGAINST THE WEB…
• Browsers are hard-wired and
update with operating
systems .
• Browsers are built by many
different players, all with an
own agenda.
• The more you control the
experience, the more
competitive you are.

34. EVEN FEATURE DETECTION DOESN’T SAVE US…

35. DENIAL ANGER BARGAINING DEPRESSION ACCEPTANCE
THE FIVE STAGES OF MOURNING FOR THE OPEN
WEB IN A MOBILE WORLD.

36. DENIAL ANGER BARGAINING DEPRESSION ACCEPTANCE
THE FIVE STAGES OF MOURNING FOR THE OPEN
WEB IN A MOBILE WORLD.
• This is just a fad, it will go away.
• If we build our own operating system based on HTML5, the
others will learn from that and embrace it more.
• Surely the simplicity of web standards and the amazing
value of Microformats and properly structured HTML will
never cease to amaze new developers.

37. DENIAL ANGER BARGAINING DEPRESSION ACCEPTANCE
THE FIVE STAGES OF MOURNING FOR THE OPEN
WEB IN A MOBILE WORLD.

38. IT IS THE FAULT OF
THE USERS!
They do all the things wrong like
using outdated browsers or
turning off JavaScript!
DENIAL ANGER BARGAINING DEPRESSION ACCEPTANCE

39. IT IS THE FAULT OF
THE CLIENTS!
They only want crap and nothing
exciting that pushes the
envelope!
DENIAL ANGER BARGAINING DEPRESSION ACCEPTANCE

40. IT IS THE FAULT OF
THE TOOL CREATORS!
We need to match what native
has in terms of tooling and then
we all can ride unicorns and have
ice cream!
DENIAL ANGER BARGAINING DEPRESSION ACCEPTANCE

41. IT IS THE FAULT OF
THE BROWSER
MAKERS!
They just don’t innovate quickly
enough to match what mobile
can do!
DENIAL ANGER BARGAINING DEPRESSION ACCEPTANCE

42. DENIAL BARGAINING DEPRESSION ACCEPTANCE
THE FIVE STAGES OF MOURNING FOR THE OPEN
WEB IN A MOBILE WORLD.
• Let’s build a stop phone gap solution - one that is designed
to become redundant to show mobile OS makers that the
web is ready if only it had access to hardware capabilities.
• Let’s define lots of APIs and form expert groups - surely
these will be embraced an implemented by OS providers
instead of coming up with their own ones!
• Let’s inject browsers with our apps into the platform -
(crosswalk-project.org). This worked wonders with
Chromeframe and Internet Explorer.
ANGER

43. DENIAL BARGAINING DEPRESSION ACCEPTANCE
THE FIVE STAGES OF MOURNING FOR THE OPEN
WEB IN A MOBILE WORLD.
• Let’s concede defeat - we can never match what native
offers, and never innovate as fast.
• Let’s consider a new career - goat farming, for example,
sounds like a great investment.
• Let’s try to find recognition elsewhere - maybe in a smaller
group of people who care about what I do.
ANGER BARGAINING DEPRESSION

44. DENIAL BARGAINING DEPRESSION ACCEPTANCE
THE FIVE STAGES OF MOURNING FOR THE OPEN
WEB IN A MOBILE WORLD.
• Maybe this is just another form factor - and we could use
our time to care for the web that is instead.
• Maybe there is space for more than one form factor - just
maybe. I mean, crazier things have happened, like multiple
ways to use a road.
• Maybe this is a time to reflect and improve what we have -
after all, there is a lot that needs fixing?
ANGER BARGAINING DEPRESSION

45. THE WEB IS DESIGNED TO WORK INDEPENDENT
OF HARDWARE, SOFTWARE, ABILITY OR LOCATION.

46. SPIRIT ANIMAL:
PLATYPUS?

47. MORE LIKE:
HYRAX

48. THE WEB IS FULL OF
RUBBISH, TIME TO
CLEAN IT UP INSTEAD
OF ADDING MORE…

49. THE PROBLEM IS
THAT WE HAVE LOST
OUR VOICE AND
FOCUS.
✘ Innovation happens a lot in
browsers and in a very
experimental fashion
✘ A lot is purely engineering driven
and relies on a lot of abstractions
✘ The starting point for developers
became much more complex
✘ It is a full-time job to keep up with
JavaScript/platform innovation
✘ Business reasons trump user
experience.

50. http://www.w3.org/TR/html-design-principles/#priority-of-constituencies
In case of conflict, consider users over authors over
implementors over specifiers over theoretical purity.
In other words costs or difficulties to the user should
be given more weight than costs to authors; which in
turn should be given more weight than costs to
implementors; which should be given more weight
than costs to authors of the spec itself, which should
be given more weight than those proposing changes
for theoretical reasons alone. Of course, it is
preferred to make things better for multiple
constituencies at once.
“
PRIORITIES OF CONSTITUENCIES…

51. ENOUGH WITH THE EMPTY
PROMISES
• The web is a given now - people don’t care
for it as much as we did in the past.
• This means that what we offer as solutions
need to have immediate benefits - not a
glorious future that might never come.
• We should analyse some of our best
practices. Sure, backwards compatibility
means we never break the web. But we
also carry ballast with us.
• People will use what is the most simple
first, then the things that are the right thing
to do. Let’s offer simplicity.

52. ENOUGH WITH THE
CONSTANT CRITICISM
• Let’s analyse the reasons why
someone violated our best practices.
• The squeaky wheel gets the oil, it also
gets replaced when it keeps
squeaking
• If the fix of the thing we criticise
doesn’t yield any overall benefit, we
won’t reach people at all.
• Sometimes the web can be the wrong
solution

53. LOVE AND PASSION TRUMPS EVERYTHING…

54. LOVE COMES IN MANY FORMS…
• Understanding - our world has become much
more competitive and mainstream. We who
care about the web should help newcomers
calm down and see its flexibility as an
opportunity.
• Patience - we will see the same mistakes being
made over and and over again. Maybe this is a
right of passage, and beneficial as a learning
exercise.
• Kindness - it is easy to criticise and simple to
point out a flaw. It is more rewarding to connect
personally and ask for the reasons and offer a
solution.

55. LOVE COMES IN MANY FORMS…
• Interest - what makes people not go for open
web solutions? What is the thing the
alternatives give them?
• Openness - we never stop learning. Maybe
some of the things that sound ludicrous at first
can become a great idea with some tweaking.
• Sharing - many things we consider a given got
forgotten. Time to remind people. You start
teaching, you end up learning.
• Courage - we hear far too much from the
loudest and the most known. If you feel strongly
about something, speak up and tell us. We need
new, fresh voices!

56. THANK YOU!
CHRIS HEILMANN
@CODEPO8
Selfie Stick group: j0sh (www.pixael.com)
https://www.flickr.com/photos/87690240@N03/16322726941/
Stick and Carrot: Alan O’Rourke
https://www.flickr.com/photos/33524159@N00/17233999165
Skip by Denna Jones
https://www.flickr.com/photos/95267793@N00/2336623192
Pencil with rubber: Hometown Beauty
https://www.flickr.com/photos/73834369@N07/8408943093/
Stick, Carrot and heart: opensourceway
https://www.flickr.com/photos/47691521@N07/5537457133/
Goat: Chris Samuel
https://www.flickr.com/photos/94482242@N00/56574260/
Hyrax: Wikioedia
https://en.wikipedia.org/wiki/Hyrax
Platypus: BioDivLibrary
https://www.flickr.com/photos/61021753@N02/6260709968/
Return key: vapour trail
https://www.flickr.com/photos/54433196@N00/2765254958/