Excessive Enhancement

Transcript

1. Excessive Enhancement Phil Hawksworth @philhawksworth

2. a history of great talks at full frontal javascript &

   browser technologies @philhawksworth #fullfrontalconf

3. front-end focus bleeding edge effects browser performance browser shizzle @philhawksworth

   #fullfrontalconf

4. node.js bringing javascript to the server @philhawksworth #fullfrontalconf

5. q=simon+willison+full+frontal &flesh_tones=false @philhawksworth #fullfrontalconf

6. f/e + b/e @philhawksworth #fullfrontalconf

7. browser shizzle can do animation can do 3D effects can

   do dynamic data visualisations @philhawksworth #fullfrontalconf

8. @philhawksworth #fullfrontalconf caution

9. ...so preoccupied with whether they could that they didn't stop

   to think if they should - Dr. Ian Malcolm @philhawksworth #fullfrontalconf

10. Eaten by dinosaurs eaten by dinosaurs (possibly while on the

    toilet) @philhawksworth #fullfrontalconf

11. captain killjoy running with scissors eating with mouth open @philhawksworth

    #fullfrontalconf ...but this stuff is important

12. @philhawksworth #fullfrontalconf the web is agreement an uber-doodle about the

    web by @psd of @solderpad

13. @philhawksworth #fullfrontalconf

14. @philhawksworth #fullfrontalconf

15. @philhawksworth #fullfrontalconf

16. @philhawksworth #fullfrontalconf

17. the uri is the thing another uber-doodle about the web

    by @psd of @solderpad @philhawksworth #fullfrontalconf

18. @philhawksworth #fullfrontalconf

19. @philhawksworth #fullfrontalconf

20. @philhawksworth #fullfrontalconf

21. agreement the contract of the URI @philhawksworth #fullfrontalconf

22. not a lecture on REST @philhawksworth #fullfrontalconf

23. cautionary tale the mistakes we have made before @philhawksworth #fullfrontalconf

24. representation of content ask, and ye shall receive GET http://some.stuff

    @philhawksworth #fullfrontalconf

25. the seductive power of the possible @philhawksworth #fullfrontalconf

26. html5 whatever that is @philhawksworth #fullfrontalconf

27. flash mistakes made with @philhawksworth #fullfrontalconf

28. anti-flash mob! you’re a member of the @philhawksworth #fullfrontalconf

29. snooty attitude of many web developers copyright Chris Kennett @philhawksworth

    #fullfrontalconf

30. common criticisms @philhawksworth #fullfrontalconf

31. frozen content copy / paste bookmark-able accessible searchable @philhawksworth #fullfrontalconf

    @philhawksworth #fullfrontalconf

32. flash *can* do it @philhawksworth #fullfrontalconf

33. "show me" @philhawksworth #fullfrontalconf

34. pixels > the web @philhawksworth #fullfrontalconf

35. what is valued by the developers? photoshop adobe suite flash

    @philhawksworth #fullfrontalconf

36. care more about the sex appeal ...than the fundamentals of

    the web @philhawksworth #fullfrontalconf

37. the seductive power of the possible @philhawksworth #fullfrontalconf

38. richer user experiences @philhawksworth #fullfrontalconf increased sophistication @philhawksworth #fullfrontalconf

39. @philhawksworth #fullfrontalconf

40. @philhawksworth #fullfrontalconf

41. http://beetle.de a rich user experience open Web technologies ...and why

    I think it sucks @philhawksworth #fullfrontalconf @philhawksworth #fullfrontalconf

42. @philhawksworth #fullfrontalconf @philhawksworth #fullfrontalconf ~13 seconds operator instructions @philhawksworth #fullfrontalconf

43. 11mb images 251 http requests missing cache expiration @philhawksworth #fullfrontalconf

44. 15mb images 316 http requests missing cache expiration @philhawksworth #fullfrontalconf

45. @philhawksworth #fullfrontalconf

46. 4mb images 314 http requests @philhawksworth #fullfrontalconf

47. @philhawksworth #fullfrontalconf @philhawksworth #fullfrontalconf

48. ...so preoccupied with whether they could that they didn't stop

    to think if they should - Dr. Ian Malcolm @philhawksworth #fullfrontalconf

49. @philhawksworth #fullfrontalconf that is really rather a lot of http

    requests for a web site about a car. - Dr. Ian Malcolm

50. Eaten by dinosaurs @philhawksworth #fullfrontalconf

51. but it will work on an iPhone @philhawksworth #fullfrontalconf

52. but it will work on an iPhone @philhawksworth #fullfrontalconf http://beetle.de

53. but it will work on an iPhone @philhawksworth #fullfrontalconf http://beetle.de/full

54. /reduced but it will work on an iPhone @philhawksworth #fullfrontalconf

    http://beetle.de

55. @philhawksworth #fullfrontalconf hijacking the links @philhawksworth #fullfrontalconf

56. @philhawksworth #fullfrontalconf “why don’t the fucking wheels fucking move?!!” @bruised_blood

    @philhawksworth #fullfrontalconf

57. pixels the web > @philhawksworth #fullfrontalconf

58. pixels the web > @philhawksworth #fullfrontalconf

59. without javascript? @philhawksworth #fullfrontalconf

60. @philhawksworth #fullfrontalconf

61. @philhawksworth #fullfrontalconf

62. what is the address of that content? @philhawksworth #fullfrontalconf

63. URIs are what make the Web a web @philhawksworth #fullfrontalconf

64. forgotten how the web works @philhawksworth #fullfrontalconf

65. being seduced by the possible @philhawksworth #fullfrontalconf

66. @philhawksworth #fullfrontalconf why u no shizzle?

67. @philhawksworth #fullfrontalconf curl http://some.stuff

68. @philhawksworth #fullfrontalconf

69. twitter.com is not a web site (except of course it

    is) @philhawksworth #fullfrontalconf @philhawksworth #fullfrontalconf

70. twitter.com is not a web site (except of course it

    is) @philhawksworth #fullfrontalconf @philhawksworth #fullfrontalconf

71. twitter is a platform everything uses the API @philhawksworth #fullfrontalconf

    @philhawksworth #fullfrontalconf

72. "twitter web client" @philhawksworth #fullfrontalconf

73. without javascript? @philhawksworth #fullfrontalconf

74. @philhawksworth #fullfrontalconf

75. but nobody has javascript disabled missing the point @philhawksworth #fullfrontalconf

76. what about the contract of the URI? @philhawksworth #fullfrontalconf

77. @philhawksworth #fullfrontalconf not known at this address

78. #! @philhawksworth #fullfrontalconf

79. #! shbang @philhawksworth #fullfrontalconf

80. #! shbang 61 slides simon willison ricky martin from to

    @philhawksworth #fullfrontalconf

81. #! why use @philhawksworth #fullfrontalconf

82. # @philhawksworth #fullfrontalconf

83. # @philhawksworth #fullfrontalconf window.location.hash

84. client-side routing client-side processing @philhawksworth #fullfrontalconf

85. @philhawksworth #fullfrontalconf enable history navigation

86. @philhawksworth #fullfrontalconf google ajax crawling #! http://code.google.com/web/ajaxcrawling/

87. when did it get so hard to crawl the web?

    what does it take to write a good crawler? @philhawksworth #fullfrontalconf

88. interface shizzle doesn't have to break the uri @philhawksworth #fullfrontalconf

89. @philhawksworth #fullfrontalconf

90. @philhawksworth #fullfrontalconf

91. @philhawksworth #fullfrontalconf

92. @philhawksworth #fullfrontalconf

93. html5 @philhawksworth #fullfrontalconf history api

94. @philhawksworth #fullfrontalconf

95. @philhawksworth #fullfrontalconf

96. @philhawksworth #fullfrontalconf

97. @philhawksworth #fullfrontalconf

98. client-side routing client-side processing @philhawksworth #fullfrontalconf

99. fashionable single page apps @philhawksworth #fullfrontalconf

100. helper libraries levi routes http://github.com/PaulKinlan/leviroutes @philhawksworth #fullfrontalconf

101. @philhawksworth #fullfrontalconf 2k javascript library unobtrusive progressive enhancement

102. demos & developer tools @philhawksworth #fullfrontalconf

103. @philhawksworth #fullfrontalconf

104. just a demo @philhawksworth #fullfrontalconf

105. just a demo the biggest danger is when that demo

     mentality leaks into production websites @brucelawson @philhawksworth #fullfrontalconf

106. @philhawksworth #fullfrontalconf

107. @philhawksworth #fullfrontalconf polaroiderizer.com/#fullfrontalconf

108. developer tools @philhawksworth #fullfrontalconf

109. we've been here before "it looks like you're making a

     snazzy web site..." would you like me to bollocks it up for you? @philhawksworth #fullfrontalconf

110. experiment & explore @philhawksworth #fullfrontalconf but take care of the

     web (and chew with your mouth closed)

111. http://www.flickr.com/photos/shelbob/67089485 http://www.flickr.com/photos/psd/1805709102/ http://www.flickr.com/photos/psd/421186578/ http://crikeyboy.blogspot.com/2009/05/illustration-friday-hierarchy.html http://www.flickr.com/photos/57742619@N04/5959324249 http://stephenwaller.tumblr.com/ http://www.flickr.com/photos/e-coli/3888542890 http://www.flickr.com/photos/theredproject/2831350088 http://www.flickr.com/photos/dcjohn/8474890 @philhawksworth

     #fullfrontalconf thanks & links http://thewebisagreement.com/ http://en.wikipedia.org/wiki/Robustness_principle http://code.google.com/web/ajaxcrawling http://github.com/blog/760-the-tree-slider http://www.w3.org/TR/html5/history.html http://www.whatwg.org/specs/web-apps/current-work/#event-popstate https://developer.mozilla.org/en/DOM/window.onpopstate http://github.com/PaulKinlan/leviroutes http://christianheilmann.com/2011/08/15/getting-rusty-we-need-new- best-practices-for-a-different-development-world/ http://www.w3.org/QA/2011/05/hash_uris.html #fullfrontalconf @philhawksworth

112. @philhawksworth #fullfrontalconf #fullfrontalconf ta!