1
00:00:01,200 --> 00:00:06,044
Every time you open a web page, three ideas from 1990 go to work.

2
00:00:06,244 --> 00:00:08,113
An address that names the page.

3
00:00:08,133 --> 00:00:09,881
A document written in markup.

4
00:00:09,901 --> 00:00:13,797
And a short conversation between two computers to fetch it.

5
00:00:13,997 --> 00:00:17,575
Frameworks, apps, and APIs all sit on top of those three,

6
00:00:17,595 --> 00:00:20,420
no matter how deep the abstraction goes.

7
00:00:20,620 --> 00:00:24,845
So to understand the web as a medium, it helps to start where it started.

8
00:00:27,345 --> 00:00:28,135
March 1989.

9
00:00:28,155 --> 00:00:33,683
CERN, the particle physics lab on the border of France and Switzerland.

10
00:00:33,883 --> 00:00:38,456
Researchers from dozens of countries come and go, writing papers, notes,

11
00:00:38,476 --> 00:00:41,073
and documentation in many languages.

12
00:00:41,273 --> 00:00:46,509
They work on computers that don’t share information: mainframes, minicomputers,

13
00:00:46,529 --> 00:00:52,219
Unix workstations, Macs, and PCs, each with its own formats and its own programs.

14
00:00:52,419 --> 00:00:54,432
Information gets lost all the time.

15
00:00:54,452 --> 00:00:58,180
When someone leaves, what they knew often leaves with them.

16
00:00:58,380 --> 00:01:01,597
Tim Berners-Lee, a British computer scientist at CERN,

17
00:01:01,617 --> 00:01:04,294
sees that the problem isn’t any one computer.

18
00:01:04,314 --> 00:01:07,491
It’s that nothing links the information on them.

19
00:01:09,591 --> 00:01:13,053
So he writes a proposal called Information Management.

20
00:01:13,073 --> 00:01:14,924
Instead of a rigid hierarchy,

21
00:01:14,944 --> 00:01:19,825
it describes a web of linked notes: documents that point to other documents,

22
00:01:19,845 --> 00:01:21,112
on any machine.

23
00:01:21,312 --> 00:01:26,305
His boss, Mike Sendall, writes three words on the cover. Vague, but exciting.

24
00:01:27,005 --> 00:01:28,869
Sendall lets him keep going.

25
00:01:28,889 --> 00:01:34,522
By late 1990, Berners-Lee has picked a name, and with his colleague Robert Cailliau,

26
00:01:34,542 --> 00:01:37,332
he proposes the WorldWideWeb project.

27
00:01:37,532 --> 00:01:39,891
The name could have been different.

28
00:01:39,911 --> 00:01:42,882
Information Mesh sounded too much like mess.

29
00:01:42,902 --> 00:01:45,533
Mine of Information abbreviated to MOI,

30
00:01:45,553 --> 00:01:49,523
French for “me.” And The Information Mine spelled TIM.

31
00:01:51,623 --> 00:01:53,680
The web rests on three inventions.

32
00:01:53,700 --> 00:01:55,955
Think of them as the web’s atom.

33
00:01:56,155 --> 00:02:00,702
First, the URL: one addressing scheme for every kind of information.

34
00:02:00,722 --> 00:02:02,650
A scheme, a host, and a path.

35
00:02:02,670 --> 00:02:08,358
The same pattern could point to a web page, a file server, a newsgroup, or a mailbox,

36
00:02:08,378 --> 00:02:12,305
and stitch those separate information spaces into one.

37
00:02:12,805 --> 00:02:17,430
The double slash was borrowed from the file system of Apollo workstations.

38
00:02:17,450 --> 00:02:21,260
Years later, Berners-Lee admitted it wasn’t really necessary.

39
00:02:21,280 --> 00:02:26,225
Programmers have typed those two extra characters billions of times since.

40
00:02:26,825 --> 00:02:29,458
Second, HTML: a simple markup language.

41
00:02:29,478 --> 00:02:33,949
Its tags describe what content is, a heading, a paragraph, a list,

42
00:02:33,969 --> 00:02:36,602
rather than exactly how it should look.

43
00:02:36,622 --> 00:02:39,255
And its most important tag is the link.

44
00:02:39,275 --> 00:02:43,317
Anyone can link to anything, without asking permission.

45
00:02:43,917 --> 00:02:48,564
Third, HTTP: the protocol that fetches a document by its URL.

46
00:02:48,584 --> 00:02:52,007
The first version was almost comically small.

47
00:02:52,027 --> 00:02:55,297
The browser sent one line: GET, and a path.

48
00:02:55,317 --> 00:02:58,831
The server sent back the HTML and hung up.

49
00:02:59,431 --> 00:03:01,098
Address, document, delivery.

50
00:03:01,118 --> 00:03:04,411
Nearly everything on the web still touches those three,

51
00:03:04,431 --> 00:03:07,923
even when they’re buried under layers of abstraction.

52
00:03:10,223 --> 00:03:13,570
To make it real, Berners-Lee wrote both ends himself,

53
00:03:13,590 --> 00:03:19,035
on a NeXT computer: a web server, and the first web browser, called WorldWideWeb.

54
00:03:19,235 --> 00:03:23,274
The server had a hand-written label on it. This machine is a server.

55
00:03:23,294 --> 00:03:24,847
Do not power it down!

56
00:03:25,447 --> 00:03:30,158
So that anyone could try it, even from a plain text terminal, Nicola Pellow,

57
00:03:30,178 --> 00:03:35,645
a student on placement at CERN, wrote a line-mode browser that ran almost anywhere.

58
00:03:35,845 --> 00:03:41,124
In August 1991, Berners-Lee announced the web on Internet newsgroups.

59
00:03:41,144 --> 00:03:45,809
And on April 30th, 1993, CERN made the software royalty-free,

60
00:03:45,829 --> 00:03:50,353
for anyone to use and build on. No permission, no fees.

61
00:03:52,453 --> 00:03:55,868
People saw the power of it quickly, and the web grew fast.

62
00:03:56,068 --> 00:03:58,706
The first big extension was media.

63
00:03:58,726 --> 00:04:05,194
In 1993, a new img tag let browsers like Mosaic put pictures right inside the page,

64
00:04:05,214 --> 00:04:08,016
each one fetched by its own URL.

65
00:04:08,216 --> 00:04:12,308
At that point it wasn’t just hypertext anymore. It was hypermedia.

66
00:04:12,328 --> 00:04:17,113
Audio, video, fonts, and much more followed, all addressed the same way.

67
00:04:19,213 --> 00:04:20,352
Here’s a fun fact.

68
00:04:20,372 --> 00:04:22,864
The first browser wasn’t just a viewer.

69
00:04:22,884 --> 00:04:24,924
WorldWideWeb was also an editor.

70
00:04:24,944 --> 00:04:29,881
You could change a page, and make links, as easily as you could read it.

71
00:04:30,081 --> 00:04:34,837
That seems odd now, but a word processor both shows and edits documents.

72
00:04:34,857 --> 00:04:38,275
The web was meant to be written, not just read.

73
00:04:38,475 --> 00:04:41,948
Your browser still has that power. Open the console,

74
00:04:41,968 --> 00:04:46,903
set document.designMode to “on,” and the whole page becomes editable.

75
00:04:47,803 --> 00:04:50,841
It only changes your copy. But that’s the lesson.

76
00:04:50,861 --> 00:04:54,897
Everything that reaches the browser can be inspected and changed.

77
00:04:54,917 --> 00:04:57,517
The client side is not under your control,

78
00:04:57,537 --> 00:05:00,583
and the network in between is nearly as bad.

79
00:05:01,183 --> 00:05:03,634
We still publish all the time, of course.

80
00:05:03,654 --> 00:05:08,335
We just do it through apps, like a social feed or a content management system,

81
00:05:08,355 --> 00:05:11,488
instead of editing pages in the browser itself.

82
00:05:13,788 --> 00:05:15,037
Next came programs.

83
00:05:15,057 --> 00:05:19,245
First on the server, with the Common Gateway Interface, or CGI,

84
00:05:19,265 --> 00:05:24,307
which let a web server run a program and send back whatever it printed.

85
00:05:24,507 --> 00:05:28,792
Then in the browser, in 1995, with Java applets and JavaScript.

86
00:05:28,812 --> 00:05:33,507
Brendan Eich built the first version of JavaScript in about ten days,

87
00:05:33,527 --> 00:05:37,927
and despite the name, it has almost nothing to do with Java.

88
00:05:38,127 --> 00:05:39,418
This is a big shift.

89
00:05:39,438 --> 00:05:42,303
A web of documents became a web of programs,

90
00:05:42,323 --> 00:05:45,573
and programs need things documents never did.

91
00:05:46,073 --> 00:05:48,912
They need to remember you between requests.

92
00:05:48,932 --> 00:05:51,770
HTTP forgets everything, so we got cookies,

93
00:05:51,790 --> 00:05:56,677
named after the magic cookies Unix programmers passed back and forth.

94
00:05:56,877 --> 00:06:01,879
They handle passwords and payments, so connections needed encryption.

95
00:06:01,899 --> 00:06:04,601
Today that’s TLS, the S in HTTPS.

96
00:06:04,801 --> 00:06:07,056
And they have to pay for themselves.

97
00:06:07,076 --> 00:06:09,836
One of the first banner ads went up in 1994,

98
00:06:09,856 --> 00:06:14,385
and almost half the people who saw it clicked. Those days are long gone,

99
00:06:14,405 --> 00:06:19,630
but advertising and analytics still shape nearly every decision in web development,

100
00:06:19,650 --> 00:06:21,656
whether we admit it or not.

101
00:06:23,956 --> 00:06:28,833
Remember what the web was built to be. Open. Decentralized. Free to use.

102
00:06:28,853 --> 00:06:32,213
Nobody needed a vendor’s approval to publish.

103
00:06:32,413 --> 00:06:37,439
At the opening of the 2012 London Olympics, Berners-Lee put it in four words.

104
00:06:37,459 --> 00:06:39,135
This is for everyone.

105
00:06:40,035 --> 00:06:42,084
Today that web is under strain.

106
00:06:42,104 --> 00:06:46,822
Power has concentrated in a few huge platforms, pages have grown heavy,

107
00:06:46,842 --> 00:06:50,212
and tracking follows people from site to site.

108
00:06:50,412 --> 00:06:53,649
Some of that comes from our own choices as developers.

109
00:06:53,669 --> 00:06:55,699
Some of it, we’re even paid to do.

110
00:06:55,719 --> 00:07:00,120
It’s easy to build against the grain of the medium without noticing.

111
00:07:02,220 --> 00:07:05,048
That’s the point of this course. Your choices matter.

112
00:07:05,068 --> 00:07:09,667
And to make good ones, you have to understand the medium before you build on it.

113
00:07:09,967 --> 00:07:15,878
URLs, HTML, and HTTP. A client you don’t control. A network you can’t trust.

114
00:07:15,898 --> 00:07:19,163
And a web that was built for everyone.

115
00:07:19,763 --> 00:07:23,872
Next, we’ll follow a single page load from the user’s side of the screen,

116
00:07:23,892 --> 00:07:26,228
and see who falls off along the way.