1. Real progressive
enhancement
Chris&an Heilmann
FOWA, London, October 2010

2. HTML5

3. Beware of truisms!

4. HTML5 does not
mean building apps
for iPad, iPhone and
Android.

5. Staying in the
comfort zone.

6. Building for the web
means open
development.

8. http://icant.co.uk/articles/seven-rules-of-
unobtrusive-javascript/
http://www.zhuoqun.net/html/y2008/1103.html

9. Easy YouTube
http://www.youtube.com/watch?v=CwsDKaalgq8&
http://www.youtube.com/watch?v=QiuT0y0KR6I

10. “ You can leave now - I don’t
need you any longer to watch
my videos!
“

15. HTML5 means
moving from hacks
to web applications.

16. The web is a scary
place.

17. A constantly
upgrading web?

18. IE6+Large Organisations=BFF
http://www.hmg.gov.uk/epetition-responses/petition-view.aspx?epref=ie6upgrade

19. Complex software will always have
vulnerabilities and motivated
adversaries will always work to
discover and take advantage of
them. There is no evidence that
upgrading away from the latest
fully patched versions of Internet
Explorer to other browsers will
make users more secure.

20. It is not straightforward for HMG
departments to upgrade IE versions
on their systems. Upgrading these
systems to IE8 can be a very large
operation, taking weeks to test and
roll out to all users.

21. To test all the web applications
currently used by HMG departments
can take months at significant
potential cost to the taxpayer. It is
therefore more cost effective in
many cases to continue to use IE6
and rely on other measures, such as
firewalls and malware scanning
software, to further protect public
sector internet users.

23. And this is why we
need progressive
enhancement.

24. Which is not
“making it work for
IE6”.

25. Instead it is “test for
support before you
apply”
http://www.modernizr.com/
http://github.com/phiggins42/has.js

26. [geomaker]
http://icant.co.uk/geomaker/index.php

27. http://uk-house-prices.com/

28. For a lot of new
developers, this
looks like extra
effort.

29. Instead we produce low
quality fallbacks.

30. New technologies
can be safely
applied with a few
lines of code.

31. Take local storage
for example. 15MB
cookies!

32. http://github.com/codepo8/firehose-research/

34. We built all these
cool widgets...

36. Wouldn’t it be great
to just be able to
use them?

38. http://express.davglass.com/

39. node.js + express.js
+ YUI3 = Progressive
Enhancement win!

40. http://www.yuiblog.com/blog/2010/09/29/video-glass-node/

41. Even more
interesting - today’s
widgets are already
tomorrow’s native
controls.

42. <datalist>
type=”color”
type=”range”
type=”file”
type=”date”

43. Re-use of learnings.

44. CSS3
Animation
and
Transition

46. On-demand loading
allows for enhanced
support without
overhead.

47. YUI’s intrinsic Loader now supports
capability‐based loading.
We’re leveraging this new feature to
avoid shipping IE‐specific code in the
Dom module to non‐IE browsers, a
performance/k‐weight boost that will
benefit all users of modern browsers
with no code change required.
http://www.yuiblog.com/blog/2010/07/26/3-2-0pr1/

48. Last but not least, it
is time to think
about our
development stack.

49. http://revdancatt.com/2010/09/27/a-users-guide-to-
websites-part-1-if-it-wasnt-broken-why-fix-it-2/

50. http://yuiblog.com/crockford/ “Loopage”

51. The future of web
apps is being
forged right now.

52. Be part of the
movement for a
better web for all.

53. Come and talk to
us, to Google, to
Apple, to Mozilla, to
Opera, to
Microsoft...
Your input matters!

54. Christian Heilmann
http://wait-till-i.com Thanks!
http://developer-evangelism.com
http://twitter.com/codepo8