Slide 1
Slide 1 text
MADE OF LINKS
THE WEB IS...
PHIL HAWKSWORTH
THE WEB IS, CARDIFF, 2014
7
7
Slide 2
Slide 2 text
PHILHAWKSWORTH
@
Slide 3
Slide 3 text
PHILHAWKSWORTH
@
QUESTIONS
ENCOURAGEMENT
ARGUMENTS
COMMENTS
PITY
Slide 4
Slide 4 text
@philhawksworth
THEWEBIS
#
Slide 5
Slide 5 text
@philhawksworth
IN THE BEGINNING
Slide 6
Slide 6 text
@philhawksworth
TIM
Slide 7
Slide 7 text
@philhawksworth
IDEA
Slide 8
Slide 8 text
@philhawksworth
VAGUE,
BUT EXCITING
Slide 9
Slide 9 text
@philhawksworth
VAGUE,
BUT EXCITING
Slide 10
Slide 10 text
@philhawksworth
SERVER
Slide 11
Slide 11 text
@philhawksworth
SITE
Slide 12
Slide 12 text
@philhawksworth
PAGE
Slide 13
Slide 13 text
@philhawksworth
PAGE
Slide 14
Slide 14 text
@philhawksworth
HTML
Slide 15
Slide 15 text
@philhawksworth
LINKS
Slide 16
Slide 16 text
@philhawksworth
MORE PAGES
Slide 17
Slide 17 text
@philhawksworth
MORE LINKS
Slide 18
Slide 18 text
@philhawksworth
MORE SITES
Slide 19
Slide 19 text
@philhawksworth
MORE SERVERS
Slide 20
Slide 20 text
@philhawksworth
IMAGES
Slide 21
Slide 21 text
@philhawksworth
BLINKING TEXT
Slide 22
Slide 22 text
@philhawksworth
BLINKING TEXT
Slide 23
Slide 23 text
@philhawksworth
MARQUES
Slide 24
Slide 24 text
@philhawksworth
GEOCITIES
Slide 25
Slide 25 text
@philhawksworth
@philhawksworth
ANIMATED GIFS
Slide 26
Slide 26 text
@philhawksworth
GEOCITIES
Slide 27
Slide 27 text
@philhawksworth
GEOCITIES
Slide 28
Slide 28 text
@philhawksworth
ANIMATED GIFS
@philhawksworth
Slide 29
Slide 29 text
@philhawksworth
SOUND
Slide 30
Slide 30 text
@philhawksworth
VIDEO
Slide 31
Slide 31 text
@philhawksworth
ANIMATION
Slide 32
Slide 32 text
@philhawksworth
REAL TIME
Slide 33
Slide 33 text
@philhawksworth
APPLICATIONS
Slide 34
Slide 34 text
@philhawksworth
CLOUD
Slide 35
Slide 35 text
@philhawksworth
(INTERNET )
INTERNET
Slide 36
Slide 36 text
@philhawksworth
INTERNET OF THINGS
Slide 37
Slide 37 text
@philhawksworth
(INTERNET )
INTERNET
Slide 38
Slide 38 text
@philhawksworth
(INTERN)
STTTTI
Slide 39
Slide 39 text
@philhawksworth
OFFLINE
Slide 40
Slide 40 text
@philhawksworth
EVERYWHERE
Slide 41
Slide 41 text
@philhawksworth
THE LINK
Slide 42
Slide 42 text
@philhawksworth
THE WEB IS MADE OF LINKS
7
7
Slide 43
Slide 43 text
@philhawksworth
WHAT IS A WEB?
7
7
Slide 44
Slide 44 text
@philhawksworth
INTERCONNECTED DOCUMENTS
7
7
Slide 45
Slide 45 text
@philhawksworth
INTERCONNECTED MEDIA
7
7
Slide 46
Slide 46 text
@philhawksworth
INTERCONNECTED RESOURCES
7
7
Slide 47
Slide 47 text
@philhawksworth
THE LINK
Slide 48
Slide 48 text
@philhawksworth
THE URI
Slide 49
Slide 49 text
@philhawksworth
THE URI IS THE THING
PAUL DOWNEY, 2008
Slide 50
Slide 50 text
THE URI IS THE THING
PAUL DOWNEY, 2008
Slide 51
Slide 51 text
THE URI IS THE THING
PAUL DOWNEY, 2008
Slide 52
Slide 52 text
@philhawksworth
Slide 53
Slide 53 text
@philhawksworth
Slide 54
Slide 54 text
@philhawksworth
Slide 55
Slide 55 text
@philhawksworth
Slide 56
Slide 56 text
@philhawksworth
Slide 57
Slide 57 text
@philhawksworth
HYPERTEXT LINKS
Slide 58
Slide 58 text
@philhawksworth
HYPERTEXT LINKS
W
I
Slide 59
Slide 59 text
@philhawksworth
HYPERTEXT LINKS
W
I
WHY DO ?
Slide 60
Slide 60 text
@philhawksworth
WHAT ARE HYPERTEXT LINKS?
7
7
Slide 61
Slide 61 text
– Ted Nelson
HYPERTEXT
7
7
Slide 62
Slide 62 text
– Ted Nelson
HYPERMEDIA
7
7
Slide 63
Slide 63 text
– Ted Nelson
TRANSCLUSION
7
7
Slide 64
Slide 64 text
– Ted Nelson
INTERTWINGULARITY
7
7
Slide 65
Slide 65 text
– Ted Nelson
TELEDILDONICS
7
7
Slide 66
Slide 66 text
@philhawksworth
TELEDILDONICS
Slide 67
Slide 67 text
– Ted Nelson
HYPERTEXT
7
7
Slide 68
Slide 68 text
@philhawksworth
YOU NEVER FORGET YOUR FIRST LINK
7
7
Slide 69
Slide 69 text
@philhawksworth
YOU NEVER FORGET YOUR FIRST HOTLINK
7
7
Slide 70
Slide 70 text
@philhawksworth
Slide 71
Slide 71 text
@philhawksworth
MY FIRST HOTLINK
7
7
Slide 72
Slide 72 text
@philhawksworth
MY FIRST HOTLINK
7
7
Slide 73
Slide 73 text
@philhawksworth
SHARING & COLLABORATION
7
7
Slide 74
Slide 74 text
@philhawksworth
YOU CAN LINK TO
ANYTHING FROM ANYWHERE
7
7
Slide 75
Slide 75 text
@philhawksworth
MINDBOGGLING MAGIC
7
7
Slide 76
Slide 76 text
@philhawksworth
MINDBOGGLING POWER
7
7
Slide 77
Slide 77 text
@philhawksworth
THE ANATOMY OF A HYPERTEXT LINK
7
7
Slide 78
Slide 78 text
AITCH TEE TEE PEE
DOUBLE MEH
– Alex Sexton
7
7
Slide 79
Slide 79 text
AITCH TEE TEE PEE
DOUBLE MEH
– Alex Sexton
7
7
Slide 80
Slide 80 text
http foobar.co
://
Slide 81
Slide 81 text
AITCH TEE TEE PEE
DOUBLE MEH
– Alex Sexton
7
Slide 82
Slide 82 text
THE ANATOMY OF A HYPERTEXT LINK
7
7
Slide 83
Slide 83 text
THE ANATOMY OF A URL
7
7
Slide 84
Slide 84 text
GIMME THE LINK
– Actual real living people
7
7
Slide 85
Slide 85 text
THE ANATOMY OF A HYPERTEXT LINK
7
7
Slide 94
Slide 94 text
@philhawksworth
clickety click
Slide 95
Slide 95 text
@philhawksworth
clickety click
Slide 96
Slide 96 text
LYCOS.CO.UK CIRCA 1999/2000
Slide 97
Slide 97 text
@philhawksworth
NEW AFFORDANCES
BUILDING
Slide 98
Slide 98 text
@philhawksworth
USER UNDERSTANDING
ESTABLISHING
Slide 99
Slide 99 text
@philhawksworth
AN AGREEMENT
ESTABLISHING
Slide 100
Slide 100 text
@philhawksworth
THE WEB IS AGREEMENT
PAUL DOWNEY, 2007
Slide 101
Slide 101 text
No content
Slide 102
Slide 102 text
No content
Slide 103
Slide 103 text
@philhawksworth
POSTEL'S LAW
7
7
Slide 104
Slide 104 text
BE CONSERVATIVE IN WHAT YOU DO,
BE LIBERAL IN WHAT YOU ACCEPT
7
7
– Jon Postel
http://en.wikipedia.org/wiki/Robustness_principle
Slide 105
Slide 105 text
WEB STANDARDS
7
7
Slide 106
Slide 106 text
@philhawksworth
USER UNDERSTANDING
ESTABLISHING
Slide 107
Slide 107 text
@philhawksworth
OBSCURING THE URL
7
7
Slide 108
Slide 108 text
@philhawksworth
EXPERIMENTAL
IN CHROME
7
7
Slide 109
Slide 109 text
@philhawksworth
EXPERIMENTAL
IN CHROME CANARY
7
7
Slide 110
Slide 110 text
7
FAIR WARNING
Slide 111
Slide 111 text
7
ORIGIN CHIP
chrome://flags/#origin-chip-in-omnibox
Slide 112
Slide 112 text
No content
Slide 113
Slide 113 text
No content
Slide 114
Slide 114 text
AITCH TEE TEE PEE
DOUBLE MEH
– Alex Sexton
7
protocol
domain
top level domain
path
fragment
querystring
Slide 115
Slide 115 text
IT'S JUST A CYNICAL ATTEMPT
TO INCREASE SEARCH &
EARN MORE FOR GOOGLE
– The angry hoard
7
7
Slide 116
Slide 116 text
OBSCURING THE URL
SHIPPING IN
MOBILE SAFARI
7
7
Slide 117
Slide 117 text
@philhawksworth
AN EFFORT TO REDUCE NOISE
7
7
Slide 118
Slide 118 text
@philhawksworth
GRRRRR
Slide 119
Slide 119 text
@philhawksworth
A KEY SIGNPOST HAS
BEEN REMOVED
7
7
Slide 120
Slide 120 text
THE URL IS THE SHARE BUTTON
OF THE WEB,
AND IT DOES THAT BETTER
THAN ANY OTHER PLATFORM
7
7
Slide 121
Slide 121 text
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/
Slide 122
Slide 122 text
I’M GENUINELY SHOCKED THAT
JAKE THINKS THAT CHROME
HIDING URLS IS A GOOD THING
– Jeremy Keith
7
7
https://adactio.com/journal/6779
Slide 123
Slide 123 text
No content
Slide 124
Slide 124 text
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
Slide 125
Slide 125 text
@philhawksworth
SMART PEOPLE
MAKING SENSIBLE ARGUMENTS
7
7
Slide 126
Slide 126 text
@philhawksworth
WHAT IS LOST?
7
7
Slide 127
Slide 127 text
@philhawksworth
WHAT IS YOUR
HOME PHONE NUMBER?
QUESTION
Slide 128
Slide 128 text
@philhawksworth
PHONE NUMBERS
9
CONTACT LIST
Slide 129
Slide 129 text
@philhawksworth
IP ADDRESS
9
DNS
Slide 130
Slide 130 text
@philhawksworth
ADDRESS BOOK
7
7
Slide 131
Slide 131 text
@philhawksworth
OUR AGREEMENT WITH THE USERS
BREAKING
Slide 132
Slide 132 text
@philhawksworth
THE WEB IS NOT AN APP STORE
7
7
Slide 133
Slide 133 text
@philhawksworth
CONTROL
7
7
Slide 134
Slide 134 text
@philhawksworth
Slide 135
Slide 135 text
@philhawksworth
Slide 136
Slide 136 text
@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
Slide 137
Slide 137 text
@philhawksworth
THE WEB IS NOT FACEBOOK
7
7
Slide 138
Slide 138 text
@philhawksworth
OWNERSHIP
7
7
Slide 139
Slide 139 text
@philhawksworth
ALL YOUR HYPERTEXT LINKS ARE BELONG TO US
( somewhat paraphrased )
Slide 140
Slide 140 text
PATENT NO. 4,873,662
7
7
Slide 141
Slide 141 text
@philhawksworth
A CLICK HAS VA£UE
7
7
Slide 142
Slide 142 text
@philhawksworth
PAY PER CLICK?
7
7
Slide 143
Slide 143 text
@philhawksworth
MORE STREAMLINED USER JOURNEYS?
7
7
Slide 144
Slide 144 text
@philhawksworth
STRANGLED THE WEB?
7
7
Slide 145
Slide 145 text
@philhawksworth
CRYING OUT TO BE CLICKED
7
7
Slide 146
Slide 146 text
LYCOS.CO.UK CIRCA 1999/2000
Slide 147
Slide 147 text
LYCOS.CO.UK CIRCA 1999/2000
Slide 148
Slide 148 text
@philhawksworth
CLICK ME
CLICK ME
CLICK ME
Slide 149
Slide 149 text
THE MILLION DOLLAR HOMEPAGE
Slide 150
Slide 150 text
THE MILLION DOLLAR HOMEPAGE
Slide 151
Slide 151 text
THE MILLION DOLLAR HOMEPAGE
Slide 152
Slide 152 text
NEARLY 15 MILLION PIXELS
5120 x 2880
Slide 153
Slide 153 text
@philhawksworth
NINETY NINE COLOURS
BUT THIS BLUE AINT ONE
Slide 154
Slide 154 text
#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
Slide 155
Slide 155 text
@philhawksworth
DESIGN DECISIONS?
7
7
Slide 156
Slide 156 text
@philhawksworth
KNOWING
THE VALUE OF
Slide 157
Slide 157 text
@philhawksworth
URL SHORTENERS
WATERFALLING
Slide 158
Slide 158 text
@philhawksworth
DAISY CHAIN
Slide 159
Slide 159 text
@philhawksworth
CHANGING THE MEANING OF A LINK
7
7
Slide 160
Slide 160 text
@philhawksworth
JAVASCRIPT PSEUDO PROTOCOL
7
7
Slide 163
Slide 163 text
@philhawksworth
IS PROGRESSIVE ENHANCEMENT
STILL IMPORTANT?
7
7
Slide 164
Slide 164 text
@philhawksworth
YES
IS PROGRESSIVE ENHANCEMENT STILL IMPORTANT?
7
7
Slide 165
Slide 165 text
@philhawksworth
DON'T DISMISS DEVICES JUST
BECAUSE YOU DON'T USE THEM
7
7
– Anna Debenham
Slide 166
Slide 166 text
@philhawksworth
SQUIDGERIDEE
7
7
– Anna Debenham
Slide 167
Slide 167 text
@philhawksworth
EMBER, ANGULAR, POLYMER
7
7
Slide 168
Slide 168 text
@philhawksworth
RISING
WATER LEVEL
7
7
Slide 169
Slide 169 text
@philhawksworth
WHO IS LEFT BEHIND?
7
7
Slide 170
Slide 170 text
THIS IS FOR EVERYONE
7
7
Slide 171
Slide 171 text
THIS IS FOR EVERYONE
7
7
– Dan Williams
https://twitter.com/iamdanw/status/525241312342462464
WITH JAVASCRIPT ENABLED
Slide 172
Slide 172 text
@philhawksworth
GROWING AUDIENCE
7
7
Slide 173
Slide 173 text
@philhawksworth
WHAT IS THE COST OF ENTRY?
7
7
Slide 174
Slide 174 text
@philhawksworth
IS THE WEB'S FUTURE?
WHO
Slide 175
Slide 175 text
@philhawksworth
IS THE WEB'S FUTURE?
WHERE
Slide 176
Slide 176 text
@philhawksworth
THE WEB IS LIKE THE FUTURE,
IT'S ALREADY HERE
BUT NOT EVENLY DISTRIBUTED
7
7
Slide 177
Slide 177 text
@philhawksworth
BUILDING WITH THE
WEB'S MOST CRITICAL ASSET
7
7
Slide 178
Slide 178 text
@philhawksworth
ENABLE & INCLUDE
7
7
Slide 179
Slide 179 text
@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
Slide 180
Slide 180 text
@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
Slide 181
Slide 181 text
@philhawksworth
THANKS
bit.ly/thewebislinks
@PHILHAWKSWORTH
7
7