The Web Is Made of Links

A talk given at The Web Is, in Cardiff, October 2014

This talk is a short ode to the defining element of the Web: The Link. We look at what a link is, how it has defined the Web and why it is important to protect and maintain this humble building block.

http://theweb.is
#thewebis

Transcript

1. MADE OF LINKS THE WEB IS... PHIL HAWKSWORTH THE WEB IS, CARDIFF, 2014 7 7
2. PHILHAWKSWORTH @
3. PHILHAWKSWORTH @ QUESTIONS ENCOURAGEMENT ARGUMENTS COMMENTS PITY
4. @philhawksworth THEWEBIS #
5. @philhawksworth IN THE BEGINNING
6. @philhawksworth TIM
7. @philhawksworth IDEA
8. @philhawksworth VAGUE, BUT EXCITING
9. @philhawksworth VAGUE, BUT EXCITING
10. @philhawksworth SERVER
11. @philhawksworth SITE
12. @philhawksworth PAGE
13. @philhawksworth PAGE
14. @philhawksworth HTML
15. @philhawksworth LINKS
16. @philhawksworth MORE PAGES
17. @philhawksworth MORE LINKS
18. @philhawksworth MORE SITES
19. @philhawksworth MORE SERVERS
20. @philhawksworth IMAGES
21. @philhawksworth BLINKING TEXT
22. @philhawksworth BLINKING TEXT
23. @philhawksworth MARQUES
24. @philhawksworth GEOCITIES
25. @philhawksworth @philhawksworth ANIMATED GIFS
26. @philhawksworth GEOCITIES
27. @philhawksworth GEOCITIES
28. @philhawksworth ANIMATED GIFS @philhawksworth
29. @philhawksworth SOUND
30. @philhawksworth VIDEO
31. @philhawksworth ANIMATION
32. @philhawksworth REAL TIME
33. @philhawksworth APPLICATIONS
34. @philhawksworth CLOUD
35. @philhawksworth (INTERNET ) INTERNET
36. @philhawksworth INTERNET OF THINGS
37. @philhawksworth (INTERNET ) INTERNET
38. @philhawksworth (INTERN) STTTTI
39. @philhawksworth OFFLINE
40. @philhawksworth EVERYWHERE
41. @philhawksworth THE LINK
42. @philhawksworth THE WEB IS MADE OF LINKS 7 7
43. @philhawksworth WHAT IS A WEB? 7 7
44. @philhawksworth INTERCONNECTED DOCUMENTS 7 7
45. @philhawksworth INTERCONNECTED MEDIA 7 7
46. @philhawksworth INTERCONNECTED RESOURCES 7 7
47. @philhawksworth THE LINK
48. @philhawksworth THE URI
49. @philhawksworth THE URI IS THE THING PAUL DOWNEY, 2008
50. THE URI IS THE THING PAUL DOWNEY, 2008
51. THE URI IS THE THING PAUL DOWNEY, 2008
52. @philhawksworth
53. @philhawksworth
54. @philhawksworth
55. @philhawksworth
56. @philhawksworth
57. @philhawksworth HYPERTEXT LINKS
58. @philhawksworth HYPERTEXT LINKS W I
59. @philhawksworth HYPERTEXT LINKS W I WHY DO ?
60. @philhawksworth WHAT ARE HYPERTEXT LINKS? 7 7
61. – Ted Nelson HYPERTEXT 7 7
62. – Ted Nelson HYPERMEDIA 7 7
63. – Ted Nelson TRANSCLUSION 7 7
64. – Ted Nelson INTERTWINGULARITY 7 7
65. – Ted Nelson TELEDILDONICS 7 7
66. @philhawksworth TELEDILDONICS
67. – Ted Nelson HYPERTEXT 7 7
68. @philhawksworth YOU NEVER FORGET YOUR FIRST LINK 7 7
69. @philhawksworth YOU NEVER FORGET YOUR FIRST HOTLINK 7 7
70. @philhawksworth <img src="http://not-my.com/not-my-image.jpeg">
71. @philhawksworth MY FIRST HOTLINK 7 7
72. @philhawksworth MY FIRST HOTLINK 7 7
73. @philhawksworth SHARING & COLLABORATION 7 7
74. @philhawksworth YOU CAN LINK TO ANYTHING FROM ANYWHERE 7 7
75. @philhawksworth MINDBOGGLING MAGIC 7 7
76. @philhawksworth MINDBOGGLING POWER 7 7
77. @philhawksworth THE ANATOMY OF A HYPERTEXT LINK 7 7
78. AITCH TEE TEE PEE DOUBLE MEH – Alex Sexton 7 7
79. AITCH TEE TEE PEE DOUBLE MEH – Alex Sexton 7 7
80. http foobar.co ://
81. AITCH TEE TEE PEE DOUBLE MEH – Alex Sexton 7
82. THE ANATOMY OF A HYPERTEXT LINK 7 7
83. THE ANATOMY OF A URL 7 7
84. GIMME THE LINK – Actual real living people 7 7
85. THE ANATOMY OF A HYPERTEXT LINK 7 7
86. @philhawksworth <a>
87. @philhawksworth <a> clickety click </a>
88. @philhawksworth <a href="#someplace"> ! clickety click </a>
89. @philhawksworth <a href="/someplace"> ! clickety click </a>
90. @philhawksworth <a href="http://someplace"> ! clickety click </a>
91. @philhawksworth <a href="http://someplace" ! rel="author"> ! clickety click </a>
92. @philhawksworth <a href="http://someplace" ! rel="next"> ! clickety click </a>
93. @philhawksworth <a href="http://someplace" ! rel="prefetch"> ! clickety click </a>
94. @philhawksworth clickety click
95. @philhawksworth clickety click
96. LYCOS.CO.UK CIRCA 1999/2000
97. @philhawksworth NEW AFFORDANCES BUILDING
98. @philhawksworth USER UNDERSTANDING ESTABLISHING
99. @philhawksworth AN AGREEMENT ESTABLISHING
100. @philhawksworth THE WEB IS AGREEMENT PAUL DOWNEY, 2007
103. @philhawksworth POSTEL'S LAW 7 7
104. BE CONSERVATIVE IN WHAT YOU DO, BE LIBERAL IN WHAT YOU ACCEPT 7 7 – Jon Postel http://en.wikipedia.org/wiki/Robustness_principle
105. WEB STANDARDS 7 7
106. @philhawksworth USER UNDERSTANDING ESTABLISHING
107. @philhawksworth OBSCURING THE URL 7 7
108. @philhawksworth EXPERIMENTAL IN CHROME 7 7
109. @philhawksworth EXPERIMENTAL IN CHROME CANARY 7 7
110. 7 FAIR WARNING
111. 7 ORIGIN CHIP chrome://flags/#origin-chip-in-omnibox
114. AITCH TEE TEE PEE DOUBLE MEH – Alex Sexton 7 protocol domain top level domain path fragment querystring
115. IT'S JUST A CYNICAL ATTEMPT TO INCREASE SEARCH & EARN MORE FOR GOOGLE – The angry hoard 7 7
116. OBSCURING THE URL SHIPPING IN MOBILE SAFARI 7 7
117. @philhawksworth AN EFFORT TO REDUCE NOISE 7 7
118. @philhawksworth GRRRRR
119. @philhawksworth A KEY SIGNPOST HAS BEEN REMOVED 7 7
120. THE URL IS THE SHARE BUTTON OF THE WEB, AND IT DOES THAT BETTER THAN ANY OTHER PLATFORM 7 7
121. LINKABILITY AND SHAREABILITY IS KEY TO THE WEB, WE MUST NEVER LOSE THAT – Jake Archibald 7 7 http://jakearchibald.com/2014/improving-the-url-bar/
122. I’M GENUINELY SHOCKED THAT JAKE THINKS THAT CHROME HIDING URLS IS A GOOD THING – Jeremy Keith 7 7 https://adactio.com/journal/6779
124. UNTIL NOW, THEY COULD COPY THE “LINK” FROM THE TOP OF THEIR BROWSER AND PASTE IT INTO AN EMAIL, OR A TEXT MESSAGE – Jeremy Keith 7 7 https://adactio.com/journal/6779
125. @philhawksworth SMART PEOPLE MAKING SENSIBLE ARGUMENTS 7 7
126. @philhawksworth WHAT IS LOST? 7 7
127. @philhawksworth WHAT IS YOUR HOME PHONE NUMBER? QUESTION
128. @philhawksworth PHONE NUMBERS 9 CONTACT LIST
129. @philhawksworth IP ADDRESS 9 DNS
130. @philhawksworth ADDRESS BOOK 7 7
131. @philhawksworth OUR AGREEMENT WITH THE USERS BREAKING
132. @philhawksworth THE WEB IS NOT AN APP STORE 7 7
133. @philhawksworth CONTROL 7 7
134. @philhawksworth
135. @philhawksworth
136. @philhawksworth “Welcome to Taco Bell! Give me your phone, and we’ll be happy to take your order when I’m done looking through it!” 7 7 @Wilto https://twitter.com/wilto/status/527165005792555008
137. @philhawksworth THE WEB IS NOT FACEBOOK 7 7
138. @philhawksworth OWNERSHIP 7 7
139. @philhawksworth ALL YOUR HYPERTEXT LINKS ARE BELONG TO US ( somewhat paraphrased )
140. PATENT NO. 4,873,662 7 7
141. @philhawksworth A CLICK HAS VA£UE 7 7
142. @philhawksworth PAY PER CLICK? 7 7
143. @philhawksworth MORE STREAMLINED USER JOURNEYS? 7 7
144. @philhawksworth STRANGLED THE WEB? 7 7
145. @philhawksworth CRYING OUT TO BE CLICKED 7 7
146. LYCOS.CO.UK CIRCA 1999/2000
147. LYCOS.CO.UK CIRCA 1999/2000
148. @philhawksworth CLICK ME CLICK ME CLICK ME
149. THE MILLION DOLLAR HOMEPAGE
150. THE MILLION DOLLAR HOMEPAGE
151. THE MILLION DOLLAR HOMEPAGE
152. NEARLY 15 MILLION PIXELS 5120 x 2880
153. @philhawksworth NINETY NINE COLOURS BUT THIS BLUE AINT ONE
154. #276AD9 #3E6FD9 #3A6FDE #326AED #366AEC #4078ED #2F6FEC #3084DE #276DE5 #287DEC #306DD9 #377CE2 #356DE2 #3776DE #3A6AE8 #2D6AE0 #3679DD #276EDE #3A73E0 #356AF0 #307EE1 #277EE1 #2C6AE2 #3578E8 #3D6BED #3079E7 #276BE7 #2B6AE9 #367DEC #306CE2 #3373ED #406AE8 #2D6AED #2C6DE1 #3579E5 #3671F2 #276BE7 #2B6AEC #2A73DE #356DDE #4285F4 #41SHADES
155. @philhawksworth DESIGN DECISIONS? 7 7
156. @philhawksworth KNOWING THE VALUE OF
157. @philhawksworth URL SHORTENERS WATERFALLING
158. @philhawksworth DAISY CHAIN
159. @philhawksworth CHANGING THE MEANING OF A LINK 7 7
160. @philhawksworth JAVASCRIPT PSEUDO PROTOCOL 7 7
161. @philhawksworth <a href="javascript:foo();">
162. @philhawksworth <a href="#" onclick="foo();">
163. @philhawksworth IS PROGRESSIVE ENHANCEMENT STILL IMPORTANT? 7 7
164. @philhawksworth YES IS PROGRESSIVE ENHANCEMENT STILL IMPORTANT? 7 7
165. @philhawksworth DON'T DISMISS DEVICES JUST BECAUSE YOU DON'T USE THEM 7 7 – Anna Debenham
166. @philhawksworth SQUIDGERIDEE 7 7 – Anna Debenham
167. @philhawksworth EMBER, ANGULAR, POLYMER 7 7
168. @philhawksworth RISING WATER LEVEL 7 7
169. @philhawksworth WHO IS LEFT BEHIND? 7 7
170. THIS IS FOR EVERYONE 7 7
171. THIS IS FOR EVERYONE 7 7 – Dan Williams https://twitter.com/iamdanw/status/525241312342462464 WITH JAVASCRIPT ENABLED
172. @philhawksworth GROWING AUDIENCE 7 7
173. @philhawksworth WHAT IS THE COST OF ENTRY? 7 7
174. @philhawksworth IS THE WEB'S FUTURE? WHO
175. @philhawksworth IS THE WEB'S FUTURE? WHERE
176. @philhawksworth THE WEB IS LIKE THE FUTURE, IT'S ALREADY HERE BUT NOT EVENLY DISTRIBUTED 7 7
177. @philhawksworth BUILDING WITH THE WEB'S MOST CRITICAL ASSET 7 7
178. @philhawksworth ENABLE & INCLUDE 7 7
179. @philhawksworth LINKS http://info.cern.ch/Proposal.html http://blog.whatfettle.com/2008/10/06/the-uri-is-the-thing http://en.wikipedia.org/wiki/Ted_Nelson http://www.thewebisagreement.com http://en.wikipedia.org/wiki/Robustness_principle http://jakearchibald.com/2014/improving-the-url-bar https://adactio.com/journal/6779 http://warpspire.com/posts/url-design http://hawksworx.com/blog/unobtrusify-your-javascript http://en.wikipedia.org/wiki/British_Telecommunications_Plc._v._Prodigy http://www.google.com/patents/US4873662 http://www.w3.org/TR/html5/links.html#linkTypes http://www.mckinsey.com/Insights/High_Tech_Telecoms_Internet/ Offline_and_falling_behind_Barriers_to_Internet_adoption
180. @philhawksworth THANKS Ted Nelson The URI is the thing Unveiling of The URI Is The Thing Man drawer Daisy chain Harbour https://www.flickr.com/photos/matlocktest/37349112 https://www.flickr.com/photos/nickwebb/2918883446 https://www.flickr.com/photos/nickwebb/2918034747 https://www.flickr.com/photos/vandinglewop/7993315350 https://www.flickr.com/photos/tekdiver/3434765820 https://www.flickr.com/photos/aigle_dore/6226051676
181. @philhawksworth THANKS bit.ly/thewebislinks @PHILHAWKSWORTH 7 7