1
00:00:00,000 --> 00:00:00,127

2
00:00:00,127 --> 00:00:01,210
DAVID J. Malan: U redu.

3
00:00:01,210 --> 00:00:02,160
Vratili smo se.

4
00:00:02,160 --> 00:00:05,810
Dakle, cilj ove zadnje sjednice
je uvesti još nekoliko pojmova

5
00:00:05,810 --> 00:00:09,290
ali i svima dati šansu
na neki način protežu svoje prste

6
00:00:09,290 --> 00:00:11,270
i zapravo učiniti nešto
a little hands-on.

7
00:00:11,270 --> 00:00:13,897
Cilj je da se ne okrenuti
nas sve u web programere

8
00:00:13,897 --> 00:00:16,230
na bilo koji način, ali zapravo samo
da vam dati okus neke

9
00:00:16,230 --> 00:00:21,750
od osnovnih konstrukata što
odlazi u web programiranje i danas webu

10
00:00:21,750 --> 00:00:23,980
razvoj, tako da je
statički strana things--

11
00:00:23,980 --> 00:00:26,660
nema logike, nema programiranja
jezik, samo statički sadržaj.

12
00:00:26,660 --> 00:00:29,660
I to će nam dati priliku
zapravo vidjeti što je web poslužitelj,

13
00:00:29,660 --> 00:00:34,140
Pogledajte što HTML datoteke, vidjeti što
to je HTTP zapravo služi gore.

14
00:00:34,140 --> 00:00:38,600
No, prije nego što zaronite u, bilo retrospektiva
pitanja o cloud computing

15
00:00:38,600 --> 00:00:43,922
ili sigurnost ili nešto između?

16
00:00:43,922 --> 00:00:44,890
>> Ne?

17
00:00:44,890 --> 00:00:47,181
U redu, dobro, neka je
to, za svaki slučaj

18
00:00:47,181 --> 00:00:49,680
proces prijave za
nešto traje nekoliko minuta.

19
00:00:49,680 --> 00:00:51,221
Pustit ćemo da to učiniti u pozadini.

20
00:00:51,221 --> 00:00:56,860
Ajde, ako bi mogao,
na ovaj URL here-- c9.io.

21
00:00:56,860 --> 00:01:02,810
Ovo je treća strana service--
platforma kao usluga, ako will--

22
00:01:02,810 --> 00:01:05,190
koji će vas pozvati
potpisati gore za račun,

23
00:01:05,190 --> 00:01:08,650
i to će dati svakome od vas
račun u tzv oblaku

24
00:01:08,650 --> 00:01:11,330
na tuđe infrastrukture,
tvrtka zove Cloud9.

25
00:01:11,330 --> 00:01:13,350
No, ono što je lijepo o
to je da su ti dati

26
00:01:13,350 --> 00:01:15,990
aproksimacija jedne
Stvarni razvoj u stvarnom svijetu

27
00:01:15,990 --> 00:01:18,530
okoliš, iako se u
oblak u web pregledniku

28
00:01:18,530 --> 00:01:21,175
a mi ćemo koristiti kako bi zapravo
eksperimentirati malo danas.

29
00:01:21,175 --> 00:01:27,116

30
00:01:27,116 --> 00:01:30,260
A onda ići naprijed i samo kretanje
svoj put do postupka prijave

31
00:01:30,260 --> 00:01:32,630
ako bi mogao.

32
00:01:32,630 --> 00:01:36,080
Tako smo se dogoditi to primijeniti u razredu
Učim za sve naše studente,

33
00:01:36,080 --> 00:01:39,140
kako na kampusu i off sada, i
to je zamijenio ono povijesno

34
00:01:39,140 --> 00:01:41,390
je inače preuzeti softver.

35
00:01:41,390 --> 00:01:44,620
Dakle, ono što su dobivanjem pristupa na
je jedan od tih virtualnih strojeva,

36
00:01:44,620 --> 00:01:46,460
u biti, to sam opisao ranije.

37
00:01:46,460 --> 00:01:50,260
Dakle, ova tvrtka Cloud9 vjerojatno
rente iz trećeg party-- doista

38
00:01:50,260 --> 00:01:52,760
u ovom slučaju, Googleu, jednu cjelinu
hrpa virtualnih strojeva

39
00:01:52,760 --> 00:01:56,500
da su oni na neki način usitniti u
iluzija pojedine poslužitelje

40
00:01:56,500 --> 00:01:58,610
da svatko od nas ima punu kontrolu nad.

41
00:01:58,610 --> 00:02:01,640
To nije sasvim precizno reći
da su oni virtualnih strojeva,

42
00:02:01,640 --> 00:02:04,550
ipak, jer ono
Cloud9 zapravo koristi

43
00:02:04,550 --> 00:02:07,570
je nešto novija tehnologija
zove Kontejneri.

44
00:02:07,570 --> 00:02:13,150
I neka mi iskoristite ovu sliku
ovdje slikati ovu sliku.

45
00:02:13,150 --> 00:02:16,540
>> Spremnik je, ako
li podsjetiti na sliku

46
00:02:16,540 --> 00:02:19,900
od ranije, malo lakši
Težina od virtualnog stroja.

47
00:02:19,900 --> 00:02:22,090
U stvari, dok je posljednji
Vrijeme smo razgovarali o tamo

48
00:02:22,090 --> 00:02:25,170
biti operativni
sustav i hipervizoru

49
00:02:25,170 --> 00:02:28,260
a zatim gost operativni sustav, gost
operativni sustav, gost operativni

50
00:02:28,260 --> 00:02:30,940
sustava, na vrhu svoje
Fizički hardverski,

51
00:02:30,940 --> 00:02:33,740
razlika u ova novija
tehnologija, Kontejneri,

52
00:02:33,740 --> 00:02:37,290
je da su svi na neki način podijeliti
isti operativni sustav.

53
00:02:37,290 --> 00:02:39,970
Ali oni i dalje stvarati
iluzija svima

54
00:02:39,970 --> 00:02:44,590
što je njegov ili njezin vlastiti ekskluzivni
administrativna prava i datoteke

55
00:02:44,590 --> 00:02:45,400
na poslužitelju.

56
00:02:45,400 --> 00:02:48,230
No, tu je manje softvera u
između vas i hardvera.

57
00:02:48,230 --> 00:02:52,260
Rezultat koji je u
teorija, veći učinak,

58
00:02:52,260 --> 00:02:55,470
jer upotrebljavate ili
troši manje resursa

59
00:02:55,470 --> 00:02:57,360
na tom tzv virtualizacije sloj.

60
00:02:57,360 --> 00:02:59,420
Dakle, to se zove
Kontejneri po prirodi

61
00:02:59,420 --> 00:03:02,920
putem tehnologije koja se naziva Docker,
koji je jako dolazi do izražaja.

62
00:03:02,920 --> 00:03:05,086
A to je nešto što
Inženjeri u vašem poduzeću

63
00:03:05,086 --> 00:03:08,610
Možda vrsta vrsta početi govoriti
oko uskoro, ako već nisu,

64
00:03:08,610 --> 00:03:11,590
iako je svakako nema
Razlog za skok na bilo bandwagons.

65
00:03:11,590 --> 00:03:15,410
>> Dakle, s koje je rekao, što
vjerojatno vidjeti danas

66
00:03:15,410 --> 00:03:22,670
je zaslon koji izgleda malo kao što je ovaj.

67
00:03:22,670 --> 00:03:23,170
U REDU.

68
00:03:23,170 --> 00:03:25,260
I baš me zvati više ako nije.

69
00:03:25,260 --> 00:03:27,440
A ako so-- ću doći ako nije.

70
00:03:27,440 --> 00:03:30,244
Idi naprijed i kliknite da je velika
plus stvoriti radni prostor,

71
00:03:30,244 --> 00:03:31,660
a vi ćete vidjeti zaslon kao što je ovaj.

72
00:03:31,660 --> 00:03:35,020
Možete nazvati radni prostor
ime sve što želite za sada.

73
00:03:35,020 --> 00:03:38,660
I samo zapravo zbog jednostavnosti,
idi and-- dobro, neki od vas

74
00:03:38,660 --> 00:03:39,660
već imaju radne prostore.

75
00:03:39,660 --> 00:03:47,050
Nazovite to god want-- posao,
Harvard, u četvrtak, što god želite.

76
00:03:47,050 --> 00:03:48,800
Ne treba opis.

77
00:03:48,800 --> 00:03:52,380
Možete ga ostaviti privatnim, osim ako
već imaju hrpu radnih prostora.

78
00:03:52,380 --> 00:03:55,280
Ako ste prisiljeni učiniti javnim,
to je u redu za današnje potrebe.

79
00:03:55,280 --> 00:03:56,750
Ovdje je, također, jedan od Upsells.

80
00:03:56,750 --> 00:03:59,939
Možete dobiti jednu privatnu radni prostor
zadano. Ali ako želite više,

81
00:03:59,939 --> 00:04:00,980
morate platiti za više.

82
00:04:00,980 --> 00:04:02,870
Inače, oni vas prisiliti
kako bi vaš rad javnosti.

83
00:04:02,870 --> 00:04:05,600
No, to je u redu, jer oni također
ciljati to na open-source zajednica

84
00:04:05,600 --> 00:04:07,700
potaknuti ljude da
zapravo surađuju.

85
00:04:07,700 --> 00:04:10,699
>> I posljednja stvar koja je važna,
iako je, nakon što odabrati ime

86
00:04:10,699 --> 00:04:17,140
a nakon što odaberete privatni ili javni,
kliknite HTML5, veliki ikonu naranče

87
00:04:17,140 --> 00:04:22,430
drugi s lijeve strane, a
zatim Stvori radnog prostora.

88
00:04:22,430 --> 00:04:24,580
I to će se vjerojatno
potrajati nekoliko minuta ili tako,

89
00:04:24,580 --> 00:04:26,540
ali ćete onda imati
okoliš, nakon što

90
00:04:26,540 --> 00:04:30,544
to, da izgleda koji podsjeća na
ono što imam na ekranu ovdje.

91
00:04:30,544 --> 00:04:33,210
Ali, opet, to bi moglo potrajati nekoliko minuta
ili više doći do ovog zaslona

92
00:04:33,210 --> 00:04:34,770
nakon što kliknete Stvaranje radnog prostora.

93
00:04:34,770 --> 00:04:37,936
No, baš me označiti više ako bi mi se sviđa
za pogledati nešto ili savjet.

94
00:04:37,936 --> 00:04:40,191

95
00:04:40,191 --> 00:04:40,690
U redu.

96
00:04:40,690 --> 00:04:42,390
Dakle, idem na pozadini toga za sada.

97
00:04:42,390 --> 00:04:44,260
Nazovi me više, ako vam se čini da
imate bilo kakvih tehničkih poteškoća.

98
00:04:44,260 --> 00:04:46,210
Ali, opet, to bi moglo potrajati
malo za to otvoriti.

99
00:04:46,210 --> 00:04:49,570
I idemo naprijed i razgovarati o tome što
to zapravo znači napraviti web stranicu,

100
00:04:49,570 --> 00:04:52,780
ono što je HTML, i kako je sve to
sada povezuje kako smo krenuli

101
00:04:52,780 --> 00:04:54,730
zapravo koristiti neke od tehnologija.

102
00:04:54,730 --> 00:04:58,310
Tako ispada da ja mogu
idi na moj mali Mac ovdje,

103
00:04:58,310 --> 00:05:01,650
otvoriti jednostavan program koji se zove
TextEdit ili na Windowsima sam mogao

104
00:05:01,650 --> 00:05:04,480
otvoreno nešto što se zove notepad.exe.

105
00:05:04,480 --> 00:05:08,260
A ja samo mogu jednostavno učiniti nešto
kao što učinimo, "Zdravo, svijet".

106
00:05:08,260 --> 00:05:12,020
A onda sam mogao spremiti kao
hello.txt Dakle, nema magije tamo.

107
00:05:12,020 --> 00:05:15,200
To nema nikakve veze s web
programiranje, nema nikakve veze s HTML-u.

108
00:05:15,200 --> 00:05:16,790
Samo stvaranje jednostavne tekstualne datoteke.

109
00:05:16,790 --> 00:05:20,600
No, ispada da web
Stranica je doslovno samo to.

110
00:05:20,600 --> 00:05:24,020
To je jednostavna tekstualna datoteka koja sadrži tekst
da bi mogli upisati na tipkovnici,

111
00:05:24,020 --> 00:05:30,070
ali to obično, ali ne uvijek
završava u ne Txt, ali .html ili .htm.

112
00:05:30,070 --> 00:05:32,050
A ti ne samo
vrstu riječi u datoteci.

113
00:05:32,050 --> 00:05:35,280
Vi zapravo morate koristiti stvari zove
oznake ili, općenitije, nešto

114
00:05:35,280 --> 00:05:37,190
zove označni jezik.

115
00:05:37,190 --> 00:05:40,510
>> Tako da ću vrlo brzo upisati
a onda objasniti na sljedeći način.

116
00:05:40,510 --> 00:05:42,290
Idem prvi
ovaj tip, koji kaže:

117
00:05:42,290 --> 00:05:45,730
hej, preglednik, ovdje dolazi
web stranica napisana u HTML-u.

118
00:05:45,730 --> 00:05:51,850
A te dvije stvari zajedno reći, hej,
preglednik, sljedeći je doista HTML.

119
00:05:51,850 --> 00:05:55,790
Hej, preglednik, ovdje dolazi
Glava ili na vrhu moje stranice.

120
00:05:55,790 --> 00:05:59,900
Hej, preglednik, unutar vrha
moja stranica, stavite naslov koji je "dobar dan,

121
00:05:59,900 --> 00:06:01,610
svijet."

122
00:06:01,610 --> 00:06:08,370
Hej, preglednik, nakon što je šef mom
stranica, ovdje dolazi u tijelo moje stranice.

123
00:06:08,370 --> 00:06:12,170
I, hej, preglednik, tijelo moje
Stranica također treba reći: "Hello World".

124
00:06:12,170 --> 00:06:15,500
Pa što su istaknute detalje ovdje?

125
00:06:15,500 --> 00:06:17,960
To je ono što je općenito
zove doc tipa deklaracija,

126
00:06:17,960 --> 00:06:20,190
i, iskreno, to je malo
teško zapamtiti to na prvom mjestu.

127
00:06:20,190 --> 00:06:21,481
Vi samo vrsta copy-paste ga.

128
00:06:21,481 --> 00:06:23,760
To je formalni način
govoreći, hej, preglednik,

129
00:06:23,760 --> 00:06:28,030
Ja sam koristeći HTML verzije 5 koji
izašla nešto u zadnje vrijeme.

130
00:06:28,030 --> 00:06:31,380
To je čarobno bajanje da su neki
ljudi sa siromašnima smislu dizajna

131
00:06:31,380 --> 00:06:33,640
odlučila staviti na
samom vrhu datoteke.

132
00:06:33,640 --> 00:06:35,473
Iako je to
Malo arcane, to je sve

133
00:06:35,473 --> 00:06:38,250
to means-- Hej, preglednik, ovdje
dolazi s verzijom 5 HTML-a.

134
00:06:38,250 --> 00:06:41,741
>> Ostatak toga je s nama
već neko vrijeme, povijesno,

135
00:06:41,741 --> 00:06:44,740
ali to je bio razvija, a to je
Vjerojatno je uzimajući malo jednostavnije.

136
00:06:44,740 --> 00:06:47,320
Obavijest nekoliko karakteristika
onoga što sam istaknuo.

137
00:06:47,320 --> 00:06:49,890
Tu je sve to s pod kutom
brackets-- lijevi nosač

138
00:06:49,890 --> 00:06:51,040
i pravo nosač.

139
00:06:51,040 --> 00:06:52,490
A primijetiti simetriju ovdje.

140
00:06:52,490 --> 00:06:57,340
I simetrije, mislim, baš kao što sam
imaju ovaj start oznaku mjesta ili otvorenu oznaku

141
00:06:57,340 --> 00:07:01,560
ako hoćete, ovdje imam
blizu tag ili završna oznaka da je to

142
00:07:01,560 --> 00:07:06,460
razlikuju samo utoliko što je ovaj
slash na početku riječi

143
00:07:06,460 --> 00:07:07,360
HTML.

144
00:07:07,360 --> 00:07:09,360
A možete misliti
to kao što sam bio slučajno

145
00:07:09,360 --> 00:07:12,280
predlaganje prije, hej,
preglednik, ovdje dolazi neki HTML.

146
00:07:12,280 --> 00:07:16,060
A, s druge strane, hej, preglednik, to je
to za HTML-- početku i na kraju.

147
00:07:16,060 --> 00:07:18,440
>> U međuvremenu hej, preglednik, ovdje
dolazi glavu moju stranicu.

148
00:07:18,440 --> 00:07:20,140
Hej, preglednik, to je to za glavu.

149
00:07:20,140 --> 00:07:22,240
Hej, preglednik, ovdje je
tijelo moje stranice.

150
00:07:22,240 --> 00:07:24,020
Hej, preglednik, to je to za tijelo.

151
00:07:24,020 --> 00:07:26,940
A unutar toga neki
proizvoljan tekst za sada.

152
00:07:26,940 --> 00:07:30,520
A unutar glave, u međuvremenu,
neka proizvoljna, ali označene,

153
00:07:30,520 --> 00:07:34,410
da tako kažemo, tekst koji kaže, naslov
moje stranice će biti "dobar dan, svijet."

154
00:07:34,410 --> 00:07:37,470
Sada, za sada, možete
pretpostaviti da preglednike

155
00:07:37,470 --> 00:07:41,762
imaju only-- ili, bolje rečeno, web stranice imaju
samo dva parts-- glavu i tijelo.

156
00:07:41,762 --> 00:07:44,220
A glava je uglavnom samo
kao na traci izbornika, stvari

157
00:07:44,220 --> 00:07:45,510
zapravo samo na samom vrhu.

158
00:07:45,510 --> 00:07:48,910
A tijelo je utrobu stranice
sve u tom velikom pravokutniku

159
00:07:48,910 --> 00:07:50,239
da ispunjava zaslon.

160
00:07:50,239 --> 00:07:51,780
Tako ću ići naprijed i učiniti.

161
00:07:51,780 --> 00:07:54,400
Ja ću ići naprijed i
kliknite Spremi, File Save.

162
00:07:54,400 --> 00:07:58,580
I ja ću spasiti
ovo kao hello.html,

163
00:07:58,580 --> 00:08:00,870
a ja sam samo ide
stavi ga na radnoj površini.

164
00:08:00,870 --> 00:08:03,520
I ja ću otići
naprijed i kliknite Spremi.

165
00:08:03,520 --> 00:08:05,806
I notice-- moj Mac na
Najmanje je vikala na mene.

166
00:08:05,806 --> 00:08:07,180
Jeste li sigurni da želite to učiniti?

167
00:08:07,180 --> 00:08:08,710
A ja ću reći, da, koristite HTML.

168
00:08:08,710 --> 00:08:10,400
Ja znam bolje u ovom slučaju.

169
00:08:10,400 --> 00:08:14,686
A sada ću ići na moj desktop
gdje sam imati taj dokument koji iznenada.

170
00:08:14,686 --> 00:08:16,060
A ja ću dvaput kliknite na nju.

171
00:08:16,060 --> 00:08:18,268
A vi ćete primijetiti da je,
default, Chrome otvorio.

172
00:08:18,268 --> 00:08:19,996
To je zato što je to
moj zadani preglednik.

173
00:08:19,996 --> 00:08:21,370
I to samo kaže: "dobar dan, svijet."

174
00:08:21,370 --> 00:08:23,078
No, ona kaže: "dobar dan,
svijet "na dva mjesta.

175
00:08:23,078 --> 00:08:23,979
Obavijest gornjem lijevom kutu.

176
00:08:23,979 --> 00:08:25,020
Prilično je teško propustiti.

177
00:08:25,020 --> 00:08:26,180
To je velik i hrabar.

178
00:08:26,180 --> 00:08:30,690
A gdje drugdje se čini
reći: "hello, world"?

179
00:08:30,690 --> 00:08:31,470
>> PUBLIKA: kartica.

180
00:08:31,470 --> 00:08:33,100
>> DAVID J. Malan: Da, sama kartica.

181
00:08:33,100 --> 00:08:35,159
Dakle, kada sam rekao na glavu
stranica je sve gore top--

182
00:08:35,159 --> 00:08:36,367
i doista, ovo je naslov.

183
00:08:36,367 --> 00:08:37,710
To je samo na kartici ovdje.

184
00:08:37,710 --> 00:08:40,320
I mogu povući ovu karticu
van kako ne bi zbuniti.

185
00:08:40,320 --> 00:08:43,360
Ovo je samo jedan tab sada,
i zaista vidimo "hello, world"

186
00:08:43,360 --> 00:08:45,970
ovdje i "Hello, World" ovdje.

187
00:08:45,970 --> 00:08:47,160
Dakle, prilično jednostavan.

188
00:08:47,160 --> 00:08:49,050
No, to je također prilično jednostavan.

189
00:08:49,050 --> 00:08:50,440
I, zapravo, zumirao sam.

190
00:08:50,440 --> 00:08:53,272
Ja mogu mijenjati veličinu fonta jednostavno
uvećati za pristupačnost.

191
00:08:53,272 --> 00:08:56,830
Ali neka se sada nešto učiniti
malo više zanimljiv.

192
00:08:56,830 --> 00:08:59,760
>> Idem go-- ups, neka
mi da se vratim na moj tekst datoteku.

193
00:08:59,760 --> 00:09:02,400
Vraćam se na moj
tekstualna datoteka, a ja ću

194
00:09:02,400 --> 00:09:06,320
da se to promijeni i reći
"Halo, Disney World."

195
00:09:06,320 --> 00:09:07,970
Uštedjeti.

196
00:09:07,970 --> 00:09:10,919
I vratiti se u moj
Preglednik i kliknite Obnovi.

197
00:09:10,919 --> 00:09:12,710
I sad, naravno, to
kaže: "Disney World".

198
00:09:12,710 --> 00:09:15,500
A ja ću umjetno povećavanje
u samo tako da je lakše za vidjeti.

199
00:09:15,500 --> 00:09:19,012
Tako sada, na žalost, ja vrsta želim
to-- zapravo, to je Mac značajka.

200
00:09:19,012 --> 00:09:21,720
Želim kliknite na Disney World
i otići negdje kao disney.com,

201
00:09:21,720 --> 00:09:23,290
ali to ne radi.

202
00:09:23,290 --> 00:09:26,850
Dakle, osnovno načelo webu
hiperveza, poveznice koje idu negdje drugdje.

203
00:09:26,850 --> 00:09:28,390
Pa kako ću to učiniti?

204
00:09:28,390 --> 00:09:34,690
Pa, ja samo mogu reći:
"Halo, http://www.disney.com".

205
00:09:34,690 --> 00:09:36,110
Spremi.

206
00:09:36,110 --> 00:09:37,620
Ponovno učitati.

207
00:09:37,620 --> 00:09:39,400
Ali i to, ne možete odabrati.

208
00:09:39,400 --> 00:09:42,930
A što je lijepo ovdje, iako
ovo nije funkcionalna još,

209
00:09:42,930 --> 00:09:45,930
je da se čini da je
Preglednik doslovno samo da

210
00:09:45,930 --> 00:09:46,950
što ja to kažem.

211
00:09:46,950 --> 00:09:50,110
Dakle, ako sam samo upisati URL ovako,
to je samo ide da mi pokaže URL.

212
00:09:50,110 --> 00:09:54,270
Moram koristiti oznake ili oznake
jezik zapravo reći

213
00:09:54,270 --> 00:09:55,621
preglednik učiniti još više.

214
00:09:55,621 --> 00:09:57,870
Tako ću ići naprijed i
brisanje tome na trenutak.

215
00:09:57,870 --> 00:10:00,980
A ja ću reći, hej,
preglednik, pokretanje sidro ovdje

216
00:10:00,980 --> 00:10:02,650
veza da se tako izrazim.

217
00:10:02,650 --> 00:10:07,500
I hiper-referenca, odredište
tog sidra, trebao bi biti taj URL.

218
00:10:07,500 --> 00:10:08,750
A primijetiti moje citate.

219
00:10:08,750 --> 00:10:11,590
Dobro bi mi jednostruke navodnike, također,
ali morate biti dosljedni,

220
00:10:11,590 --> 00:10:14,270
a ja uglavnom bih samo koristiti
dvostruki navodnici da i dalje ostane jednostavan.

221
00:10:14,270 --> 00:10:16,820
Obavijest ću zatvoriti oznaku.

222
00:10:16,820 --> 00:10:21,160
I onda ovdje idem
reći, "Disney World".

223
00:10:21,160 --> 00:10:26,890
I sad mi treba neki symmetry--
otvorena zagrada, / a, zatvorena zagrada.

224
00:10:26,890 --> 00:10:28,090
>> Zato što sam uveo?

225
00:10:28,090 --> 00:10:30,100
Mi smo imali već nekoliko oznaka.

226
00:10:30,100 --> 00:10:32,410
HTML, voditelj, glava, tijelo,
Sve su oznake, da tako kažemo,

227
00:10:32,410 --> 00:10:34,280
s otvorenim i zatvorenim kolegama.

228
00:10:34,280 --> 00:10:36,530
No, obavijest, to je neka vrsta
od temelja drugačije.

229
00:10:36,530 --> 00:10:39,140
To je ono što ćemo nazvati
u HTML atribut.

230
00:10:39,140 --> 00:10:41,451
A atribut je
samo ključ-vrijednost par.

231
00:10:41,451 --> 00:10:43,950
To je uobičajena stvar u
računala science-- ključ-vrijednost par.

232
00:10:43,950 --> 00:10:45,770
To je vrsta alata u trgovini.

233
00:10:45,770 --> 00:10:47,040
Ključni i vrijednost.

234
00:10:47,040 --> 00:10:49,390
Riječ, a zatim neke
druga riječ ili riječi.

235
00:10:49,390 --> 00:10:53,790
I u ovom slučaju, ključ je href,
a vrijednost je kako je puna URL.

236
00:10:53,790 --> 00:10:57,890
A što atribut se je to
utječe na ponašanje oznake.

237
00:10:57,890 --> 00:11:01,010
I u ovom slučaju, moramo utjecati
ponašanje oznaka za sidrenje,

238
00:11:01,010 --> 00:11:04,140
jer moramo sidriti
ovaj link na negdje.

239
00:11:04,140 --> 00:11:06,960
I kako ti se učini da je
putem atributa.

240
00:11:06,960 --> 00:11:08,970
>> Tako ću ići naprijed
i spremite datoteku sada.

241
00:11:08,970 --> 00:11:11,300
Vratite se na moj preglednik i ponovno učitati.

242
00:11:11,300 --> 00:11:14,580
I, voila, mi sada imamo
Počeci legitimne web stranice.

243
00:11:14,580 --> 00:11:18,420
Super jednostavno, ali ako sam lebdjeti iznad
učinimo obavijest u donjem lijevom kutu,

244
00:11:18,420 --> 00:11:19,830
to je super-mali.

245
00:11:19,830 --> 00:11:21,730
Ali vidite www.disney.com.

246
00:11:21,730 --> 00:11:27,076
I ako sam ga klik, dapače to
whisks me da disney.com.

247
00:11:27,076 --> 00:11:29,380
Sada je interesantna stvar
ovdje je da se ne

248
00:11:29,380 --> 00:11:33,940
best-- najviše utržive URL, ali
to je u redu, jer je ova datoteka ne

249
00:11:33,940 --> 00:11:35,360
postoje na World Wide Webu.

250
00:11:35,360 --> 00:11:39,740
Ona postoji kao lokalni datoteke u naizgled
moji korisnici directory-- / jharvard--

251
00:11:39,740 --> 00:11:41,890
za John Harvard-- / desktop.

252
00:11:41,890 --> 00:11:42,634
Ali to ima URL.

253
00:11:42,634 --> 00:11:43,800
To se događa samo da se lokalno.

254
00:11:43,800 --> 00:11:47,050
Nažalost, nitko od vas ne može posjetiti
ovo, jer ako upišete ovaj URL,

255
00:11:47,050 --> 00:11:49,980
da bih se reći preglednik,
Potražite datoteku pod nazivom hello.html

256
00:11:49,980 --> 00:11:50,772
na tvrdom disku.

257
00:11:50,772 --> 00:11:53,271
I, naravno, osim ako ste
prati uz ručno,

258
00:11:53,271 --> 00:11:54,530
to neće postojati tamo.

259
00:11:54,530 --> 00:11:55,190
>> Dakle, to je u redu.

260
00:11:55,190 --> 00:11:57,815
Još uvijek je potrebno način, u konačnici,
dobiti ovu sliku na webu,

261
00:11:57,815 --> 00:12:01,180
ali neka se zafrkavati, osim par
sigurnosne implikacije onoga što smo upravo

262
00:12:01,180 --> 00:12:04,850
vidio i vezati ga natrag na ranije
rasprava od jutros.

263
00:12:04,850 --> 00:12:08,200
Ispada da, ako
Preglednik doslovno samo radi

264
00:12:08,200 --> 00:12:12,560
što ja to kažem, a čini
biti slučaj da sidro tag

265
00:12:12,560 --> 00:12:17,380
utjecajem vrijednosti
ovaj atribut zove href

266
00:12:17,380 --> 00:12:20,810
ali to pokazuje ova
tekst, to bi izgledalo

267
00:12:20,810 --> 00:12:26,520
implicirati da sam mogao staviti URL
na oba mjesta, a zatim ponovno

268
00:12:26,520 --> 00:12:29,100
a sada vidim URL i otići u URL-u.

269
00:12:29,100 --> 00:12:32,680
Obavijest, ako sam lebdjeti iznad donjem lijevom,
Ja zaista ide još disney.com.

270
00:12:32,680 --> 00:12:38,340
>> Dakle, ako ste ikada bili
phished-- P-H-I-S-H-E-D-

271
00:12:38,340 --> 00:12:42,820
jedan od onih lažnih poruka e-pošte
od kao što je PayPal svoje banke,

272
00:12:42,820 --> 00:12:46,470
vjerojatno ste stečen veze unutar
od e-mail koji ste čitajući to

273
00:12:46,470 --> 00:12:49,970
kaže da kliknite ovdje da ide potvrdu
ste lozinku ili potvrdite svoj datum rođenja

274
00:12:49,970 --> 00:12:53,840
ili socijalnog ili nešto društveno
inženjering vam otkriti

275
00:12:53,840 --> 00:12:54,920
informacija.

276
00:12:54,920 --> 00:12:57,625
Pa, mogao bih nekako uzeti
Prednost ove, ne bih?

277
00:12:57,625 --> 00:13:01,240
Mogla bih reći nešto
kao, www.paypal.com.

278
00:13:01,240 --> 00:13:11,340
I umjesto disney.com sam
mogao ići na, kao, badguy.com.

279
00:13:11,340 --> 00:13:12,850
Ponovno učitati.

280
00:13:12,850 --> 00:13:16,620
A kako je lako prevariti,
pogotovo ne-tehnički čitač

281
00:13:16,620 --> 00:13:20,649
ili površno čitanje
Čitatelj ne kliknuti

282
00:13:20,649 --> 00:13:23,940
veza kao što je ovaj, što ako ja kliknite it--
Ja zapravo ne želim ići badguy.com.

283
00:13:23,940 --> 00:13:25,398
Ne znam što je stvarno tamo.

284
00:13:25,398 --> 00:13:30,080
Dakle paypal.com, obavijest je
ono što kaže da će,

285
00:13:30,080 --> 00:13:33,210
ali naravno, ako pogledam dolje
super niska, to je malo mutno,

286
00:13:33,210 --> 00:13:34,230
ali ona kaže badguy.com.

287
00:13:34,230 --> 00:13:38,644
To je jedini odmah reći
da idem na krivom mjestu.

288
00:13:38,644 --> 00:13:41,560
A kad sam rekao ranije da su banke
stvarno ne bi trebao poticati ili vlak

289
00:13:41,560 --> 00:13:44,510
korisnike da kliknu veze, to
je samo jedna od manifestacija toga.

290
00:13:44,510 --> 00:13:45,430
I to je tako jednostavno.

291
00:13:45,430 --> 00:13:48,120
Sada ste protivnik, ako
učiniti nešto ovako

292
00:13:48,120 --> 00:13:51,000
i pokušati izigrati korisnika
u posjetu vaše web stranice.

293
00:13:51,000 --> 00:13:53,320
No, za sada ćemo zadržati
stvari lijepo i čisto.

294
00:13:53,320 --> 00:13:55,640
Mi ćemo ići naprijed
i natrag te promjene.

295
00:13:55,640 --> 00:13:56,530
Ponovo učitajte stranicu.

296
00:13:56,530 --> 00:13:57,740
I ja sam se vratiti na disney.com.

297
00:13:57,740 --> 00:14:00,660
>> Da vidimo, ako ne možemo zafrkavati
ovo osim malo više.

298
00:14:00,660 --> 00:14:04,160
Dakle, "hello, Disney World."

299
00:14:04,160 --> 00:14:05,950
Ja ću reći ovdje.

300
00:14:05,950 --> 00:14:08,220
Možda ću napraviti malo mjesta.

301
00:14:08,220 --> 00:14:12,730
"Nadamo se da ćete uživati ​​u Vašem boravku!"

302
00:14:12,730 --> 00:14:13,830
Uštedjeti.

303
00:14:13,830 --> 00:14:15,850
Ponovno učitati.

304
00:14:15,850 --> 00:14:19,010
Nije rea-- to nije
ono što sam namjeravao, zar ne?

305
00:14:19,010 --> 00:14:21,870
Mislim, ako sam liječenje moj tekst
file kao program za obradu teksta,

306
00:14:21,870 --> 00:14:24,894
što si nadam se će se dogoditi ovdje?

307
00:14:24,894 --> 00:14:27,060
Da, osjećam se kao da
treba biti prijelom reda ovdje,

308
00:14:27,060 --> 00:14:28,799
tako da se osjeća lud na neki način.

309
00:14:28,799 --> 00:14:31,090
Ali to je zapravo namjerno,
jer baš kao i prije,

310
00:14:31,090 --> 00:14:33,381
preglednik je samo da odete na
to što ti to kažem.

311
00:14:33,381 --> 00:14:34,806
Nisam to ispričao probiti linije.

312
00:14:34,806 --> 00:14:37,930
Nisam to rekla za pomicanje prema dolje, čak
Ipak, intuitivno, osjećam se kao da jesam.

313
00:14:37,930 --> 00:14:39,805
Tako ispada da je potrebno
malo više označavanje,

314
00:14:39,805 --> 00:14:41,390
a ja ću popraviti ovo što slijedi.

315
00:14:41,390 --> 00:14:46,160
Idem predgovor ovaj prvi zdravo
s tim što se naziva stav oznaka.

316
00:14:46,160 --> 00:14:48,920
A onda ću ići naprijed
i zamotati ovu drugu rečenicu

317
00:14:48,920 --> 00:14:54,370
u drugom stavku oznaku, iako
oni su super kratke odlomke.

318
00:14:54,370 --> 00:14:55,930
Sada ću spasiti.

319
00:14:55,930 --> 00:14:57,160
Ponovno učitati.

320
00:14:57,160 --> 00:14:59,070
I sada imamo da
prostor, a mi na neki način

321
00:14:59,070 --> 00:15:01,680
imaju semantiku
dva zasebna stavka.

322
00:15:01,680 --> 00:15:05,290
>> To je sve u redu i dobro, ali to bi
biti lijepo dodati sliku na ovu stranicu,

323
00:15:05,290 --> 00:15:08,710
pa ću ići tražiti
Mickey Mouse na Google slikama.

324
00:15:08,710 --> 00:15:12,830
I samo za zabavu, ja sam
ide da iskoristite ovu sliku.

325
00:15:12,830 --> 00:15:15,350
Ja ću ići naprijed i sada
zgrabite URL ove slike,

326
00:15:15,350 --> 00:15:16,510
iako je drukčije
načina kako to učiniti.

327
00:15:16,510 --> 00:15:18,520
Za sada, Samo ću kopirati URL.

328
00:15:18,520 --> 00:15:24,770
Idem se vratiti u moj tekst
file, a ja ću reći ovdje,

329
00:15:24,770 --> 00:15:31,160
img src = citat citat
koji URL, super-dugo.

330
00:15:31,160 --> 00:15:34,580
A onda je pojam jednog
slika je malo drugačija.

331
00:15:34,580 --> 00:15:38,640
Tu stvarno nema pojam pokretanja
slika i završio sliku,

332
00:15:38,640 --> 00:15:40,630
kao početna oznaka krajnjeg oznaku.

333
00:15:40,630 --> 00:15:43,840
Tako da se osjeća malo čudno
mi semantički to učiniti,

334
00:15:43,840 --> 00:15:45,390
imati oznaku close-slike.

335
00:15:45,390 --> 00:15:46,780
To nije netočno.

336
00:15:46,780 --> 00:15:48,840
To je savršeno u pravu,
i to je ohrabrio,

337
00:15:48,840 --> 00:15:50,870
ali tu je skraćenica.

338
00:15:50,870 --> 00:15:53,780
Ja mogu vrsta istovremeno
otvaranje i zatvaranje istu oznaku,

339
00:15:53,780 --> 00:15:55,510
te da će učiniti preglednik sretan.

340
00:15:55,510 --> 00:15:56,950
Dakle, to je samo malo
jezgrovitija za stvari

341
00:15:56,950 --> 00:15:59,408
da konceptualno stvarno ne
smisla za početak i kraj.

342
00:15:59,408 --> 00:16:01,190
Oni samo postoje ili nisu.

343
00:16:01,190 --> 00:16:06,020
>> Zato ću spasiti ovu i vratiti
mom "Halo, svijet" stranicu i reload.

344
00:16:06,020 --> 00:16:09,880
A to je malo van kontrole,
jer ta slika je zapravo

345
00:16:09,880 --> 00:16:12,210
malo velika, ali to je u redu.

346
00:16:12,210 --> 00:16:13,710
Mogao sam ga promijeniti veličinu u programu.

347
00:16:13,710 --> 00:16:14,900
Ili znaš što.

348
00:16:14,900 --> 00:16:17,350
Samo pokazati, ja sam
će zapravo reći

349
00:16:17,350 --> 00:16:21,760
da je širina ovome treba
samo 200 piksela, 200 točaka.

350
00:16:21,760 --> 00:16:24,360
Pusti me naprijed i spasiti
i ponovno učitati, a sada stranici

351
00:16:24,360 --> 00:16:25,690
izgleda malo razumnije.

352
00:16:25,690 --> 00:16:27,260
Ali primijetite uzorak.

353
00:16:27,260 --> 00:16:30,030
Pa, ja sam nekako naučio sve što
HTML u nekom smislu, barem

354
00:16:30,030 --> 00:16:33,531
konceptualno, jer sve HTML je je
to tags-- otvorene oznake, zatvorena oznake,

355
00:16:33,531 --> 00:16:35,280
i atributa koji
mijenjati svoje ponašanje.

356
00:16:35,280 --> 00:16:38,380
I, očito, svaki
Oznaka može imati nula ili jedan

357
00:16:38,380 --> 00:16:43,005
odnosno dva ili više atributa, svaki od
koji se nešto malo drugačije.

358
00:16:43,005 --> 00:16:44,380
Sada, kako znaš što postoji?

359
00:16:44,380 --> 00:16:46,800
Vi samo slušati nekoga
kao što ću vam što postoji,

360
00:16:46,800 --> 00:16:50,860
ili se samo Google okolo za tutorial
o HTML-u, i to je zapravo vrlo jednostavno.

361
00:16:50,860 --> 00:16:54,030
>> Zaista, kad sam bio undergrad
prije mnogo godina i naučili HTML,

362
00:16:54,030 --> 00:16:56,530
jedan od mojih matematike nastave
asistenti samo proveo

363
00:16:56,530 --> 00:16:59,600
malo vremena me podučavanje
za kao što je pola sata, sat vremena,

364
00:16:59,600 --> 00:17:00,660
i tada sam bio na putu.

365
00:17:00,660 --> 00:17:03,300
Bio sam na putu prema tome
najviše odvratna web ikad,

366
00:17:03,300 --> 00:17:05,549
koja je, očito, nisam
stvarno napredovala dalje.

367
00:17:05,549 --> 00:17:09,849
No, poanta je da, nakon što se
razumijem ove jednostavne ideas--

368
00:17:09,849 --> 00:17:13,450
ako kompliciranih text-- ali to jednostavno
ideje počinju misao

369
00:17:13,450 --> 00:17:15,960
i zatvaranje misao, imajući
sve lijepo uravnotežena,

370
00:17:15,960 --> 00:17:19,150
gleda nešto gore, mijenjanja
Ponašanje tom oznakom, to je stvarno sve

371
00:17:19,150 --> 00:17:20,079
što je na njega.

372
00:17:20,079 --> 00:17:28,140
A u stvari, ako ćemo sada ići
nešto poput google.com-- zapravo,

373
00:17:28,140 --> 00:17:31,920
idemo mjesto malo više
reasonable-- stanford.edu.

374
00:17:31,920 --> 00:17:37,800
I ja ću ići za pregled,
Programer, Pogledaj izvor.

375
00:17:37,800 --> 00:17:41,400
To je ružno, ali notice--
a ja ću povećavanje obavijesti

376
00:17:41,400 --> 00:17:43,432
neke stvari koje je poznato već.

377
00:17:43,432 --> 00:17:45,140
Tu je to ovdje,
koji je browser.

378
00:17:45,140 --> 00:17:46,800
Ovdje dolazi HTML5.

379
00:17:46,800 --> 00:17:47,634
Postoji HTML.

380
00:17:47,634 --> 00:17:49,550
Navodno, postoji
atribut da nisam

381
00:17:49,550 --> 00:17:51,540
korištenje koji određuje
jezik stranice,

382
00:17:51,540 --> 00:17:54,380
i to može pomoći s automatskim
prijevod i takve stvari.

383
00:17:54,380 --> 00:17:55,546
Evo glava stranice.

384
00:17:55,546 --> 00:17:57,790
Evo naslov Stanfordskog stranice.

385
00:17:57,790 --> 00:17:59,832
Tu je oznaka nisam
govoriti o yet-- Meta tag.

386
00:17:59,832 --> 00:18:01,540
To je samo neka vrsta
popratne informacije.

387
00:18:01,540 --> 00:18:04,210
Pomaže kod SEO, ili
search-engine optimizacija,

388
00:18:04,210 --> 00:18:06,320
ili Google-rezultatima pretraživanja ili slično.

389
00:18:06,320 --> 00:18:09,029
Ali ako smo držati obličje, voditi
izgleda, ovdje je tijelo oznaka.

390
00:18:09,029 --> 00:18:11,570
A tu je i grozdove drugi
Oznake nismo razgovarali o još.

391
00:18:11,570 --> 00:18:13,750
Ali Div je jedan za
Podjela stranice.

392
00:18:13,750 --> 00:18:16,680
To je poput nevidljivog pravokutnika
ako vrsta želi psihički

393
00:18:16,680 --> 00:18:20,160
podijeliti svoju stranicu u
Različite jedinice online.

394
00:18:20,160 --> 00:18:22,650
I onda puno divova sam
vidjeti, nešto što se zove klasa,

395
00:18:22,650 --> 00:18:24,440
ali ćemo se vratiti na to.

396
00:18:24,440 --> 00:18:26,200
>> To je interesting-- Obrasci.

397
00:18:26,200 --> 00:18:27,730
Obrasci su na cijelom webu.

398
00:18:27,730 --> 00:18:30,310
Svaki okvir za pretraživanje da si
nikad korišten je oblik.

399
00:18:30,310 --> 00:18:31,490
I, tako, neka je zapravo vidjeti.

400
00:18:31,490 --> 00:18:32,790
Oblik.

401
00:18:32,790 --> 00:18:33,910
Akcijski.

402
00:18:33,910 --> 00:18:37,660
Radnja ovog oblika, iz bilo kojeg
povijesni razlozi, da je URL.

403
00:18:37,660 --> 00:18:38,840
Metoda je "post".

404
00:18:38,840 --> 00:18:44,060
Ispostavilo se da je HTTP zahtjevi mogu koristiti
glagol "get", kao što smo vidjeli prije,

405
00:18:44,060 --> 00:18:45,070
ili "post".

406
00:18:45,070 --> 00:18:47,030
I da će vidjeti razliku
to je u ovom trenutku.

407
00:18:47,030 --> 00:18:48,363
Idemo zapravo vidjeti što je to.

408
00:18:48,363 --> 00:18:49,830
Pusti me da se vratim na Stanford stranici.

409
00:18:49,830 --> 00:18:53,330
Koji oblik razgovaraju
o, što misliš?

410
00:18:53,330 --> 00:18:54,485
Ono što skače na vas?

411
00:18:54,485 --> 00:18:54,970
>> PUBLIKA: Okvir za pretraživanje.

412
00:18:54,970 --> 00:18:55,845
>> DAVID J. Malan: Da.

413
00:18:55,845 --> 00:18:58,410
Tako se u gornjem desnom kutu
Ovdje je to okvir za pretraživanje.

414
00:18:58,410 --> 00:19:02,441
A to je kako oni provode it--
oznaka koja je doslovno otvorenih zagrada oblika.

415
00:19:02,441 --> 00:19:03,940
A onda ćemo tražiti nešto.

416
00:19:03,940 --> 00:19:09,220
Idemo tražiti prijatelj
od mine-- "Nick Parlante".

417
00:19:09,220 --> 00:19:11,380
Enter.

418
00:19:11,380 --> 00:19:13,750
I naravno, on je otišao na
malo drugačiji URL.

419
00:19:13,750 --> 00:19:15,140
Pusti me da se vratim ovdje.

420
00:19:15,140 --> 00:19:18,960
Idemo tražiti "tečajevi".

421
00:19:18,960 --> 00:19:19,460
Kvragu.

422
00:19:19,460 --> 00:19:20,484
Otišao na drugom URL-u.

423
00:19:20,484 --> 00:19:23,400
Dakle, Stanford je dodao neke magije
da oni ne me da se na URL

424
00:19:23,400 --> 00:19:25,820
što smo vidjeli u
akcija atribut tamo.

425
00:19:25,820 --> 00:19:32,480
No, ovaj oblik ovdje se provodi isključivo
putem ovog markup ovdje, ove oznake.

426
00:19:32,480 --> 00:19:35,710
U stvari, ovdje je ulaz za
vrsta pretraživanja koje želite.

427
00:19:35,710 --> 00:19:38,940
Ovdje je ulaz za
druga vrsta pretraživanja.

428
00:19:38,940 --> 00:19:41,960
Ovdje je ulaz za samu niza.

429
00:19:41,960 --> 00:19:45,394
I tako nije cilj da zamotate
naše misli oko svih tih oznaka

430
00:19:45,394 --> 00:19:46,060
ali samo da vidi.

431
00:19:46,060 --> 00:19:48,300
To je samo otvaranje i zatvaranje
oznake i traže stvari.

432
00:19:48,300 --> 00:19:48,560
Da?

433
00:19:48,560 --> 00:19:48,920
Victoria?

434
00:19:48,920 --> 00:19:49,795
>> PUBLIKA: [nečujan]

435
00:19:49,795 --> 00:19:51,925

436
00:19:51,925 --> 00:19:53,550
DAVID J. Malan: To je dobro pitanje.

437
00:19:53,550 --> 00:19:54,660
To je malo trickier vidjeti.

438
00:19:54,660 --> 00:19:56,300
Pusti me da se vratim na to
pitanje u samo nekoliko minuta

439
00:19:56,300 --> 00:19:59,000
kad smo pogled na nešto što se zove
CSS ili Cascading Style Sheets,

440
00:19:59,000 --> 00:20:02,500
i mi možemo pokušati zaključiti
koliko sa stranice.

441
00:20:02,500 --> 00:20:08,090
Dakle, ako mi sada pogledati google.com,
da vidimo što je njihova stranica izgleda.

442
00:20:08,090 --> 00:20:09,840
Ti bi they're-- da je slatka i danas.

443
00:20:09,840 --> 00:20:12,490

444
00:20:12,490 --> 00:20:12,990
U REDU.

445
00:20:12,990 --> 00:20:13,690
Sve učinjeno.

446
00:20:13,690 --> 00:20:15,260
U redu, tako View Source.

447
00:20:15,260 --> 00:20:19,590
Vi mislite da bi Google
jako lijepo izvorni kod.

448
00:20:19,590 --> 00:20:24,970
Dakle, očito, ono što se ovdje događa?

449
00:20:24,970 --> 00:20:27,880
A u stvari, to nije čak i HTML.

450
00:20:27,880 --> 00:20:30,930
To je nešto što se zove JavaScript.

451
00:20:30,930 --> 00:20:32,344
I neka je zadržati ide i ide.

452
00:20:32,344 --> 00:20:34,010
Ja uopće ne znam gdje se stranica počne.

453
00:20:34,010 --> 00:20:37,240
Idem koristiti Command
F, otvorena zagrada HTML.

454
00:20:37,240 --> 00:20:38,200
U redu, tu je.

455
00:20:38,200 --> 00:20:44,150
Našao sam početak stranice i
Postoji toliko stvari ovdje.

456
00:20:44,150 --> 00:20:45,310
>> Što se zapravo događa?

457
00:20:45,310 --> 00:20:47,460
Pa, znaš što,
možemo očistiti ovo gore.

458
00:20:47,460 --> 00:20:52,109
Ako sam umjesto toga ići na to provjerite,
alatna traka, ovaj posebni dijagnostički alat,

459
00:20:52,109 --> 00:20:54,150
i otići da ne mrežu,
gdje ćemo zadržati ide danas,

460
00:20:54,150 --> 00:20:56,420
ali ako idem elemenata,
ono što je stvarno lijepo

461
00:20:56,420 --> 00:20:59,990
je da preglednik ima puno
mnogo bolje oči nego ja.

462
00:20:59,990 --> 00:21:02,670
I preglednik može čitati
koji nered na web-stranici,

463
00:21:02,670 --> 00:21:04,700
da HTML mail samo mi
pogledao, a to može

464
00:21:04,700 --> 00:21:08,340
analizirati ga i čitati i
analizirati ga i formatirati ga

465
00:21:08,340 --> 00:21:09,910
u lijepoj ljudskoj-friendly način.

466
00:21:09,910 --> 00:21:11,740
Dakle, ono što sam sada vidjela
u ovom zaslonu ovdje

467
00:21:11,740 --> 00:21:15,470
pod elemenata, isti sadržaj,
ali su razvedene sve,

468
00:21:15,470 --> 00:21:18,140
oni su ga colorized, ali
to je isti tekst

469
00:21:18,140 --> 00:21:19,620
da sam skinuti s poslužitelja.

470
00:21:19,620 --> 00:21:23,630
>> A što je lijepo sad je vidim
u tijelu, za instance-- obavijesti,

471
00:21:23,630 --> 00:21:26,480
stranica još uvijek u sastavu
samo glava i tijelo,

472
00:21:26,480 --> 00:21:28,660
i ja hijerarhijski može roniti ovdje.

473
00:21:28,660 --> 00:21:32,420
Uočite da je Google izgleda da ima
da divs-- ovo i ovo.

474
00:21:32,420 --> 00:21:33,310
Mogu proširiti to.

475
00:21:33,310 --> 00:21:35,370
Tu je cijela hrpa drugih divova.

476
00:21:35,370 --> 00:21:36,900
Dakle, to je malo složenija.

477
00:21:36,900 --> 00:21:37,400
Ali čekaj.

478
00:21:37,400 --> 00:21:40,970
To se čini tako mnogo više
čitati, relativno, od ovoga.

479
00:21:40,970 --> 00:21:43,840
Zašto je Google neugodno
Sama po samo slanje

480
00:21:43,840 --> 00:21:50,400
ovaj veliki nered kod nekih
sortirati samo provesti nešto

481
00:21:50,400 --> 00:21:53,640
da izgleda tako jednostavno na prvi pogled?

482
00:21:53,640 --> 00:21:55,270
Kao, zašto ne dodati više prostora?

483
00:21:55,270 --> 00:21:56,811
Zašto nisu pritisnite Enter kao što sam učinio?

484
00:21:56,811 --> 00:21:59,110
Pogledajte kako dobro sam
u pisanju web stranice.

485
00:21:59,110 --> 00:22:00,680
Udario sam Unesite toliko vrijedno.

486
00:22:00,680 --> 00:22:03,760
razvedena sam tako sve
je tako lijepa i čitljiv.

487
00:22:03,760 --> 00:22:08,463
Zašto Google ne prakticiraju isto?

488
00:22:08,463 --> 00:22:11,409
>> PUBLIKA: [nečujan]

489
00:22:11,409 --> 00:22:12,305

490
00:22:12,305 --> 00:22:13,180
DAVID J. Malan: Dobro.

491
00:22:13,180 --> 00:22:14,270
Vrlo pošteno.

492
00:22:14,270 --> 00:22:16,650
Oni nemaju neki
Osoba na Googleu ručno

493
00:22:16,650 --> 00:22:18,160
ažuriranje početnu stranicu više.

494
00:22:18,160 --> 00:22:20,010
Nije 1999 više.

495
00:22:20,010 --> 00:22:21,140
Dakle, oni imaju softver.

496
00:22:21,140 --> 00:22:25,397
Oni imaju i druge alate koji
generirati dinamički oni HTML.

497
00:22:25,397 --> 00:22:27,480
Naravno, da je sama kod
napisao je ljudi,

498
00:22:27,480 --> 00:22:30,220
ali stvarnost je,
to je sasvim pošteno reći,

499
00:22:30,220 --> 00:22:33,340
preglednik sigurno ne
zanima me koliko je neuredan kod je.

500
00:22:33,340 --> 00:22:35,940
No, tu je još
uvjerljiv tehnički razlog

501
00:22:35,940 --> 00:22:42,580
da Google distribuira svoj HTML
kod u takav neuredan, naizgled

502
00:22:42,580 --> 00:22:48,350
neodoljiv način svi upakiran zajedno
s vrlo malo way-- vrlo malo

503
00:22:48,350 --> 00:22:51,274
na putu oblikovanja kao što sam učinio.

504
00:22:51,274 --> 00:22:52,570
>> PUBLIKA: [nečujan]

505
00:22:52,570 --> 00:22:53,528
>> DAVID J. Malan: Brže?

506
00:22:53,528 --> 00:22:54,040
Zašto?

507
00:22:54,040 --> 00:22:55,680
I što si rekao, Lydia?

508
00:22:55,680 --> 00:22:56,240
Brže?

509
00:22:56,240 --> 00:22:57,281
Zašto brže?

510
00:22:57,281 --> 00:22:58,156
PUBLIKA: [nečujan]

511
00:22:58,156 --> 00:23:00,522

512
00:23:00,522 --> 00:23:02,230
DAVID J. Malan: Nema
nema mjesta za čitanje.

513
00:23:02,230 --> 00:23:02,730
Da.

514
00:23:02,730 --> 00:23:04,560
Tako da mislim o tome što je prostor.

515
00:23:04,560 --> 00:23:08,394
Dakle, svaki lik na tipkovnici traje
neki iznos od prostora za zastupanje,

516
00:23:08,394 --> 00:23:10,560
ili fizički, kao što je to
zauzima toliko prostora,

517
00:23:10,560 --> 00:23:13,250
ili nekako ispod
napa, koja zahtijeva memoriju.

518
00:23:13,250 --> 00:23:15,740
I kao aside--, a mi ćemo
više govoriti o ovom tomorrow--

519
00:23:15,740 --> 00:23:19,930
svaki lik na tipkovnici
obično zahtijeva 8 bitova, ili jedan bajt.

520
00:23:19,930 --> 00:23:23,360
Dakle, uzorak od 8 nula ili
one, ili samo jedan bajt, kao što smo

521
00:23:23,360 --> 00:23:24,720
ljudi će obično reći.

522
00:23:24,720 --> 00:23:27,690
Dakle, to je mala, ali
to je još uvijek nije nula.

523
00:23:27,690 --> 00:23:29,940
To je još uvijek neki iznos od prostor.

524
00:23:29,940 --> 00:23:36,082
Dakle, ako je inženjer ili Google hits
razmaknicu samo jednom, i pretpostavimo

525
00:23:36,082 --> 00:23:38,540
Googleu, to je super-popular--
Pretpostavljam da milijardu ljudi

526
00:23:38,540 --> 00:23:40,780
posjetite njihovu stranicu za jedan dan,
ili neki broj ljudi

527
00:23:40,780 --> 00:23:43,290
posjetite početnu stranicu A
milijardu puta na dan,

528
00:23:43,290 --> 00:23:48,890
koliko dodatnih bajtova mora da
Softver inženjer samo košta Google

529
00:23:48,890 --> 00:23:51,310
skom njegov ili njezin razmaknicu jednom?

530
00:23:51,310 --> 00:23:52,692
>> PUBLIKA: [nečujan]

531
00:23:52,692 --> 00:23:54,150
DAVID J. Malan: Nije baš tako loše.

532
00:23:54,150 --> 00:23:57,070
Samo jedan puta bajta milijardu.

533
00:23:57,070 --> 00:23:57,871
Tako A-

534
00:23:57,871 --> 00:23:59,120
PUBLIKA: 8 milijardi gigabajta.

535
00:23:59,120 --> 00:24:00,370
DAVID J. Malan: Nije 8000000000.

536
00:24:00,370 --> 00:24:01,240
8 milijardi bajtova.

537
00:24:01,240 --> 00:24:02,410
No, jedan gigabajt.

538
00:24:02,410 --> 00:24:04,080
1 gigabajt će biti jedinica mjere.

539
00:24:04,080 --> 00:24:08,240
Ako on ili ona ne dva
prostori, 2 gigabajta.

540
00:24:08,240 --> 00:24:09,030
Tri gigabajta.

541
00:24:09,030 --> 00:24:09,530
Pravo?

542
00:24:09,530 --> 00:24:11,860
To vage nepovoljnije.

543
00:24:11,860 --> 00:24:16,150
I tako u slučajevima kao što su Google,
koji je, gotovo, su ekstremni slučajevi,

544
00:24:16,150 --> 00:24:21,450
postoje i drugi problemi koji se javljaju samo
čineći vrlo razumne odluke

545
00:24:21,450 --> 00:24:25,744
ili uzimanje vrlo jednostavne ljudske aktivnosti,
jer ima uvećanom učinak.

546
00:24:25,744 --> 00:24:27,660
Dakle, jedan od razloga
ovo izgleda tako stisnut

547
00:24:27,660 --> 00:24:30,660
Upravo kao što je Victoria said-- je to
samo generira računalima ionako.

548
00:24:30,660 --> 00:24:31,900
Dakle, nije velika stvar.

549
00:24:31,900 --> 00:24:33,309
Neka preglednik shvatiti.

550
00:24:33,309 --> 00:24:35,350
Ali to isto tako namjerno
nema puno prostora,

551
00:24:35,350 --> 00:24:36,766
jer prostor nije potrebno.

552
00:24:36,766 --> 00:24:38,250
A prostor je zapravo košta.

553
00:24:38,250 --> 00:24:40,670
>> To bilo košta vremena,
jer samo na guranje

554
00:24:40,670 --> 00:24:44,670
da je mnogo više podataka izvan
Sjedište Google.com je upravo

555
00:24:44,670 --> 00:24:47,710
ima da se neki iznos
vrijeme, čak i ako je to milisekundi

556
00:24:47,710 --> 00:24:51,190
ili mikrosekundi, ali dodaje da
više toliko korisnika, ili vjerojatnije,

557
00:24:51,190 --> 00:24:52,270
to vjerojatno košta.

558
00:24:52,270 --> 00:24:54,690
Google vjerojatno se povezuje s
netko drugi u svijetu, jedan

559
00:24:54,690 --> 00:24:56,398
onih viri
boda, a ako su

560
00:24:56,398 --> 00:24:59,880
neka vrsta financijske veze
pri čemu troškovi svoje podatke novac,

561
00:24:59,880 --> 00:25:01,730
oni možda i
minimizirati koliko podataka

562
00:25:01,730 --> 00:25:04,530
oni pljuju na
njihov priključak za internet.

563
00:25:04,530 --> 00:25:07,630
>> Tako je smiješno što je, međutim, u konačnici,
ili možda ohrabrujuća stvar,

564
00:25:07,630 --> 00:25:11,030
je da, iako ovo izgleda strašno
Velika je na kraju krajeva,

565
00:25:11,030 --> 00:25:16,750
to je još uvijek točne istim načelima kao i
Ovo je vrlo jednostavan stranica ovdje za HTML

566
00:25:16,750 --> 00:25:17,390
stranica.

567
00:25:17,390 --> 00:25:20,610
Dakle, samo sažeti i tako da
imaju kanonske verzije, ako niste bili

568
00:25:20,610 --> 00:25:25,900
sljedeće zajedno po izboru ovdje, ovdje
Možda najjednostavnija web stranica,

569
00:25:25,900 --> 00:25:28,240
tako nešto da se igraju s možda kasnije.

570
00:25:28,240 --> 00:25:30,790
>> Pa, neka je uvesti
Nekoliko drugih ideja sada.

571
00:25:30,790 --> 00:25:33,420
Uskoro ćemo uvesti
nešto što se zove stil oznaku.

572
00:25:33,420 --> 00:25:38,110
Možemo stilizovati ovu stranicu
u više zanimljivih načina.

573
00:25:38,110 --> 00:25:40,860
Dakle, dok je HTML e-mail
je sve o označavanje

574
00:25:40,860 --> 00:25:44,470
podaci, vrsta navođenja do
Preglednik kako strukturirati podatke,

575
00:25:44,470 --> 00:25:48,110
gdje staviti to, CSS, ili
Cascading Style Sheets,

576
00:25:48,110 --> 00:25:52,640
je drugi jezik koji
općenito dobiva miješati s HTML

577
00:25:52,640 --> 00:25:55,670
kao što ćemo see-- ali možemo očistiti
da se u moment-- koji traje

578
00:25:55,670 --> 00:25:59,850
to je konačni milja, a to je stilizira.

579
00:25:59,850 --> 00:26:02,460
Ona dobiva boje samo pravo,
font veličine samo pravo,

580
00:26:02,460 --> 00:26:03,860
pozicioniranje samo pravo.

581
00:26:03,860 --> 00:26:06,510
To je sve o estetici
ili oblikovanje, a ne o

582
00:26:06,510 --> 00:26:08,330
temeljni podaci sama.

583
00:26:08,330 --> 00:26:11,390
A najlakši način da se pokaže
to je možda primjer.

584
00:26:11,390 --> 00:26:15,320
Tako ću ići preko
na moje jednostavne tekstualne datoteke.

585
00:26:15,320 --> 00:26:17,970
A u samo jednom trenutku, ja ću
hoda nas kroz proces

586
00:26:17,970 --> 00:26:19,360
za to sami.

587
00:26:19,360 --> 00:26:23,310
>> Idem se vratiti na moj datoteku
tu i ponovno učitati stranicu samo

588
00:26:23,310 --> 00:26:25,800
Za potvrdu kako to izgleda.

589
00:26:25,800 --> 00:26:27,190
To je mjesto gdje smo na sada.

590
00:26:27,190 --> 00:26:31,170
Osjećam se kao djeca će uživati
ima malo boje na ovoj web stranici.

591
00:26:31,170 --> 00:26:34,480
Tako ću ići ovdje
u zaglavlju stranice.

592
00:26:34,480 --> 00:26:38,130
I ja ću učiniti stil, / stil.

593
00:26:38,130 --> 00:26:44,060
I onda unutar toga, ja ću
za reći tijelo moje page--

594
00:26:44,060 --> 00:26:46,870
i to oblikovanje je, na
prvi pogled, možda i malo

595
00:26:46,870 --> 00:26:49,400
čudno, ali konvencionalni.

596
00:26:49,400 --> 00:26:55,010
Ja ću reći da je u pozadini
Boja ove stranice bi trebao biti zelene boje.

597
00:26:55,010 --> 00:26:57,960
A to je, nažalost,
vrsta nije najbolji dizajn.

598
00:26:57,960 --> 00:27:00,710
Uočite da je prethodno
u svijetu HTML,

599
00:27:00,710 --> 00:27:03,190
Rekao sam da atributi
su ti parovi ključeva i vrijednosti.

600
00:27:03,190 --> 00:27:05,760
Nešto jednak citat
citat "nešto".

601
00:27:05,760 --> 00:27:08,810
U svijetu CSS, koji je bio
dizajniran od strane nekih različitih ljudi,

602
00:27:08,810 --> 00:27:11,020
odlučili su da je, u svojim
svijet, parovi ključeva i vrijednosti

603
00:27:11,020 --> 00:27:13,920
bi riječ debelo nešto.

604
00:27:13,920 --> 00:27:15,220
Dakle, to je ista ideja, ipak.

605
00:27:15,220 --> 00:27:18,620
To je udruživanje vrijednost
s nekim ključ koji na neki način

606
00:27:18,620 --> 00:27:20,330
utječe na ponašanje ove stranice.

607
00:27:20,330 --> 00:27:21,901
>> A što vjerojatno možete pogoditi.

608
00:27:21,901 --> 00:27:24,150
Što je to vjerojatno ide
učiniti čak i ako ste nikada

609
00:27:24,150 --> 00:27:27,867
Vidio HTML ili CSS prije?

610
00:27:27,867 --> 00:27:29,450
PUBLIKA: Promjena boje pozadine.

611
00:27:29,450 --> 00:27:30,560
DAVID J. Malan: Da,
promijeniti boju pozadine.

612
00:27:30,560 --> 00:27:33,280
A posebno
Boja pozadine tijela.

613
00:27:33,280 --> 00:27:36,290
No, u mjeri u kojoj
Tijelo za sada je web

614
00:27:36,290 --> 00:27:38,870
page-- to je jedina stvar
ispod naslovne trake really--

615
00:27:38,870 --> 00:27:40,870
vjerojatno će
utjecati na istu stvar.

616
00:27:40,870 --> 00:27:41,430
Tako ćemo vidjeti.

617
00:27:41,430 --> 00:27:42,490
Idemo spasiti ovo.

618
00:27:42,490 --> 00:27:44,310
Ići ovdje i ponovno učitati.

619
00:27:44,310 --> 00:27:46,140
To je prilično odvratan.

620
00:27:46,140 --> 00:27:48,070
A što se događa
Ovdje je nuspojava.

621
00:27:48,070 --> 00:27:49,850
Samo sam izabrao ovu sliku slučajno.

622
00:27:49,850 --> 00:27:53,305
Zašto je nije zelena
prožima iza Mickey?

623
00:27:53,305 --> 00:27:54,180
PUBLIKA: [nečujan]

624
00:27:54,180 --> 00:27:56,880

625
00:27:56,880 --> 00:27:57,880
DAVID J. Malan: Upravo tako.

626
00:27:57,880 --> 00:28:01,750
Ispostavilo se da slika, lijepa
mnogo sve slike koje smo mogli koristiti,

627
00:28:01,750 --> 00:28:03,670
svi rectangles-- pravokutnika.

628
00:28:03,670 --> 00:28:07,710
Čak i ako Mickey ima neke krivulje
za sebe i ima pozadinu,

629
00:28:07,710 --> 00:28:09,330
da pozadina mora biti nešto.

630
00:28:09,330 --> 00:28:10,280
To mora biti bijela.

631
00:28:10,280 --> 00:28:11,910
To mora biti crno ili nešto drugo.

632
00:28:11,910 --> 00:28:13,650
To može biti transparentan.

633
00:28:13,650 --> 00:28:16,100
A u stvari, mogao bih
otvoriti Mickey Mouse ovdje

634
00:28:16,100 --> 00:28:18,590
u programu pod nazivom Photoshop
ili nešto slično

635
00:28:18,590 --> 00:28:21,176
i promijeniti sve to bijelo
pozadina transparentna,

636
00:28:21,176 --> 00:28:22,550
tako da je zeleni bi se sjaji kroz.

637
00:28:22,550 --> 00:28:25,980
Ali to je nešto što bi trebao
pitati o sebi ili grafičar

638
00:28:25,980 --> 00:28:28,130
ili dizajner na mom
društvo, na primjer,

639
00:28:28,130 --> 00:28:31,490
učiniti, pogotovo jer sam upravo
posudio ovaj jedan s interneta.

640
00:28:31,490 --> 00:28:33,030
No, to je razlog zašto se to događa.

641
00:28:33,030 --> 00:28:34,980
>> Dakle, ono što drugi možda želimo učiniti?

642
00:28:34,980 --> 00:28:41,040
Pa, možda želite kažemo
Stvarno se nadam da ćete uživati ​​u boravku.

643
00:28:41,040 --> 00:28:44,150
A za naglasak, želim
da bi se ova jaka,

644
00:28:44,150 --> 00:28:48,310
pa ja ću reći otvoreno jaka i
zatvoriti jaka, a zatim ponovno učitati.

645
00:28:48,310 --> 00:28:50,320
I to je malo teško
vidjeti na projektoru

646
00:28:50,320 --> 00:28:53,250
ali možda stvarno sada
skače na vas malo više.

647
00:28:53,250 --> 00:28:56,180
Na taj način možete dodati kurziv u ovom
Tako hrabar okrenuto na ovaj način.

648
00:28:56,180 --> 00:28:57,500
Mogli bismo promijeniti boje.

649
00:28:57,500 --> 00:29:01,610
U stvari, samo za slatkiš, ja sam
ići naprijed i učiniti.

650
00:29:01,610 --> 00:29:05,120
Ja stvarno ne sviđa kako je
stavci su tako blizu zajedno,

651
00:29:05,120 --> 00:29:06,870
tako da sam mogao učiniti nešto ovako.

652
00:29:06,870 --> 00:29:13,310
Idem reći preglednik,
promijene stav oznaku da su,

653
00:29:13,310 --> 00:29:16,952
neka je say-- zapravo, znaš što,
neka je uskladiti to text-align, centar.

654
00:29:16,952 --> 00:29:19,410
I opet, znam da je ovo samo
zato što je netko nauči me

655
00:29:19,410 --> 00:29:21,118
ili sam ga gledao u
online referenca.

656
00:29:21,118 --> 00:29:22,450
Pa neka me spasi ovo.

657
00:29:22,450 --> 00:29:25,070
I, ah, sada sam
usmjeren sliku tamo.

658
00:29:25,070 --> 00:29:28,490
I zapravo, znaš što, ako
Ja se presele moju sliku u stavku

659
00:29:28,490 --> 00:29:34,510
tag-- tako i treći stavak,
iako to nije tekst.

660
00:29:34,510 --> 00:29:36,917
Idemo spasiti i ponovno učitati.

661
00:29:36,917 --> 00:29:40,000
Sada je stranica počinje izgledati vrsta
of-- Mislim, to je još uvijek prilično ružno,

662
00:29:40,000 --> 00:29:43,180
ali barem izgleda da sam proveo
dvije minute umjesto jedne minute

663
00:29:43,180 --> 00:29:43,950
čineći ga.

664
00:29:43,950 --> 00:29:47,200
>> I tako, postupno, možemo napraviti
te estetske promjene sada se na stranicu?

665
00:29:47,200 --> 00:29:50,860
Nisam stvarno promijenio podatke u
Stranica osim dodavanja riječ stvarno.

666
00:29:50,860 --> 00:29:52,650
Ja sam dodao metapodatke, ako hoćete.

667
00:29:52,650 --> 00:29:54,830
Hej, preglednik, iskoristite
Riječ "stvarno" podebljano.

668
00:29:54,830 --> 00:29:56,940
No, podaci nisu jaki.

669
00:29:56,940 --> 00:29:57,830
To je metapodataka.

670
00:29:57,830 --> 00:29:59,410
Podaci su "stvarno".

671
00:29:59,410 --> 00:30:02,200
Dakle, još uvijek imamo neke
isti pojmovi kao prije.

672
00:30:02,200 --> 00:30:05,990
Sada, naravno, to nije na webu,
pa ću to učiniti posljednji korak ovdje.

673
00:30:05,990 --> 00:30:10,300
>> Ja ću ići na hello.html
i samo istaknuti i kopirati ovaj.

674
00:30:10,300 --> 00:30:12,285
A sada idem
ići u Cloud9, koji

675
00:30:12,285 --> 00:30:13,910
Ja ću vas provesti kroz koji trenutak.

676
00:30:13,910 --> 00:30:17,080
A izgledi su da ćete uskoro biti, ako
već nije, na zaslonu kao što je ovaj.

677
00:30:17,080 --> 00:30:21,080
I neka mi samo ti brz
Obilazak što Cloud9 zapravo jest.

678
00:30:21,080 --> 00:30:26,590
Dakle, opet Oblak 9
ova usluga u oblaku

679
00:30:26,590 --> 00:30:30,580
da ti i mi daje iluziju
da ima svoj vlastiti virtualni stroj

680
00:30:30,580 --> 00:30:33,090
u oblaku, tehnički
spremnik u oblaku

681
00:30:33,090 --> 00:30:35,160
da imamo punu
administrativne povlastice.

682
00:30:35,160 --> 00:30:37,130
Dakle, u teoriji, nitko
drugdje u svijetu ima

683
00:30:37,130 --> 00:30:39,152
Pristup na ekran Ja sam
gledajući upravo sada,

684
00:30:39,152 --> 00:30:40,860
osim možda ljudi
koji upravljaju site,

685
00:30:40,860 --> 00:30:43,470
jer tehnički su
fizički pristup i tako dalje.

686
00:30:43,470 --> 00:30:44,740
>> Dakle, što ćemo vidjeti u ovom okruženju?

687
00:30:44,740 --> 00:30:46,230
Idem smanjivanje,
jer je malo mala.

688
00:30:46,230 --> 00:30:48,104
I dopustite mi naglasiti iznad
ovdje samo na trenutak.

689
00:30:48,104 --> 00:30:53,210
Na lijevoj strani svomu i
ekran, tu je preglednik datoteka na lijevoj strani.

690
00:30:53,210 --> 00:30:55,362
Tako je sličan u duhu
Mac OS i Windows.

691
00:30:55,362 --> 00:30:57,070
To su sve od
datoteke na mom računu.

692
00:30:57,070 --> 00:30:59,250
I po defaultu, ako je vaš
Račun je poput moje,

693
00:30:59,250 --> 00:31:05,090
vidjet ćete i uskoro
helloworld.html i readme.md.

694
00:31:05,090 --> 00:31:07,950
Ovamo na desnoj strani, to je
gdje je moja tekstualne datoteke su idući u ići.

695
00:31:07,950 --> 00:31:11,620
Ako ste ikada koristili Microsoft
Riječ ili Notepad ili TextEdit,

696
00:31:11,620 --> 00:31:14,100
To je riječ moja uređivanje
datoteka će ići.

697
00:31:14,100 --> 00:31:16,540
A onda najviše kompliciranih
značajka ovog okruženja

698
00:31:16,540 --> 00:31:20,100
da nećemo stvarno potrebno koristiti se
ovdje se zove Terminal prozor.

699
00:31:20,100 --> 00:31:23,390
Ako ste koristili DOS iz
prošlost, to je Linux

700
00:31:23,390 --> 00:31:25,450
ili Linux ekvivalent DOS-a.

701
00:31:25,450 --> 00:31:28,190
To je tekst-temeljen interface--
nema klikova mišem, bez povlačenjem.

702
00:31:28,190 --> 00:31:30,770
Sve što možete učiniti je upisati
naredbe, ali te naredbe

703
00:31:30,770 --> 00:31:34,400
može stvoriti datoteke, premještanje datoteka, otvaranje
koji vodi, koji vodi, u neposrednoj blizini

704
00:31:34,400 --> 00:31:35,740
učiniti bilo koji broj stvari.

705
00:31:35,740 --> 00:31:38,060
No, za sada, samo ćemo
troše naše vrijeme ovdje.

706
00:31:38,060 --> 00:31:39,050
>> I tako ćemo to učiniti.

707
00:31:39,050 --> 00:31:41,008
Ako ste u to
okoliš, koji bi trebali

708
00:31:41,008 --> 00:31:45,900
se, ako ste stvorili radni prostor
već, ići naprijed i samo ići gore

709
00:31:45,900 --> 00:31:48,690
na File, New trenutak.

710
00:31:48,690 --> 00:31:51,740
A to će vam dati novi
Kartica upravo ovdje u sredini.

711
00:31:51,740 --> 00:31:54,250
I ja just-- i neka
ići naprijed i učiniti.

712
00:31:54,250 --> 00:31:59,910
Idemo naprijed, a sada ne File, Save
i ići naprijed i pozvati ga hello.html,

713
00:31:59,910 --> 00:32:02,740
Ne smije se miješati s
helloworld.html, što

714
00:32:02,740 --> 00:32:06,910
došao sa svojim novim besplatni korisnički račun,
što je samo uzorak datoteka.

715
00:32:06,910 --> 00:32:11,020
Vidjet ćete da se iznenada pojavi,
najvjerojatnije na lijevoj strani,

716
00:32:11,020 --> 00:32:12,810
a kartica će i dalje biti otvoren.

717
00:32:12,810 --> 00:32:21,300
I dopustite mi da vas potaknuti sad stvoriti
Na ovu sliku ili neki njihovi varijante.

718
00:32:21,300 --> 00:32:24,607
A ako ne može baš vidjeti na
ekran, to je identična preparatima

719
00:32:24,607 --> 00:32:26,190
da vjerojatno ima u drugoj kartici.

720
00:32:26,190 --> 00:32:29,296
>> Dakle, ukratko, napravite svoj prvi web stranicu,
spremiti ga, a zatim u samo jednom trenutku,

721
00:32:29,296 --> 00:32:31,170
Ja ću vam pokazati kako
zapravo može vidjeti ovo.

722
00:32:31,170 --> 00:32:32,970
No promijeniti barem jednu stvar.

723
00:32:32,970 --> 00:32:35,400
Promjena helloworld se
nešto po vlastitom izboru,

724
00:32:35,400 --> 00:32:39,821
tako da ste uvjereni da je vaš
file a ne onaj samo sam stvorio.

725
00:32:39,821 --> 00:32:40,320
U redu.

726
00:32:40,320 --> 00:32:43,804
A kad ste ready-- nema
rush-- kada ste spremni,

727
00:32:43,804 --> 00:32:46,220
ići naprijed i spremite datoteku
nakon što ste napravili ove promjene.

728
00:32:46,220 --> 00:32:49,540
A ako kliknete
Trčanje gumb do vrha, ovaj

729
00:32:49,540 --> 00:32:53,610
treba otvoriti novu karticu koja će reći
vi koji URL možete posjetiti datoteku na,

730
00:32:53,610 --> 00:32:56,380
ali to bi moglo potrajati nekoliko trenutaka da
citat citat "Start Apache", koji

731
00:32:56,380 --> 00:32:58,820
je naziv web poslužitelja.

732
00:32:58,820 --> 00:33:02,430
Dakle, budite oprezni kako bi učiniti upravo
što je u spisu u konačnici.

733
00:33:02,430 --> 00:33:04,610
Pa sad, ja ću zumirati.

734
00:33:04,610 --> 00:33:07,780
Ako počnem tipkati
open-nosač HTML, obavijest

735
00:33:07,780 --> 00:33:09,650
to me je navelo da završim misao.

736
00:33:09,650 --> 00:33:13,750
A ako sam završio misao ga,
automatski mi daje završnu oznaku.

737
00:33:13,750 --> 00:33:17,190
No, očekivanje onda ću pogoditi
Enter, a zatim premjestiti unutra

738
00:33:17,190 --> 00:33:21,180
a ne glavu unutra i
onda sam to tijelo iznutra.

739
00:33:21,180 --> 00:33:24,430
I to je malo čudno u početku,
jer radi posao za vas,

740
00:33:24,430 --> 00:33:27,110
ali shvatite da u konačnici
to vam štedi tipke.

741
00:33:27,110 --> 00:33:30,500
A u stvari, vrlo česta značajka
programskim okruženjima ovih dana

742
00:33:30,500 --> 00:33:33,260
i za izradu web stranica kao što su
ovo i stvarna programiranje,

743
00:33:33,260 --> 00:33:36,960
koje ćemo razgovarati sutra,
je te auto-kompletan značajke,

744
00:33:36,960 --> 00:33:39,710
stvari koje baš dopuštaju
programer ili dizajner

745
00:33:39,710 --> 00:33:42,010
upisati manje tipke na
postići istu stvar.

746
00:33:42,010 --> 00:33:43,176
Ponekad je dobro, ipak.

747
00:33:43,176 --> 00:33:44,560
Ponekad je samo neugodno.

748
00:33:44,560 --> 00:33:49,290

749
00:33:49,290 --> 00:33:54,010
A, opet, nakon što ste transkribira
slide ili neka njegova varijanta,

750
00:33:54,010 --> 00:33:57,360
možete kliknuti na gumb Pokreni se vrhu.

751
00:33:57,360 --> 00:33:59,910
A onda je u dnu
prozor, vi ćete biti informirani

752
00:33:59,910 --> 00:34:04,290
na ono URL možete posjetiti Vašu web stranicu.

753
00:34:04,290 --> 00:34:08,790
Mina, na primjer, je na
business-daharvard.c9users.io

754
00:34:08,790 --> 00:34:11,480
i tako dalje.

755
00:34:11,480 --> 00:34:14,580
U redu, neka me-- bilo kakvih pitanja?

756
00:34:14,580 --> 00:34:19,460
Bilo koja druga pitanja o samo dobivanje
to radi prije nego što smo dodali mogućnosti?

757
00:34:19,460 --> 00:34:21,692
I neka mi predloži, samo
da se ljudi comfortable--

758
00:34:21,692 --> 00:34:24,400
jer to je jedna stvar da se samo
copy-paste slijepo ono što sam učinio.

759
00:34:24,400 --> 00:34:27,177
Ali samo tako da se ljudi boriti
s barem jednim do-do,

760
00:34:27,177 --> 00:34:28,510
Idem okrenuti na neku glazbu.

761
00:34:28,510 --> 00:34:32,630
Idem predložiti popis
stvari koje potencijalno mogu dodati.

762
00:34:32,630 --> 00:34:34,086
I, naravno, možete koristiti Google.

763
00:34:34,086 --> 00:34:36,210
A zašto ne bismo samo
Predlažem da pokušate riješiti

764
00:34:36,210 --> 00:34:38,710
barem jedan određeni problem.

765
00:34:38,710 --> 00:34:45,090
Tako je u odnosu na oznake,
neka me ponovno ovo ovdje.

766
00:34:45,090 --> 00:34:48,280
>> Zapravo, neka mi stavi
ona u tekstualnom obliku.

767
00:34:48,280 --> 00:35:02,380
Recimo da je među oznakama možemo
korištenje ovdje su neke oznake ovamo.

768
00:35:02,380 --> 00:35:06,090
Vidjeli smo stava oznaku.

769
00:35:06,090 --> 00:35:07,850
Sada će se auto-kompletan.

770
00:35:07,850 --> 00:35:12,220
Stavak oznaka, oznaka za sidrenje.

771
00:35:12,220 --> 00:35:15,250
Recimo da želite
napraviti nešto veći,

772
00:35:15,250 --> 00:35:19,480
tako da možda volimo-članovima
raspon oznaka može pomoći.

773
00:35:19,480 --> 00:35:23,010
Pa, možda vam je potrebna pomoć
za to u samo nekoliko trenutaka.

774
00:35:23,010 --> 00:35:24,830
Vidjeli smo div.

775
00:35:24,830 --> 00:35:26,170
Vidjet ćete da postoji tablica.

776
00:35:26,170 --> 00:35:27,928
Postoji nešto što se zove tr, td.

777
00:35:27,928 --> 00:35:30,736

778
00:35:30,736 --> 00:35:32,860
Th, td.

779
00:35:32,860 --> 00:35:34,770
Vratite se da je u trenutku.

780
00:35:34,770 --> 00:35:36,590
Što bi drugo moglo biti pri ruci?

781
00:35:36,590 --> 00:35:38,310
Postoji jaka.

782
00:35:38,310 --> 00:35:43,640
Tu je naglasak, odnosno em.

783
00:35:43,640 --> 00:35:50,110
There's-- što drugo
Možda volite ovdje?

784
00:35:50,110 --> 00:35:51,930
Pa, mi ćemo uzeti
pogledajte ovo zajedno.

785
00:35:51,930 --> 00:35:53,230
Oblik, koji smo vidjeli.

786
00:35:53,230 --> 00:35:54,130
Ima oblik.

787
00:35:54,130 --> 00:35:56,500
Ima ulaz i nekoliko drugih.

788
00:35:56,500 --> 00:35:58,924

789
00:35:58,924 --> 00:36:00,090
U redu, učinimo to.

790
00:36:00,090 --> 00:36:02,330
Za odgovaranje na Victoria je
pitanje, neka me prvi

791
00:36:02,330 --> 00:36:05,020
samo bi bili sigurni da su svi
u mogućnosti da biste dobili njihov Hello rad.

792
00:36:05,020 --> 00:36:06,900
Onda neka me upoznati
par drugih ideja.

793
00:36:06,900 --> 00:36:09,209
Onda ćemo pustiti narod riješiti
neki problem sami.

794
00:36:09,209 --> 00:36:11,500
Tada smo zapravo će se vratiti
takvoj ideji obliku,

795
00:36:11,500 --> 00:36:14,950
a mi ćemo zapravo ponovno provesti
zajedno front-end sučelje,

796
00:36:14,950 --> 00:36:16,450
da tako kažemo, jer sam Google.

797
00:36:16,450 --> 00:36:19,700
Mi ćemo koristiti Google kao leđa kraj i neka
ih obaviti težak posao, traganje,

798
00:36:19,700 --> 00:36:22,760
ali ćemo stvoriti prednji kraj
Google i obrazac za pretraživanje

799
00:36:22,760 --> 00:36:24,520
da su na vlastitu početnu stranicu.

800
00:36:24,520 --> 00:36:27,050
I tako ćemo se vratiti
ove oznake u samo jednom trenutku.

801
00:36:27,050 --> 00:36:30,270
>> Dakle, to je ono što sam
predložio je prije samo trenutak.

802
00:36:30,270 --> 00:36:33,940
Možemo dodati stilizacija do
stranica unutar ovog stila oznake,

803
00:36:33,940 --> 00:36:36,950
a možemo stilizovati pozadinu
u boji, poravnavanje teksta,

804
00:36:36,950 --> 00:36:39,000
da li je to centar ili lijevo ili desno.

805
00:36:39,000 --> 00:36:41,630
No, vrlo brzo što bi
pronaći ili web dizajner

806
00:36:41,630 --> 00:36:44,060
bi se naći da je ovaj
postaje malo nezgrapan,

807
00:36:44,060 --> 00:36:48,330
jer radite ono što je
zove miješanje sadržaja

808
00:36:48,330 --> 00:36:50,120
uz predočenje istih.

809
00:36:50,120 --> 00:36:53,756
Ti miješanje podataka
i njegove estetike.

810
00:36:53,756 --> 00:36:56,380
A u stvari, ako uzmete u obzir
što će se dogoditi preko time--

811
00:36:56,380 --> 00:36:58,350
to je vrlo mali
web stranica, naravno.

812
00:36:58,350 --> 00:37:01,590
Ali ako dodam sadržaja na ovoj stranici
i ja dodavanje stila na ovu stranicu,

813
00:37:01,590 --> 00:37:04,650
stranica vrlo brzo dobiva
duže i duže i duže.

814
00:37:04,650 --> 00:37:07,510
I pretpostavimo da ja želim
imaju drugi web-stranicu koja

815
00:37:07,510 --> 00:37:09,010
dijeli neke od tih atributa.

816
00:37:09,010 --> 00:37:12,350
Recimo moj drugi web stranicu za moju
site-- Također, želim sve što centar,

817
00:37:12,350 --> 00:37:14,960
i ja također želim sve
sa zelenom pozadinom.

818
00:37:14,960 --> 00:37:17,940
Ja sam prilično mnogo morati
kopirati i zalijepiti neke od tih linija

819
00:37:17,940 --> 00:37:20,730
u toj drugoj datoteci, koja se osjeća dobro.

820
00:37:20,730 --> 00:37:22,030
To će riješiti problem.

821
00:37:22,030 --> 00:37:26,060
>> No, što ako želim novu stranicu
ili 30. stranici ili 40. stranici?

822
00:37:26,060 --> 00:37:28,730
Sada ću biti kopiranje i
lijepljenje puno duple koda

823
00:37:28,730 --> 00:37:30,430
u više datoteka.

824
00:37:30,430 --> 00:37:32,600
I tako pretpostavimo da
Ja odlučujem ili mi je rečeno,

825
00:37:32,600 --> 00:37:34,780
hej, mi ne upotrebljavate
zelena pozadina više.

826
00:37:34,780 --> 00:37:36,380
Mi ćemo početi koristiti naranču.

827
00:37:36,380 --> 00:37:38,690
Što morate promijeniti?

828
00:37:38,690 --> 00:37:42,900
Pa, morate promijeniti taj stil
od zelene do narančaste koliko mjesta?

829
00:37:42,900 --> 00:37:44,920
Kao i 30 ili 40 mjesta.

830
00:37:44,920 --> 00:37:45,900
To je zamorno.

831
00:37:45,900 --> 00:37:47,039
To je sklona pogreškama.

832
00:37:47,039 --> 00:37:49,580
Postoji cijeli niz razloga
gdje ne bi htio da izazove

833
00:37:49,580 --> 00:37:51,840
koja vrsta boli za sebe.

834
00:37:51,840 --> 00:37:54,760
I tako ne bi bilo lijepo
ako smo mogli uzeti ono što sam upravo

835
00:37:54,760 --> 00:37:58,240
staviti između ova dva žuta
oznake, te stil oznake,

836
00:37:58,240 --> 00:38:04,050
faktor ga i staviti sve moje
stilizacija u jednoj središnjoj datoteci

837
00:38:04,050 --> 00:38:08,470
da su svi 30 ili 40 mojih ostalih datoteka
posuditi od ili nekako referenca,

838
00:38:08,470 --> 00:38:11,640
ne za razliku od umrežavanja
Dijagrami smo radili prije?

839
00:38:11,640 --> 00:38:15,030
>> Dakle, ako ja ići u tu, ja sam
će zapravo predložiti

840
00:38:15,030 --> 00:38:17,880
da mi zamijenite
Oznaka stila s nečim

841
00:38:17,880 --> 00:38:21,620
zove veza oznaka, koji je
je užasno, užasno ime,

842
00:38:21,620 --> 00:38:24,370
zato što uopće ne koriste
Veza oznaka za stvaranje što

843
00:38:24,370 --> 00:38:26,380
mi ljudi znamo kao veza na web-stranici.

844
00:38:26,380 --> 00:38:29,750
Za to koristite kojima oznaku?

845
00:38:29,750 --> 00:38:31,464
Kako stvoriti vezu na web-stranici?

846
00:38:31,464 --> 00:38:32,130
Publika: a.

847
00:38:32,130 --> 00:38:34,870
DAVID J. Malan: U a, ili sidro
oznaka, koji je otišao u Disney prije.

848
00:38:34,870 --> 00:38:39,090
Veza oznaka se ovdje govori
učinimo link na datoteku pod nazivom

849
00:38:39,090 --> 00:38:44,350
styles.css, odnos u kojem
koja će se da je moja stila.

850
00:38:44,350 --> 00:38:48,290
Dakle, ovo je jedan od S-ih u
CSS-- CSS.

851
00:38:48,290 --> 00:38:50,490
Stil sheet-- dva slova S u CSS.

852
00:38:50,490 --> 00:38:52,550
CSS.

853
00:38:52,550 --> 00:38:58,640
To samo znači, hej, preglednik, idite
naći styles.css na lokalnom poslužitelju

854
00:38:58,640 --> 00:39:01,870
i koristi ga kao stilovima,
što znači da unutar te datoteke

855
00:39:01,870 --> 00:39:05,310
će biti sve od
stilizacije koje smo upravo učinili.

856
00:39:05,310 --> 00:39:07,396
I što je ta datoteka
može izgledati ovako je ovo.

857
00:39:07,396 --> 00:39:10,020
A ja ću samo napraviti to je brz
primjer, jer mi ne treba

858
00:39:10,020 --> 00:39:12,000
da se previše u korov ovdje.

859
00:39:12,000 --> 00:39:17,840
Ali ako ja to kopirati, ono što sam predlaže
je da programer stvoriti novu datoteku,

860
00:39:17,840 --> 00:39:24,450
zalijepiti u tim lines--
whoops-- zalijepiti u tim linijama,

861
00:39:24,450 --> 00:39:32,270
spremite ga kao styles.css, a zatim u
s druge datoteke, izbrisati sve to

862
00:39:32,270 --> 00:39:35,450
i zamijeniti ga umjesto
s tim veze oznaku.

863
00:39:35,450 --> 00:39:43,090
Tako da, ako mogu povezati href = "styles.css"
odnos mora biti "stylesheet"

864
00:39:43,090 --> 00:39:44,170
blizu oznaka.

865
00:39:44,170 --> 00:39:45,250
Spremi.

866
00:39:45,250 --> 00:39:47,000
Vrati se na moju helloworld.

867
00:39:47,000 --> 00:39:48,690
Ponovno učitati.

868
00:39:48,690 --> 00:39:51,290
>> Doslovno ništa se nije dogodilo.

869
00:39:51,290 --> 00:39:54,710
To je dobra stvar, jer to
znači to je zapravo sve funkcionira.

870
00:39:54,710 --> 00:39:58,860
Da bi dokazali koliko, recimo ja bi
pogreška pri upisu, a ja to nazivamo "styles.css"

871
00:39:58,860 --> 00:40:03,080
s velikim S, koja je
netočno, a zatim ponovno učitati.

872
00:40:03,080 --> 00:40:05,470
Sada možete vidjeti da jednostavno ne radi.

873
00:40:05,470 --> 00:40:06,362
Sada, zašto?

874
00:40:06,362 --> 00:40:08,070
Pa, neka je koristiti
tehnika od ranije.

875
00:40:08,070 --> 00:40:10,153
Pusti me naprijed i,
preglednik, u Chromeu, ja sam

876
00:40:10,153 --> 00:40:12,900
će otvoriti posebnu
Kartica mreže kao i prije,

877
00:40:12,900 --> 00:40:15,560
i neka mi se ponovno učitati stranicu.

878
00:40:15,560 --> 00:40:19,341
Koje su vam se ne iznenađen vidjeti sada?

879
00:40:19,341 --> 00:40:20,840
Ili možda ste iznenađeni da ga vidi.

880
00:40:20,840 --> 00:40:23,225
Bilo kako bilo, ono što vidite sada?

881
00:40:23,225 --> 00:40:24,100
PUBLIKA: [nečujan]

882
00:40:24,100 --> 00:40:24,770
DAVID J. Malan: To nije pronađen.

883
00:40:24,770 --> 00:40:25,680
Zašto se to nije pronađena?

884
00:40:25,680 --> 00:40:28,480
Pa, Styles.css-- kapital
S- ne postoji.

885
00:40:28,480 --> 00:40:29,230
Ja ga misnamed.

886
00:40:29,230 --> 00:40:30,430
Jednostavan pogreška pri upisu.

887
00:40:30,430 --> 00:40:33,816
Ali ja sam uzimajući razumljivo sada
404, jer server je rekao, hej,

888
00:40:33,816 --> 00:40:34,440
to nije pronađena.

889
00:40:34,440 --> 00:40:36,300
Doslovno, ne znam
gdje je ta datoteka.

890
00:40:36,300 --> 00:40:38,880
Dakle, kao rezultat toga, u preglednik
pokazuje ono što može,

891
00:40:38,880 --> 00:40:42,860
sirovi sadržaj stranice,
koji je bio 200, HTML,

892
00:40:42,860 --> 00:40:45,390
ali stilizacija ne mogu
se dodati nakon toga.

893
00:40:45,390 --> 00:40:47,120
A to je ono što se podrazumijeva pod kaskadno.

894
00:40:47,120 --> 00:40:49,070
Vi na neki način može dodati
nakon toga, i to na neki način

895
00:40:49,070 --> 00:40:50,874
oplemenjuje estetiku web stranici.

896
00:40:50,874 --> 00:40:53,790
A čak možete nadjačati one
stilova s ​​nekim drugim stylesheet datoteke

897
00:40:53,790 --> 00:40:54,700
ako želiš.

898
00:40:54,700 --> 00:40:57,780
To nije pronađena, ipak, u tom slučaju,
jer naravno, to sam misnamed.

899
00:40:57,780 --> 00:41:00,330
Dakle, ja bi to popraviti na prvom mjestu.

900
00:41:00,330 --> 00:41:04,667
>> Dakle idemo naprijed i
predlažu sljedeće.

901
00:41:04,667 --> 00:41:07,410

902
00:41:07,410 --> 00:41:11,140
Idemo naprijed i to učiniti.

903
00:41:11,140 --> 00:41:14,220
Počevši s možda
Vaš helloworld datoteka,

904
00:41:14,220 --> 00:41:17,740
neka mi samo pozvati par
od sadrže prijedloge.

905
00:41:17,740 --> 00:41:20,400
Dakle, Victoria, htjela si
napraviti neki tekst veći, zar ne?

906
00:41:20,400 --> 00:41:24,555
U redu, tako da možemo
ne čine tekst veći.

907
00:41:24,555 --> 00:41:26,860
A mi ćemo svakog iščupati off
samo jedan problem riješiti.

908
00:41:26,860 --> 00:41:30,867
Provjerite Tekst veći.

909
00:41:30,867 --> 00:41:32,700
Neću gnjaviti
pisanja ovog kad smo

910
00:41:32,700 --> 00:41:35,600
imaju metak tehnologiju upravo ovdje.

911
00:41:35,600 --> 00:41:39,970
Dakle, neki problemi.

912
00:41:39,970 --> 00:41:44,670
Dakle, idemo probati
da bi tekst veći.

913
00:41:44,670 --> 00:41:45,170
U redu.

914
00:41:45,170 --> 00:41:48,360
Što još će netko predložiti?

915
00:41:48,360 --> 00:41:50,332
Što još možda želimo
učiniti u web stranicu?

916
00:41:50,332 --> 00:41:52,040
Idemo se s
kratki popis stvari

917
00:41:52,040 --> 00:41:55,366
a zatim prenijeti pravo
Skupina to shvatiti.

918
00:41:55,366 --> 00:41:56,270
>> PUBLIKA: [nečujan]

919
00:41:56,270 --> 00:42:02,251
>> DAVID J. Malan: OK, tekst pozicija
na različitim stranama stranici?

920
00:42:02,251 --> 00:42:02,750
U redu.

921
00:42:02,750 --> 00:42:04,620
Nešto drugo.

922
00:42:04,620 --> 00:42:05,784
>> PUBLIKA: [nečujan]

923
00:42:05,784 --> 00:42:06,700
DAVID J. Malan: To je.

924
00:42:06,700 --> 00:42:08,720
Dakle, gif je samo
drugačiji format datoteke.

925
00:42:08,720 --> 00:42:12,830
Mi smo samo koristili, što, A
png ili jpg vjerojatno?

926
00:42:12,830 --> 00:42:14,480
Koristili smo jpg.

927
00:42:14,480 --> 00:42:16,780
Ako vas zanima, prekomjerna
odgovoriti na Vaše pitanje

928
00:42:16,780 --> 00:42:19,404
je jpg općenito koristi za
fotografije, jer podržava

929
00:42:19,404 --> 00:42:21,500
milijuni boja ili 24-bitnu boju.

930
00:42:21,500 --> 00:42:26,930
GIF obično se koristi za, kao,
internetski fenomeni ove days-- animacije,

931
00:42:26,930 --> 00:42:28,810
kao što su animirane GIF-ove.

932
00:42:28,810 --> 00:42:32,320
Ali to se događa da koriste manje boja
paleta, samo 256 mogućih boja,

933
00:42:32,320 --> 00:42:35,230
ali podržava
transparentnost i animacija.

934
00:42:35,230 --> 00:42:40,330
A tu je gif, koji podržava
transparentnost i više boja

935
00:42:40,330 --> 00:42:41,300
ali ne i animaciju.

936
00:42:41,300 --> 00:42:42,133
Tako da je trade-off.

937
00:42:42,133 --> 00:42:44,144

938
00:42:44,144 --> 00:42:46,060
Dakle, dodajući gif, ipak,
će biti funkcionalno

939
00:42:46,060 --> 00:42:48,396
ekvivalent za dodavanje png ili jpg.

940
00:42:48,396 --> 00:42:49,110
Da.

941
00:42:49,110 --> 00:42:50,550
izvor slike je jednaka.

942
00:42:50,550 --> 00:42:51,590
Tako nešto drugo.

943
00:42:51,590 --> 00:42:57,288
Idemo se s nečim što
uputili smo se Victoria učiniti ovdje.

944
00:42:57,288 --> 00:42:59,209
>> PUBLIKA: Dodavanje gumba za obrazac.

945
00:42:59,209 --> 00:43:00,000
DAVID J. Malan: U redu.

946
00:43:00,000 --> 00:43:02,179
Dakle, dodati gumbe za obrazac.

947
00:43:02,179 --> 00:43:03,470
I mi ćemo učiniti da je jedan zajedno.

948
00:43:03,470 --> 00:43:07,220
Tako da će biti savršen prikazali
odmah nakon tog izazova.

949
00:43:07,220 --> 00:43:10,357
Još nešto?

950
00:43:10,357 --> 00:43:11,440
Ono što možda želite učiniti?

951
00:43:11,440 --> 00:43:14,040

952
00:43:14,040 --> 00:43:16,516
Web osjeća vrlo underwhelming
ako je to sve što možemo učiniti.

953
00:43:16,516 --> 00:43:18,140
PUBLIKA: Promjena boje teksta.

954
00:43:18,140 --> 00:43:19,500
DAVID J. Malan: Promjena što?

955
00:43:19,500 --> 00:43:20,666
PUBLIKA: boja teksta.

956
00:43:20,666 --> 00:43:22,311
DAVID J. Malan: Promjena boje teksta.

957
00:43:22,311 --> 00:43:22,810
U redu.

958
00:43:22,810 --> 00:43:23,790
Dakle, neka je to.

959
00:43:23,790 --> 00:43:27,209
Samo jednom, tako da nisi, samo
po sjećanju, čini upravo ono što radim,

960
00:43:27,209 --> 00:43:29,500
Idem uključiti glazbu
za možda pet minuta ovdje.

961
00:43:29,500 --> 00:43:30,450
Vi ste dobrodošli da koristite Google.

962
00:43:30,450 --> 00:43:33,130
Vi ste dobrodošli da se mene pita, i
Ja ću šaptati savjet u uho.

963
00:43:33,130 --> 00:43:35,171
Vi ste dobrodošli da gledati
više na tuđim ramenima.

964
00:43:35,171 --> 00:43:37,340
Ali riješiti samo jedan od tih problema.

965
00:43:37,340 --> 00:43:40,190
No, mi ćemo učiniti posljednji, na
predstavlja jedan, i kad bismo mogli zajedno.

966
00:43:40,190 --> 00:43:42,790
Dakle, pet minuta riješiti
bilo koji od ovih problema

967
00:43:42,790 --> 00:43:46,780
pomoću Google, intuiciju, ili bilo
druga sredstva koje su Vam dostupne.

968
00:43:46,780 --> 00:43:48,630
>> [MUSIC SVIRA]

969
00:43:48,630 --> 00:43:49,130
U redu.

970
00:43:49,130 --> 00:43:50,838
Bez brige, ako želite
da petljaju,

971
00:43:50,838 --> 00:43:53,880
ali ja ću pokvariti par
od tih odgovora.

972
00:43:53,880 --> 00:43:57,986
Dakle, prvu sugestiju
Victoria je bila da se tekst veći.

973
00:43:57,986 --> 00:43:59,360
Dakle, postoji nekoliko načina da se to učini.

974
00:43:59,360 --> 00:44:01,530
Ja trenutno nisam obnovljena
moj ekran na ovu veličinu,

975
00:44:01,530 --> 00:44:04,310
iako sam zumirao
umjetno samo da vidi stvari.

976
00:44:04,310 --> 00:44:07,470
I neka je to.

977
00:44:07,470 --> 00:44:11,380
Pusti me naprijed i grab
neki generički latinski tekst

978
00:44:11,380 --> 00:44:19,540
Samo tako ćemo imati nešto za raditi.

979
00:44:19,540 --> 00:44:20,715
Dakle, daj mi samo jedan trenutak.

980
00:44:20,715 --> 00:44:21,840
Ja ću napraviti tri paragrafa.

981
00:44:21,840 --> 00:44:53,430

982
00:44:53,430 --> 00:44:53,930
U REDU.

983
00:44:53,930 --> 00:44:55,560
To će biti bolji primjer.

984
00:44:55,560 --> 00:44:57,840
Dakle, za znatiželjne, u
moj hello.html, samo sam

985
00:44:57,840 --> 00:45:01,645
zalijepiti tri besmislen
Latinski stavci

986
00:45:01,645 --> 00:45:03,270
Samo tako da imamo neki tekst za rad.

987
00:45:03,270 --> 00:45:06,720
Victoria je cilj bio da
čine dio teksta veći.

988
00:45:06,720 --> 00:45:09,879
Tako sam mogao, kao i prije, idu ovdje.

989
00:45:09,879 --> 00:45:11,170
I neka mi to učiniti na pravi način.

990
00:45:11,170 --> 00:45:13,253
Idem da imaju vezu
oznaka koja upućuje na datoteku

991
00:45:13,253 --> 00:45:20,560
pod nazivom "styles.css" odnos
od kojih je opet "stylesheet".

992
00:45:20,560 --> 00:45:25,221
A onda ću spasiti
i otvoriti taj "styles.css".

993
00:45:25,221 --> 00:45:28,940
>> Dakle, kao i prije, imam
Sposobnost u ovom CSS datoteke

994
00:45:28,940 --> 00:45:31,569
zapravo nadjačati zadane
Estetika web stranicu,

995
00:45:31,569 --> 00:45:33,860
i zadane estetika,
naravno, prilično dosadno.

996
00:45:33,860 --> 00:45:36,943
To je vrsta normalne veličine fonta, crna
tekst, bijela pozadina, i tako dalje.

997
00:45:36,943 --> 00:45:39,440
Dakle, pretpostavimo da želim napraviti
sve ovaj tekst veći.

998
00:45:39,440 --> 00:45:40,460
Što mogu učiniti nekoliko stvari.

999
00:45:40,460 --> 00:45:43,750
U mom styles.css datoteku, ja
Moglo bi se reći, znaš što,

1000
00:45:43,750 --> 00:45:46,950
primjenjuju se sljedeće da
tijelo moje stranice.

1001
00:45:46,950 --> 00:45:51,390
Idi naprijed i učiniti
veličina slova 24 točaka,

1002
00:45:51,390 --> 00:45:54,130
što je broj koji sam mogao
koristiti u Microsoft Word.

1003
00:45:54,130 --> 00:45:57,620
Pusti me da se vratim na moj web
stranica ovdje i ponovno učitavanje,

1004
00:45:57,620 --> 00:45:59,640
i možete vidjeti da je
to je već mnogo veći.

1005
00:45:59,640 --> 00:46:02,223
I mi možemo dobiti malo lud,
baš kao što možemo na desktop--

1006
00:46:02,223 --> 00:46:03,670
čine ga 96 bodova.

1007
00:46:03,670 --> 00:46:04,950
Ponovno učitati.

1008
00:46:04,950 --> 00:46:07,610
I to je sve malo
nezgrapan u ovom trenutku.

1009
00:46:07,610 --> 00:46:09,500
>> Ali mogao sam biti malo precizniji.

1010
00:46:09,500 --> 00:46:14,530
Umjesto primjene ove
stylesheet na tijelo moje stranice

1011
00:46:14,530 --> 00:46:21,740
Što mi još može ga primijeniti na umjesto toga,
što druge oznake koji bi mogli dalje

1012
00:46:21,740 --> 00:46:25,445
funkcionira na isti način?

1013
00:46:25,445 --> 00:46:26,444
>> PUBLIKA: p oznaku?

1014
00:46:26,444 --> 00:46:27,360
DAVID J. Malan: P oznaka.

1015
00:46:27,360 --> 00:46:29,350
Dakle, glava ne bi bilo
točno, jer po glavi,

1016
00:46:29,350 --> 00:46:31,300
ne mogu zapravo
kontrolira estetiku.

1017
00:46:31,300 --> 00:46:32,700
Tu je bilo tekst ili ne.

1018
00:46:32,700 --> 00:46:36,760
No, p tag-- mogu zaroniti u nešto
dublje, da tako kažemo, u stavku

1019
00:46:36,760 --> 00:46:37,350
oznake.

1020
00:46:37,350 --> 00:46:41,600
I iako postoje tri,
to je savršeno u redu, jer je u CSS,

1021
00:46:41,600 --> 00:46:44,900
kad sam samo reći: "p", to
znači primijeniti sljedeće

1022
00:46:44,900 --> 00:46:48,300
na bilo koji tag da odgovara ovom
Selektor, selektor samo

1023
00:46:48,300 --> 00:46:49,430
kao naziv oznake.

1024
00:46:49,430 --> 00:46:52,350
Dakle, gdje god vidite
"P", primjenjuju veličinu fonta,

1025
00:46:52,350 --> 00:46:55,222
i neka je to učiniti više
razumno again-- 24 bod.

1026
00:46:55,222 --> 00:46:56,930
I znate što,
samo za dobru mjeru,

1027
00:46:56,930 --> 00:46:59,810
Uljepšajmo boju
crvena samo za trenutak.

1028
00:46:59,810 --> 00:47:03,740
A sada, ako sam ponovno učitavanje, sada smo
vidjeti tri ružne paragrafa.

1029
00:47:03,740 --> 00:47:07,180
>> Ali sada pretpostavimo da sam ja neka vrsta
of-- Želim prvi stavak

1030
00:47:07,180 --> 00:47:08,210
iskočiti na korisnika.

1031
00:47:08,210 --> 00:47:11,150
Ne želim da se samo povećati
veličina fonta svega.

1032
00:47:11,150 --> 00:47:16,105
I tako sam zapravo žele identificirati ili
razlikuju među tim stavcima.

1033
00:47:16,105 --> 00:47:18,730
Tako ćemo se riješiti crvene,
jer to je samo vrsta ljepljiv,

1034
00:47:18,730 --> 00:47:23,885
i neka je ići naprijed i učiniti
veličina slova 12 točaka po defaultu,

1035
00:47:23,885 --> 00:47:26,260
tako da smo opet na nešto
malo više razuman.

1036
00:47:26,260 --> 00:47:29,190
A sada samo želim da se poveća
veličina slova u prvom paragrafu.

1037
00:47:29,190 --> 00:47:31,440
Mogu to učiniti u nekoliko
načina, ali jedan način na koji je

1038
00:47:31,440 --> 00:47:37,180
možda najviše nastavni Na
Trenutak je učiniti sljedeće.

1039
00:47:37,180 --> 00:47:43,280
Pusti me naprijed i reći, ovo
stavka ima jedinstveni ID "prvi".

1040
00:47:43,280 --> 00:47:45,000
Mogao sam nazvati sve što želim.

1041
00:47:45,000 --> 00:47:46,874
Mogao sam nazvati ovaj "foo"
ili bilo koja druga riječ,

1042
00:47:46,874 --> 00:47:49,290
ali ja ću dati neke
semantički smisleno ime

1043
00:47:49,290 --> 00:47:50,320
kao što je "prvi".

1044
00:47:50,320 --> 00:47:54,790
Ovo je jedinstveni identifikator,
ID, za moj prvi stavak.

1045
00:47:54,790 --> 00:47:59,360
>> Ono što sada mogu učiniti u mom stilova
je biti malo precizniji.

1046
00:47:59,360 --> 00:48:02,330
Umjesto da se kaže, primjenjuju
sljedeće na p tag,

1047
00:48:02,330 --> 00:48:04,890
Mogu reći following--
primjenjuju se sljedeće,

1048
00:48:04,890 --> 00:48:11,000
ili odabrati, HTML element
da ima vlastiti ID za "prvi".

1049
00:48:11,000 --> 00:48:12,350
Što želim da se odnosi na njega?

1050
00:48:12,350 --> 00:48:15,250
Veličinu fonta od 24 točke.

1051
00:48:15,250 --> 00:48:16,640
Dakle, imam dva selektora sada.

1052
00:48:16,640 --> 00:48:19,690
Jedan čini sve od
stavci 12 točaka.

1053
00:48:19,690 --> 00:48:24,960
Ali ovaj, pogotovo jer se radi o
second-- je u pitanju posljednji u datoteke nije uspjelo

1054
00:48:24,960 --> 00:48:27,090
to ima kaskadni učinak.

1055
00:48:27,090 --> 00:48:30,200
Upravo sam napravio sve moje
stavak oznake 12 točaka,

1056
00:48:30,200 --> 00:48:34,350
ali to se sada kaskadama i
nadjačava da za bilo elemenata

1057
00:48:34,350 --> 00:48:38,800
na stranici, svaka oznaka na stranici čiji
Jedinstveni ID je citat citat "prvi".

1058
00:48:38,800 --> 00:48:41,720
A hashtag u ovom kontekstu
samo znači "jedinstveni identifikator".

1059
00:48:41,720 --> 00:48:43,750
Ja ne staviti ga u HTML datoteku.

1060
00:48:43,750 --> 00:48:46,880
I, ovdje, samo reci
citat citat "prvi".

1061
00:48:46,880 --> 00:48:48,470
>> Pa neka mi ponovno učitati.

1062
00:48:48,470 --> 00:48:49,919
A sada vidim, ah, u redu.

1063
00:48:49,919 --> 00:48:51,710
Mislim, nije to
lijepa, ali to je vrsta

1064
00:48:51,710 --> 00:48:53,600
poput predgovora u A
knjige ili nešto slično,

1065
00:48:53,600 --> 00:48:55,100
gdje je prva stavka je veća.

1066
00:48:55,100 --> 00:48:57,933
Moglo bi biti još precizniji s
samo prva slova, ali barem

1067
00:48:57,933 --> 00:48:59,110
Ja sam vršio više kontrole.

1068
00:48:59,110 --> 00:49:04,760
Sada maybe-- možda želim to učiniti
povremeno iz bilo kojeg razloga,

1069
00:49:04,760 --> 00:49:09,010
pa ne želim to
primjenjuju se samo jedan HTML oznake.

1070
00:49:09,010 --> 00:49:15,110
Umjesto toga, neka je say-- neka je
Također učinite sljedeće.

1071
00:49:15,110 --> 00:49:18,810
Class = "uvoz".

1072
00:49:18,810 --> 00:49:23,970
Dok osobna se koristi za jedinstveno
utvrditi jednu stvar, jednu oznaku,

1073
00:49:23,970 --> 00:49:30,190
Vaše web stranice, klasa je značilo da se
koristiti na bilo koji broj elemenata ili oznake

1074
00:49:30,190 --> 00:49:30,950
na web stranici.

1075
00:49:30,950 --> 00:49:31,710
Tako da je moguće ponovno koristiti.

1076
00:49:31,710 --> 00:49:33,090
ID je nije moguće ponovno koristiti.

1077
00:49:33,090 --> 00:49:34,450
Klasa je moguće ponovno koristiti.

1078
00:49:34,450 --> 00:49:37,830
>> I znate što, iz bilo kojeg
filozofski reasons--

1079
00:49:37,830 --> 00:49:40,180
Nisam završiti
Mislila sam reći

1080
00:49:40,180 --> 00:49:44,300
da je prva stavka i
Drugi paragraf su važni.

1081
00:49:44,300 --> 00:49:48,600
Zato ću primijeniti klase pod nazivom
"Važno" da, ako sam spasiti svoju sliku

1082
00:49:48,600 --> 00:49:51,510
i ponovno učitavanje, nema
funkcionalni učinak još.

1083
00:49:51,510 --> 00:49:53,780
Ali ja sam dodao neke
metapodataka do datoteke,

1084
00:49:53,780 --> 00:49:56,610
vrsta nešto odvojeno
od osnovnih podataka o datoteci u,

1085
00:49:56,610 --> 00:50:02,300
tako da je sada u mom stilovima, ako sam
umjesto da kažu ".important" - znate,

1086
00:50:02,300 --> 00:50:07,110
sve što je važno, ja sam
će napraviti font-boje, red--

1087
00:50:07,110 --> 00:50:09,930
odnosno ne font-boje, samo boje.

1088
00:50:09,930 --> 00:50:12,930
Postoji nedosljednosti
u CSS žalost.

1089
00:50:12,930 --> 00:50:14,120
I ponovno učitati.

1090
00:50:14,120 --> 00:50:17,640
Sada primijetite prva
dvije točke su crvene

1091
00:50:17,640 --> 00:50:20,880
ali ne i treći, jer sam samo
primjenjuju klasu "važno"

1092
00:50:20,880 --> 00:50:25,020
na prve dvije od tih stvari.

1093
00:50:25,020 --> 00:50:28,030
>> Tako je u ID, imate mogućnost
odrediti vrlo precizno.

1094
00:50:28,030 --> 00:50:30,110
S klase, imate višekratnog.

1095
00:50:30,110 --> 00:50:33,800
No, u oba slučaja, primijetiti
vrsta načela dobre dizajn

1096
00:50:33,800 --> 00:50:39,072
gdje sam uračunata sve od
estetika mom styles.css datoteku.

1097
00:50:39,072 --> 00:50:40,280
Dakle, nema nereda ovdje.

1098
00:50:40,280 --> 00:50:44,490
Nema spomena o crvenom ili
bold-suočava ili veličine fonta u ovoj datoteci.

1099
00:50:44,490 --> 00:50:49,430
Radije imam semantički,
smisleno karakterizira moje podatke,

1100
00:50:49,430 --> 00:50:51,240
Ovdje je neke važne podatke.

1101
00:50:51,240 --> 00:50:52,800
Evo još neke važne podatke.

1102
00:50:52,800 --> 00:50:56,500
Osim toga, ovdje je
"Prvi" od mojih važnih podataka.

1103
00:50:56,500 --> 00:51:01,050
Dakle, HTML je sve o sortiranje
označavanja, doslovno, riječi

1104
00:51:01,050 --> 00:51:05,270
i odlomci i konstrukti u svoj
stranica sa ovim malim naznakama, ako vas

1105
00:51:05,270 --> 00:51:07,640
će se, da možete
nekako utjecati pomoću

1106
00:51:07,640 --> 00:51:10,880
druge tehnike kao što su CSS na ovaj način.

1107
00:51:10,880 --> 00:51:14,760
>> Tako je u odgovoru na Victoria pitanje,
možemo napraviti tekst veći na taj način.

1108
00:51:14,760 --> 00:51:18,380
Postoji toliko mnogo drugih načina, ali
font tag-- otvorena zagrada "font" -

1109
00:51:18,380 --> 00:51:19,770
je zapravo nekoliko godina.

1110
00:51:19,770 --> 00:51:21,410
I to je problem,
također, uz oslanjajući se samo

1111
00:51:21,410 --> 00:51:23,485
na online resources--
oni imaju tendenciju da se zastarjeli.

1112
00:51:23,485 --> 00:51:26,110
I doista, to je obustavljena,
jer je svijet shvatio,

1113
00:51:26,110 --> 00:51:28,970
sto "font-size = 7" znači?

1114
00:51:28,970 --> 00:51:29,670
To ne čini.

1115
00:51:29,670 --> 00:51:32,770
I tako već dugi niz godina i da se
ovaj day-- jedna od bočnih

1116
00:51:32,770 --> 00:51:36,060
napominje da je ovdje to je zapravo
nevjerojatno bolno i dalje ponekad

1117
00:51:36,060 --> 00:51:38,900
razviti web stranice za
web, jer Microsoft

1118
00:51:38,900 --> 00:51:44,220
i Google i Mozilla i
drugi često ne slažu kako

1119
00:51:44,220 --> 00:51:47,480
interpretirati specifikaciju kao HTML.

1120
00:51:47,480 --> 00:51:52,490
>> Postoji Pravilnik o HTML-a koji
uglavnom govori što svaka oznaka znači.

1121
00:51:52,490 --> 00:51:55,690
No, ponekad je ostalo na
diskrecija za provedbu,

1122
00:51:55,690 --> 00:51:57,290
Microsoft je diskrecija i Google.

1123
00:51:57,290 --> 00:52:00,000
I tako da ćete vrlo često
vidjeti na web stranici nešto

1124
00:52:00,000 --> 00:52:04,954
izgleda drugačije na PC-u
nego što to radi na Macu,

1125
00:52:04,954 --> 00:52:06,995
i to je stvarno, jer,
na kraju dana,

1126
00:52:06,995 --> 00:52:08,891
nisu ga testirati
i na obje platforme.

1127
00:52:08,891 --> 00:52:11,390
No, to je i zato što razumno,
pametni ljudi će se ne slažem

1128
00:52:11,390 --> 00:52:14,970
a tvrtke će se ne slažu, i tako
jedan od izazova za programiranje

1129
00:52:14,970 --> 00:52:16,980
za web ili projektiranje
stvari za web

1130
00:52:16,980 --> 00:52:21,700
piše svoje web stranice na neki način
koji radi na svakom web pregledniku.

1131
00:52:21,700 --> 00:52:23,410
No, čak i da je to nerazumno, zar ne?

1132
00:52:23,410 --> 00:52:27,807
Postoji toliko mnogo verzija tako da mnogi
preglednici vani da, u nekom trenutku,

1133
00:52:27,807 --> 00:52:30,890
te isto tako morati napraviti sud poziva
i morate odlučiti kao tvrtka,

1134
00:52:30,890 --> 00:52:33,082
posebno za e-commerce stilu
mjesta gdje ste

1135
00:52:33,082 --> 00:52:36,290
pokušavate koristiti najnoviji i najveći
Tehnologije dati stvarno dobar korisnika

1136
00:52:36,290 --> 00:52:37,110
iskustvo.

1137
00:52:37,110 --> 00:52:41,019
No, neki Postotak korisnika moglo
još uvijek koristite Internet Explorer 6 ili 7

1138
00:52:41,019 --> 00:52:43,810
ili 8, posebno ovisno o
zemlja da oni dolaze.

1139
00:52:43,810 --> 00:52:46,760
>> I tako vrlo često
konzultirani je nešto

1140
00:52:46,760 --> 00:52:50,920
kao što je "statistika web preglednik."

1141
00:52:50,920 --> 00:52:56,560
A ako idemo to-- vidimo Wikipedia
i vidjeti kako up-to-date to grafikon

1142
00:52:56,560 --> 00:52:59,320
ako postoji.

1143
00:52:59,320 --> 00:53:02,420
Dakle, ovdje možete vidjeti
gdje preglednici zapravo

1144
00:53:02,420 --> 00:53:06,160
su, prema prosincu 2015. godine,
prema američke vlade.

1145
00:53:06,160 --> 00:53:11,170
Chrome je na 42% tržišnog udjela, a slijedi
IE uglavnom u korporacijskim okruženjima

1146
00:53:11,170 --> 00:53:14,490
ili PC postavke, naravno,
nakon čega slijedi Firefox,

1147
00:53:14,490 --> 00:53:17,440
onda Safari, onda Opera nije
izraditi kartu ovdje iz nekog razloga,

1148
00:53:17,440 --> 00:53:18,210
i onda drugih.

1149
00:53:18,210 --> 00:53:19,500
Možda je u drugima.

1150
00:53:19,500 --> 00:53:27,700
No, veći problem od toga is--
neka je vidjeti ako Wikipedia također ima

1151
00:53:27,700 --> 00:53:35,194
verzije preglednika version--

1152
00:53:35,194 --> 00:53:36,160

1153
00:53:36,160 --> 00:53:39,190
>> Idemo statistikama preglednika.

1154
00:53:39,190 --> 00:53:40,680
IE.

1155
00:53:40,680 --> 00:53:42,030
Čak i da to nije dovoljno.

1156
00:53:42,030 --> 00:53:44,854
Statistika preglednika.

1157
00:53:44,854 --> 00:53:45,353
Moja verzija.

1158
00:53:45,353 --> 00:53:48,980

1159
00:53:48,980 --> 00:53:50,540
To neće biti u pravu.

1160
00:53:50,540 --> 00:53:53,414
Da vidimo verzije.

1161
00:53:53,414 --> 00:53:54,830
preglednik na tržištu dionica.

1162
00:53:54,830 --> 00:53:57,110
Da vidimo je li to dolazi gore.

1163
00:53:57,110 --> 00:53:57,610
U REDU.

1164
00:53:57,610 --> 00:54:00,010
Sada ovo postaje
malo više koristan.

1165
00:54:00,010 --> 00:54:04,870
Pa evo, primijetiti da smo svi
različite verzije preglednika.

1166
00:54:04,870 --> 00:54:09,887
I, moj Bože, ako look-- Chrome
48, Chrome 47, Chrome 31, Chrome 45.

1167
00:54:09,887 --> 00:54:12,970
Mislim, preglednici sve obnovljeno,
a ponekad i neke od tih promjena

1168
00:54:12,970 --> 00:54:16,430
su značajne u
Uvjeti funkcionalnost.

1169
00:54:16,430 --> 00:54:20,630
I tako u nekom trenutku,
Voditelji proizvoda ili inženjeri

1170
00:54:20,630 --> 00:54:23,620
potrebno napraviti decision-- ti
Znaš što, samo 1% na svijetu

1171
00:54:23,620 --> 00:54:24,740
se još uvijek koriste IE 7.

1172
00:54:24,740 --> 00:54:25,490
Do vraga s njima.

1173
00:54:25,490 --> 00:54:27,470
Mi jednostavno ne ide
podršku tom preglednik.

1174
00:54:27,470 --> 00:54:28,740
I što to znači da ne podržavaju?

1175
00:54:28,740 --> 00:54:31,170
To bi moglo značiti da gumbi
ne rade na svoju web stranicu,

1176
00:54:31,170 --> 00:54:33,050
ili bi to moglo značiti
Oblikovanje je potpuno isključena.

1177
00:54:33,050 --> 00:54:35,091
Ili možda morati napraviti
taj isti sud poziva

1178
00:54:35,091 --> 00:54:39,089
u mobilnim ovih dana, gdje je, mi smo
neće podržavati iOS 5 više.

1179
00:54:39,089 --> 00:54:40,380
Dakle, ljudi jednostavno moraju nadograditi.

1180
00:54:40,380 --> 00:54:45,850
Ili nećemo podržati cupcake
na Android OS za Android uređaje,

1181
00:54:45,850 --> 00:54:48,629
jer kao što svijet-kao
tech svijet želi da se krene naprijed,

1182
00:54:48,629 --> 00:54:51,170
To je vrsta želi povucite
svijet s njom, tako da oni ne

1183
00:54:51,170 --> 00:54:53,295
moraju i dalje biti
unatrag kompatibilan, tako da

1184
00:54:53,295 --> 00:54:54,920
mogu ponuditi nove i dobre osobine.

1185
00:54:54,920 --> 00:54:57,878
Ovo je zaista jedan od razloga
zašto tako mnoge tvrtke su rolling out

1186
00:54:57,878 --> 00:55:01,440
automatska ažuriranja i vrsta prisiljavajući
najnovije verzije softvera na nas.

1187
00:55:01,440 --> 00:55:04,010
Pa čak i tvrtke
kao što je Apple će na neki način

1188
00:55:04,010 --> 00:55:07,280
snagu da gotovo i prisiljavaju
što u smislu tržišnih sila

1189
00:55:07,280 --> 00:55:11,164
kupiti novi mobitel jer su upravo
neće obnoviti svoj stari telefon više.

1190
00:55:11,164 --> 00:55:13,330
Tako da propustite
Najnoviji i najveći značajke,

1191
00:55:13,330 --> 00:55:17,520
jer to je skupo za njih kao
Tvrtka za održavanje stariji, vjerojatno

1192
00:55:17,520 --> 00:55:19,330
slabije verzije softvera.

1193
00:55:19,330 --> 00:55:23,660
No, neto učinak je da
mi također trpe to kao dobro.

1194
00:55:23,660 --> 00:55:26,550
>> Tako ćemo pogledati samo
par završnih stvari ovdje.

1195
00:55:26,550 --> 00:55:29,740
Recimo sklepati jako brzo neke od
oni drugi meci, ako je znatiželjan.

1196
00:55:29,740 --> 00:55:33,440
Dakle, ako ste pokušali,
na primjer, položaj

1197
00:55:33,440 --> 00:55:36,420
tekst na različitim stranama
stranica, ja ću učiniti jedan brz način,

1198
00:55:36,420 --> 00:55:38,360
ali ima drukčije
načina za to.

1199
00:55:38,360 --> 00:55:42,610
Pusti me naprijed i eliminate--
pojednostaviti na sljedeći način.

1200
00:55:42,610 --> 00:55:45,330
Pusti me samo vratiti na moj
jednostavna, jednostavna stavci.

1201
00:55:45,330 --> 00:55:47,760
Pusti me da se vratim na moj styles.css.

1202
00:55:47,760 --> 00:55:51,040
A ja sam samo namjeravate koristiti simple--
koje ste možda vidjeli na Googleu

1203
00:55:51,040 --> 00:55:54,430
ili opoziv iz earlier--
text-align pravu.

1204
00:55:54,430 --> 00:55:56,220
I ponovno odaberete ovu stranicu.

1205
00:55:56,220 --> 00:55:58,470
Sada sve izgleda
biti u pravu poravnat,

1206
00:55:58,470 --> 00:56:00,770
kao što ste mogli vidjeti na pretek ovdje.

1207
00:56:00,770 --> 00:56:04,470
>> Mi možemo učiniti da izgleda malo više
knjiga kao što su, i mi možemo reći: "opravdati"

1208
00:56:04,470 --> 00:56:05,640
i ponovno učitati.

1209
00:56:05,640 --> 00:56:09,870
Sada je lijepo i kvadrat na oba
strane, što je vrsta lijepo.

1210
00:56:09,870 --> 00:56:12,220
Drugi cilj koji smo imali ovdje
je promjena boje teksta.

1211
00:56:12,220 --> 00:56:13,650
Tako smo vidjeli da sa svojim crvenim tekstom.

1212
00:56:13,650 --> 00:56:15,630
A sada dodati gumbe za obrazac.

1213
00:56:15,630 --> 00:56:19,390
Pa zašto ne bismo pokušati učiniti upravo to?

1214
00:56:19,390 --> 00:56:23,656
Ali prvo me pusti na mjesto koje
većina nas koristiti svaki day-- Google.

1215
00:56:23,656 --> 00:56:25,780
I neka je pogledati
kako Google zapravo radi.

1216
00:56:25,780 --> 00:56:26,821
Ali ja ću to učiniti.

1217
00:56:26,821 --> 00:56:31,930
Prvo neka mi to in-- yep,
Pusti me da Googleu.

1218
00:56:31,930 --> 00:56:34,530
Ja ću morati ići
u Google postavkama

1219
00:56:34,530 --> 00:56:40,660
jer želim isključiti
nešto što se zove instant rezultate.

1220
00:56:40,660 --> 00:56:43,580
>> Dakle, možda ste primjetili u
Google ove days-- neka mi se vrati

1221
00:56:43,580 --> 00:56:44,850
i uključite ovo.

1222
00:56:44,850 --> 00:56:47,900
Dakle, ako sam početak traženja
za "cats" kao što je ovaj,

1223
00:56:47,900 --> 00:56:50,120
primijetiti da ne samo da
JA dobiti auto-kompletan gore

1224
00:56:50,120 --> 00:56:54,520
vrh, odjednom, sama stranica
Čini se promijeniti vrlo brzo, kao i,

1225
00:56:54,520 --> 00:56:58,750
a to je Google koristi jezik
pozvao JavaScript pokušava biti od pomoći.

1226
00:56:58,750 --> 00:57:01,540
Ali, nažalost, to vrsta
od uprska našu raspravu

1227
00:57:01,540 --> 00:57:04,010
onoga što se zapravo događa
ispod haube ovdje.

1228
00:57:04,010 --> 00:57:09,070
Dakle, ja sam samo vrsta brzo
isključite instant rezultate.

1229
00:57:09,070 --> 00:57:11,510
A ja ću kliknite Spremi.

1230
00:57:11,510 --> 00:57:13,930
A sada idem otvoriti
da dijagnostička alatna traka koja sam

1231
00:57:13,930 --> 00:57:16,150
čuvati otvor na kartici Network.

1232
00:57:16,150 --> 00:57:17,720
Tako ćemo to učiniti.

1233
00:57:17,720 --> 00:57:21,960
Neka me-- whoops--
dođite ovaj dolje malo.

1234
00:57:21,960 --> 00:57:24,410
I neka mi tražiti "mačke".

1235
00:57:24,410 --> 00:57:26,790
>> A sada notice-- zapravo,
ovo je dobra prilika

1236
00:57:26,790 --> 00:57:28,840
kako bi razgovarali na trenutak.

1237
00:57:28,840 --> 00:57:32,460
Obavijest trenutak sam type-- ga zaustavi.

1238
00:57:32,460 --> 00:57:35,250
Prestani.

1239
00:57:35,250 --> 00:57:35,790
U REDU.

1240
00:57:35,790 --> 00:57:40,870
Obavijest trenutak sam upišite slovo
C, gledati na dnu zaslona.

1241
00:57:40,870 --> 00:57:48,600
A- T S. Što dno
ovog zaslona, ​​moja mreža kartica,

1242
00:57:48,600 --> 00:57:53,320
ukazuju se događa svaki
put sam upišete slovo?

1243
00:57:53,320 --> 00:57:57,700
Nažalost, žaba je vrlo
zbunjujući danas ili djetelina

1244
00:57:57,700 --> 00:58:00,339
ili što god da je.

1245
00:58:00,339 --> 00:58:01,880
Ono što se događa svaki put kad sam upisali?

1246
00:58:01,880 --> 00:58:04,230
I neka mi brisanje
buffer i upišite ga opet.

1247
00:58:04,230 --> 00:58:06,580
So-- Joj.

1248
00:58:06,580 --> 00:58:13,280
Svaki put kad upišete slovo, C- A- T--
pa novi red očito drži se pojavljuju.

1249
00:58:13,280 --> 00:58:16,530
Što svaki od tih redaka predstavljaju,
na temelju onoga što smo vidjeli i razgovarali

1250
00:58:16,530 --> 00:58:17,339
do sada?

1251
00:58:17,339 --> 00:58:18,130
PUBLIKA: Potraga?

1252
00:58:18,130 --> 00:58:21,770
DAVID J. Malan: Potraga ili
više generički, HTTP zahtjev

1253
00:58:21,770 --> 00:58:23,125
iz mog preglednika na poslužitelj.

1254
00:58:23,125 --> 00:58:29,090
Pa, zašto se moja web preglednik stvaranje HTTP
zahtijevati svaki put kad upišete slovo?

1255
00:58:29,090 --> 00:58:30,502
>> PUBLIKA: [nečujan]

1256
00:58:30,502 --> 00:58:33,210
DAVID J. Malan: Da, to je davanje
ja te auto-kompletan rezultata.

1257
00:58:33,210 --> 00:58:35,190
Kao, gdje ti
Rezultati pretraživanja dolaze iz?

1258
00:58:35,190 --> 00:58:38,120
Pa, svaki put kad tip a
pismo, Google šalje više

1259
00:58:38,120 --> 00:58:40,460
a sve više i više
Riječ sam tipkati.

1260
00:58:40,460 --> 00:58:41,040
Zašto?

1261
00:58:41,040 --> 00:58:44,540
Zato što žele da mi daju
sve bolje i bolje, bolje prijedlog,

1262
00:58:44,540 --> 00:58:48,880
popis prijedloga, za ono što riječi
Pokušavam da se zapravo ne završi.

1263
00:58:48,880 --> 00:58:53,030
Dakle, ovo je za reći doslovno svaki
znak upišete u Google

1264
00:58:53,030 --> 00:58:56,900
se šalje, napose u
bulk, ali isto tako ponekad jedan

1265
00:58:56,900 --> 00:59:00,620
na vrijeme u cilju provedbe
te auto-kompletan značajkama dok

1266
00:59:00,620 --> 00:59:03,000
podataka je, naravno, na webu.

1267
00:59:03,000 --> 00:59:08,780
>> Sada, neka je pogledati što se zapravo
događa kad kliknem na Google pretraživanje.

1268
00:59:08,780 --> 00:59:10,420
A onda ćemo iskoristiti to sami.

1269
00:59:10,420 --> 00:59:15,320
Dakle, ako sam se pomaknite prema dolje sada vrlo
Prvi zahtjev koji se upravo dogodilo.

1270
00:59:15,320 --> 00:59:17,130
Obratite pozornost na sljedeće.

1271
00:59:17,130 --> 00:59:25,550
To je bio poslan u prilično dugo URL--
https://www.google.com/search?

1272
00:59:25,550 --> 00:59:27,100
a zatim cijela hrpa stvari.

1273
00:59:27,100 --> 00:59:29,620
Pogledajmo to zapravo sada
u kartici preglednika sama.

1274
00:59:29,620 --> 00:59:31,310
Idemo riješiti na alatnoj traci ovdje.

1275
00:59:31,310 --> 00:59:33,140
Evo stranica rezultata pretraživanja.

1276
00:59:33,140 --> 00:59:34,790
I obavijest evo URL.

1277
00:59:34,790 --> 00:59:37,430
Sada vjerojatno možete pogoditi
što se događa ovdje u dijelu.

1278
00:59:37,430 --> 00:59:39,090
Dakle, prije svega, definicija.

1279
00:59:39,090 --> 00:59:42,570
To očito je odredište
gdje se obrazac.

1280
00:59:42,570 --> 00:59:44,910
Dakle, kada sam upisao u
riječi "mačke" i pritisnite Enter,

1281
00:59:44,910 --> 00:59:48,460
očito Google je poslao
moj unos teksta u ovom URL-u

1282
00:59:48,460 --> 00:59:50,770
koje sam istaknuo
tamo, slash pretragu.

1283
00:59:50,770 --> 00:59:56,530
Ispostavilo se, u URL, sve što
događa nakon upitnik je,

1284
00:59:56,530 --> 01:00:01,270
kao što smo zadržati govoreći, ključni-vrijednost par
koji je unijeli u obrazac ili na neki način

1285
01:00:01,270 --> 01:00:04,500
prenosi od
preglednik na poslužitelj.

1286
01:00:04,500 --> 01:00:07,180
>> Dakle, svaki put kad upišete ulaz
u obliku na webu

1287
01:00:07,180 --> 01:00:10,000
i to je poslana kao što smo
raspravljali, preko get,

1288
01:00:10,000 --> 01:00:12,400
jedan od tih virtualnih
omotnice, sadržaj

1289
01:00:12,400 --> 01:00:15,510
to envelope-- da, zadržati
uzimajući punjena fizički

1290
01:00:15,510 --> 01:00:19,010
u omotnicu u razredu
danas, ali tehnološki

1291
01:00:19,010 --> 01:00:21,110
to je zapravo staviti u URL-u.

1292
01:00:21,110 --> 01:00:22,940
Tako je, u stvari, neka mi prosijati kroz to.

1293
01:00:22,940 --> 01:00:25,010
Gdje vidiš korisničkog unosa?

1294
01:00:25,010 --> 01:00:27,490
Gdje vidiš nešto
da sam ja upisao ovdje?

1295
01:00:27,490 --> 01:00:32,100

1296
01:00:32,100 --> 01:00:33,491
Da, pa "mačke".

1297
01:00:33,491 --> 01:00:33,990
Pravo?

1298
01:00:33,990 --> 01:00:36,380
Pa neka mi destilirati ovo
u nešto jednostavnije.

1299
01:00:36,380 --> 01:00:39,917
Idem obrisati sve o
ovaj URL koji ne razumijem,

1300
01:00:39,917 --> 01:00:42,250
a ja sam samo idući u dopust
to što učinimo / pretraživati? q = mačke.

1301
01:00:42,250 --> 01:00:45,640

1302
01:00:45,640 --> 01:00:47,890
Vidjet ćemo gdje je Q
dolazi iz u trenutku,

1303
01:00:47,890 --> 01:00:51,220
ali to se osjeća kao minimum
Količina informacija koju sam naveo.

1304
01:00:51,220 --> 01:00:53,050
A sada idem pritisnite Enter.

1305
01:00:53,050 --> 01:00:55,520
I primijetiti to još uvijek radi.

1306
01:00:55,520 --> 01:00:57,950
Još uvijek se vratiti hrpu mačaka.

1307
01:00:57,950 --> 01:01:00,340
Dakle, Google je ljubitelj
od toga ovih dana.

1308
01:01:00,340 --> 01:01:01,934
To je 2016, a ne 1999.

1309
01:01:01,934 --> 01:01:04,600
Dakle, tu je druga stvar da je moj
preglednik šalje na server.

1310
01:01:04,600 --> 01:01:07,100
No, to je minimalno
sve što je potrebno.

1311
01:01:07,100 --> 01:01:08,380
>> I što ima?

1312
01:01:08,380 --> 01:01:14,320
Pa, dopusti mi ići naprijed i idi
natrag na Cloud9 i neka mi ići naprijed

1313
01:01:14,320 --> 01:01:15,620
i zatvoriti kartice ranije.

1314
01:01:15,620 --> 01:01:18,230
A ja ću to učiniti na moj
posjedovati samo na trenutak.

1315
01:01:18,230 --> 01:01:20,730
Idem samo naprijed
i stvoriti novu datoteku.

1316
01:01:20,730 --> 01:01:23,739
I ja ću ga spremiti kao google.html.

1317
01:01:23,739 --> 01:01:26,280
A ja ću vrlo quickly--
Idem ukrasti, zapravo,

1318
01:01:26,280 --> 01:01:28,510
neki od ovog teksta samo uštedjeti na vremenu.

1319
01:01:28,510 --> 01:01:30,610
Idem zalijepiti ovdje.

1320
01:01:30,610 --> 01:01:33,850
Neću se zamarati s
bilo stilizacija ovaj put.

1321
01:01:33,850 --> 01:01:38,340
Ćemo nazvati "Moj Google".

1322
01:01:38,340 --> 01:01:41,230
I ja ću se riješiti
svega u tijelu.

1323
01:01:41,230 --> 01:01:42,740
I ja ću učiniti sljedeće.

1324
01:01:42,740 --> 01:01:45,690
Dopustite mi zumirati.

1325
01:01:45,690 --> 01:01:50,620
Obrazac action-- i kao što sam ukratko spomenuo
earlier-- whoops-- kako je ukratko sam

1326
01:01:50,620 --> 01:01:54,130
što je ranije spomenuto, djelovanjem
Obrazac je mjesto gdje možete poslati podatke.

1327
01:01:54,130 --> 01:01:56,620
Tako google.com/search.

1328
01:01:56,620 --> 01:01:59,390
Te način želim koristiti
može biti jedna od dvije stvari.

1329
01:01:59,390 --> 01:02:02,870
To mogu biti bilo "dobiti", kao što smo zadržati
raspravlja, ili to može biti "post".

1330
01:02:02,870 --> 01:02:05,340
Za sada, temeljni
Razlika je u tome, ako koristite "dobiti"

1331
01:02:05,340 --> 01:02:09,590
sve informacije da je
Korisnik pruža se šalje u URL-u.

1332
01:02:09,590 --> 01:02:13,530
>> To je super za stvari kao što su pretraživanje
motori i nekoliko drugih aplikacija,

1333
01:02:13,530 --> 01:02:17,080
ali u kojim okolnostima bi
ne žele ispuniti obrazac

1334
01:02:17,080 --> 01:02:21,620
te su informacije završiti gore
URL, kao u adresnu traku preglednika?

1335
01:02:21,620 --> 01:02:25,470

1336
01:02:25,470 --> 01:02:26,605
Kakav oblika učiniti you--

1337
01:02:26,605 --> 01:02:27,480
PUBLIKA: [nečujan]

1338
01:02:27,480 --> 01:02:28,450
DAVID J. Malan: Da, kao što?

1339
01:02:28,450 --> 01:02:29,270
PUBLIKA: Lozinke.

1340
01:02:29,270 --> 01:02:31,936
DAVID J. Malan: Da, tako da se prijavite
na Facebook ili neke web stranice.

1341
01:02:31,936 --> 01:02:34,395
To je user ulaz iz
oblik, tekstualni okvir,

1342
01:02:34,395 --> 01:02:37,020
ali vjerojatno ne želite
prikazuje se u URL-preglednika.

1343
01:02:37,020 --> 01:02:38,121
Zašto?

1344
01:02:38,121 --> 01:02:40,870
Mislim, možda postoje neki
sigurnosne implikacije na mreži,

1345
01:02:40,870 --> 01:02:44,830
ali more-- sviđa, jednostavnije, što ako
vaš cimer, vaše druge značajne,

1346
01:02:44,830 --> 01:02:47,710
vaša djeca, vaš suprug izgleda
kroz svoju povijest preglednika?

1347
01:02:47,710 --> 01:02:50,762
Tu je zaporka ispravna
Postoji u povijesti preglednika.

1348
01:02:50,762 --> 01:02:52,220
To ne osjećam kao dobar dizajn.

1349
01:02:52,220 --> 01:02:54,500
Ili čak i više tehnički,
Pretpostavljam da pokušavate

1350
01:02:54,500 --> 01:02:59,180
uploadati fotografiju Flickr
ili Facebook ili wherever--

1351
01:02:59,180 --> 01:03:03,010
da je unos korisnika, iako
to je malo više interesting-- kako

1352
01:03:03,010 --> 01:03:05,530
mogu strpati sliku u URL traku?

1353
01:03:05,530 --> 01:03:06,730
Vi vrsta vrsta ne mogu.

1354
01:03:06,730 --> 01:03:07,396
Vi vrsta može.

1355
01:03:07,396 --> 01:03:10,210
Ali, stvarno, ja sam pod velikim pritiskom
zamisliti da radi.

1356
01:03:10,210 --> 01:03:13,470
Dakle, trebam još jednu metodu
postavljanje fotografija na web stranicu,

1357
01:03:13,470 --> 01:03:15,657
a ta druga metoda se zove "post".

1358
01:03:15,657 --> 01:03:18,740
No, za sada, samo ćemo razgovarati o
"Dobiti", što je jednostavnije od dva.

1359
01:03:18,740 --> 01:03:21,100
To samo stavlja sve
korisničkog ulaza u URL-u.

1360
01:03:21,100 --> 01:03:22,830
>> Dakle ovdje je forma Izrađujem.

1361
01:03:22,830 --> 01:03:24,070
Želim ulaz.

1362
01:03:24,070 --> 01:03:24,820
I znate što?

1363
01:03:24,820 --> 01:03:26,111
Idem uzeti pogodak ovdje.

1364
01:03:26,111 --> 01:03:31,600
Idem da se sjeti moja
input "q" za "upita."

1365
01:03:31,600 --> 01:03:34,970
I mislim da je to jedan od
originalni dizajn, možda, od 1999.

1366
01:03:34,970 --> 01:03:39,560
A onda se tip tog ulaza
je samo će biti "tekst".

1367
01:03:39,560 --> 01:03:43,040
A onda ću imati još jedan ulaz
da ne treba ime, kao što ćemo uskoro

1368
01:03:43,040 --> 01:03:45,120
vidi, tip koji je "submit".

1369
01:03:45,120 --> 01:03:47,070
A to će se
daj mi poseban gumb.

1370
01:03:47,070 --> 01:03:48,320
I to je to.

1371
01:03:48,320 --> 01:03:50,790
>> Pa neka mi ići naprijed i spremiti ovu datoteku.

1372
01:03:50,790 --> 01:03:54,910
Idem se vratiti u moj
preglednik i idite na google.html.

1373
01:03:54,910 --> 01:03:56,140
Enter.

1374
01:03:56,140 --> 01:03:59,680
I to je vrsta rijetka
u najmanju ruku.

1375
01:03:59,680 --> 01:04:03,110
No, dopustite mi ići naprijed
i potražite "mačke".

1376
01:04:03,110 --> 01:04:06,510
A primjetiti ja sam trenutno
U ovom Cloud9 URL.

1377
01:04:06,510 --> 01:04:09,240
No, u trenutku sam kliknite ovaj,
gdje ti se nadam da ću završiti?

1378
01:04:09,240 --> 01:04:10,160
>> PUBLIKA: Google.

1379
01:04:10,160 --> 01:04:11,118
>> DAVID J. Malan: Google.

1380
01:04:11,118 --> 01:04:12,740
Tako ćemo kliknite Pošalji.

1381
01:04:12,740 --> 01:04:15,200
I doista sam ponovno provodi Google.

1382
01:04:15,200 --> 01:04:15,700
Pravo?

1383
01:04:15,700 --> 01:04:16,480
To je jednostavnije.

1384
01:04:16,480 --> 01:04:17,120
To je lakši.

1385
01:04:17,120 --> 01:04:20,350
Mislim, moj broj je očito bolje nego
njih, od nereda smo vidjeli ranije.

1386
01:04:20,350 --> 01:04:21,100
I znate što?

1387
01:04:21,100 --> 01:04:22,610
Idem začiniti ovaj gore malo.

1388
01:04:22,610 --> 01:04:23,860
Nisam spomenuo ovo ranije.

1389
01:04:23,860 --> 01:04:27,860
Postoje oznake kao što su H1, za Heading 1,
najvažniji naslov na stranici.

1390
01:04:27,860 --> 01:04:30,570
"Moj Google" Nazvat ću ovo.

1391
01:04:30,570 --> 01:04:31,940
Pusti me da ponovno učitati.

1392
01:04:31,940 --> 01:04:33,772
To je izgleda malo bolje već.

1393
01:04:33,772 --> 01:04:34,980
I, zapravo, znate što?

1394
01:04:34,980 --> 01:04:36,430
Imam already-- sam lagao.

1395
01:04:36,430 --> 01:04:40,200
Rekao sam da neću stil toga,
ali idem na stil to kao prije.

1396
01:04:40,200 --> 01:04:46,860
I moje tijelo će biti,
recimo, text-align centar.

1397
01:04:46,860 --> 01:04:48,800
To je izgleda više kao Google već.

1398
01:04:48,800 --> 01:04:51,090
>> Trebam prijelom retka, ipak,
za to gumb Pošalji.

1399
01:04:51,090 --> 01:04:52,798
I ispada, vi
Možete koristiti stavke,

1400
01:04:52,798 --> 01:04:57,320
ili možete više doslovno samo reći:
daj mi liniju pauze here-- BR oznaku.

1401
01:04:57,320 --> 01:04:59,319
A ako sam ponovno učitati ovaj, sada to ide tamo.

1402
01:04:59,319 --> 01:05:01,610
Malo je ružno, pa sam
mogao učiniti više redaka,

1403
01:05:01,610 --> 01:05:03,310
ali nemojmo se previše pohlepni ovdje.

1404
01:05:03,310 --> 01:05:06,430
Tako sada neka je vidjeti ako to radi za "psi".

1405
01:05:06,430 --> 01:05:08,640
Čini se da rade za "pasa", kao dobro.

1406
01:05:08,640 --> 01:05:10,780
Dakle, što je izuzetan takeaway ovdje?

1407
01:05:10,780 --> 01:05:13,600
One-- nije bio ogroman skok na
uvesti još nekoliko oznaka,

1408
01:05:13,600 --> 01:05:15,370
kao oblik oznake u ulaznu oznaku.

1409
01:05:15,370 --> 01:05:17,120
No, važnije
je, sve što radite

1410
01:05:17,120 --> 01:05:20,610
je utjecati na naše razumijevanje
HTTP i činjenice

1411
01:05:20,610 --> 01:05:24,900
da oblici u konačnici mijenjaju
ono što je u URL u pregledniku,

1412
01:05:24,900 --> 01:05:28,540
i tako, dakle, možemo
mehanički osigurati ulaz na server

1413
01:05:28,540 --> 01:05:33,600
čineći HTML obrazac i znajući
da poslužitelj razumije HTTP,

1414
01:05:33,600 --> 01:05:36,890
baš kao i naše tijelo ne razumije, kao što su,
trese moje strane, taj isti protokol,

1415
01:05:36,890 --> 01:05:40,920
i tako smo dobili natrag odgovor
da smo na kraju očekivali.

1416
01:05:40,920 --> 01:05:44,050
>> Tako ćemo pokušati napraviti jedan
Posljednje što je sada sa mobilnim,

1417
01:05:44,050 --> 01:05:47,052
a ja ću make-- ću dodati
ovaj kod na slajdovima.

1418
01:05:47,052 --> 01:05:49,760
Dakle, ako želite da prtljati, te
može sigurno uzeti od tamo.

1419
01:05:49,760 --> 01:05:51,551
Ali ja ću otići
naprijed i učiniti jednu stvar.

1420
01:05:51,551 --> 01:05:54,120
Ja ću ići naprijed i
otvoriti moje indeks page--

1421
01:05:54,120 --> 01:05:59,030
moj bok stranica kao i prije, kojima
ima puno tog promašaj-latinski tekst,

1422
01:05:59,030 --> 01:06:05,470
ili besmislena latinski tekst i has--
to izgleda ovako na ovu veličinu fonta.

1423
01:06:05,470 --> 01:06:07,850
No, dopustite mi ići naprijed i učiniti.

1424
01:06:07,850 --> 01:06:09,300
Ja ću ići u Cloud9.

1425
01:06:09,300 --> 01:06:10,380
I ne morate učiniti taj korak.

1426
01:06:10,380 --> 01:06:11,420
Samo ću to učiniti.

1427
01:06:11,420 --> 01:06:12,890
Idem kliknite Dijeli.

1428
01:06:12,890 --> 01:06:15,170
A to je značajka
Samo od Cloud9, pri čemu

1429
01:06:15,170 --> 01:06:17,710
Mogu napraviti moj okoliš javnosti.

1430
01:06:17,710 --> 01:06:20,240
>> I samo radi
demonstracije, neka mi to učiniti.

1431
01:06:20,240 --> 01:06:22,870
Idem da bi moj zahtjev javnosti.

1432
01:06:22,870 --> 01:06:25,230
Obavijest to me upozorio, ja
Ja sigurna da želim to učiniti,

1433
01:06:25,230 --> 01:06:28,438
jer ovo ide kako bi sve
u svijetu, bez obzira jesu li sada ovdje

1434
01:06:28,438 --> 01:06:33,560
ili gledanje video kasnije na
internet u stanju vidjeti ono što ja vidim.

1435
01:06:33,560 --> 01:06:34,440
Ali to je u redu.

1436
01:06:34,440 --> 01:06:37,870
Ja ću reći: "Gotovo."

1437
01:06:37,870 --> 01:06:42,080
I neka mi vam preporučujemo, ako sam
ovo correctly-- neka mi ga testirati na prvom mjestu.

1438
01:06:42,080 --> 01:06:45,590
Samo naprijed, ako ne mind--
u pretraživač na računalu,

1439
01:06:45,590 --> 01:06:49,900
ići na ovaj URL, i nadamo se
vidjet ćete moj latinski tekst.

1440
01:06:49,900 --> 01:06:52,820
I da bude jasno, to je
trčanje a ne na moj laptop.

1441
01:06:52,820 --> 01:06:53,610
To je u oblaku.

1442
01:06:53,610 --> 01:06:58,120
To je na Cloud9, doslovno, ali
Ja sam napravio moj radni prostor javnost

1443
01:06:58,120 --> 01:07:03,450
tako da bilo tko na internetu
mogu pristupiti latinski početnu stranicu.

1444
01:07:03,450 --> 01:07:07,209
>> Idi na istom URL na
telefon, ako može.

1445
01:07:07,209 --> 01:07:09,750
Ako to će vas koštati, ipak,
mogu samo gledati preko ramena.

1446
01:07:09,750 --> 01:07:40,688

1447
01:07:40,688 --> 01:07:42,467
PUBLIKA: [nečujan]

1448
01:07:42,467 --> 01:07:43,550
DAVID J. Malan: Žao mi je što?

1449
01:07:43,550 --> 01:07:45,390
PUBLIKA: [nečujan]

1450
01:07:45,390 --> 01:07:47,710
DAVID J. Malan: Samo latinske riječi.

1451
01:07:47,710 --> 01:07:48,210
To je sve.

1452
01:07:48,210 --> 01:07:49,250
Ali to je ono što bi trebao vidjeti.

1453
01:07:49,250 --> 01:07:49,875
>> PUBLIKA: Da.

1454
01:07:49,875 --> 01:07:50,790
DAVID J. Malan: Da.

1455
01:07:50,790 --> 01:07:51,300
Da.

1456
01:07:51,300 --> 01:07:51,540
U REDU.

1457
01:07:51,540 --> 01:07:53,530
Dakle, mogu držati do svoje
Telefon samo na trenutak?

1458
01:07:53,530 --> 01:07:57,504
Dakle, nadam se, ako ste u pristupu
da, to bi trebalo izgledati gotovo nečitak.

1459
01:07:57,504 --> 01:07:59,920
To je still-- Mislim, to je
nečitak zbog latinski.

1460
01:07:59,920 --> 01:08:01,920
No, to je također nečitljiva
za ono zbog čega drugog?

1461
01:08:01,920 --> 01:08:03,775
Kao, ono što neprijatan o tome?

1462
01:08:03,775 --> 01:08:04,650
PUBLIKA: To je mala.

1463
01:08:04,650 --> 01:08:06,420
DAVID J. Malan: To je super, super mala.

1464
01:08:06,420 --> 01:08:07,920
Pa kako bismo mogli popraviti?

1465
01:08:07,920 --> 01:08:09,730
To je super, super mala
na Victoria telefon

1466
01:08:09,730 --> 01:08:11,400
i, ako ste izdvajali
da se sami, vjerojatno

1467
01:08:11,400 --> 01:08:14,660
mala na telefonu, kao i, osim ako
omogućena postavki pristupačnosti.

1468
01:08:14,660 --> 01:08:15,530
Što je to?

1469
01:08:15,530 --> 01:08:18,497
Vi samo mogu patiti i
zoom, koji je djelatan,

1470
01:08:18,497 --> 01:08:20,330
ali onda vidite samo
nekoliko riječi u isto vrijeme.

1471
01:08:20,330 --> 01:08:20,859
Pa čekaj malo.

1472
01:08:20,859 --> 01:08:21,720
Znam kako to škripac ovaj.

1473
01:08:21,720 --> 01:08:22,219
Pravo?

1474
01:08:22,219 --> 01:08:26,130
Mogao sam koristiti CSS, i mogao sam promjeniti
slova od 12 točaka do 24 točke.

1475
01:08:26,130 --> 01:08:29,020
Ali nuspojava toga
naravno, će biti i sada,

1476
01:08:29,020 --> 01:08:32,630
na desktop ili laptop,
Sada je tekst dvostruko veći.

1477
01:08:32,630 --> 01:08:35,810
I tako bi nekako bilo lijepo
razlikovati uređaja,

1478
01:08:35,810 --> 01:08:37,840
i ispada vani
načini da radi.

1479
01:08:37,840 --> 01:08:39,590
Postoji nekoliko
različitih načina, u stvari,

1480
01:08:39,590 --> 01:08:44,189
pri čemu se pomoću CSS i ljubitelj značajke
da nećemo ići u vrlo detaljno,

1481
01:08:44,189 --> 01:08:46,960
da u suštini može upit
preglednik i reći:

1482
01:08:46,960 --> 01:08:51,550
ako je vaš zaslon je manji od toga
broj piksela, koristite ovu veličinu fonta.

1483
01:08:51,550 --> 01:08:55,180
Ako je zaslon veći od ovoga
broj piksela, koristite ovu drugu veličinu fonta.

1484
01:08:55,180 --> 01:08:57,080
>> Možete biti još raskošnije i dalje.

1485
01:08:57,080 --> 01:09:00,140
Ako ste ikada posjetili
Web-stranica koja, na radnoj površini,

1486
01:09:00,140 --> 01:09:04,404
ima veliki izbornik možda off na
strana, a onda sav sadržaj

1487
01:09:04,404 --> 01:09:07,029
je na strani koja menu--
to je vrsta zajedničke paradigme.

1488
01:09:07,029 --> 01:09:09,670
Meni se na lijevo, sadržaj
na desno ili obrnuto.

1489
01:09:09,670 --> 01:09:13,569
Zapravo ne radi na mobitelu kad tvoj
Ekran je samo to mnogi piksela.

1490
01:09:13,569 --> 01:09:16,233
Dakle, sve češće na mobitel je,
Vaš izbornik će iznenada doći

1491
01:09:16,233 --> 01:09:18,399
propali, i morate
kliknite na gumb da ga vide,

1492
01:09:18,399 --> 01:09:22,404
ili na web stranici će se staviti u izbornik
iznad nje i stavio sadržaja ispod njega.

1493
01:09:22,404 --> 01:09:24,779
A možete provesti ove
stvari na više načina, previše.

1494
01:09:24,779 --> 01:09:28,340
Možete postaviti programera,
hej, ekipa, u bilo koje vrijeme

1495
01:09:28,340 --> 01:09:34,450
vidite HTTP zahtjev od Androida
Uređaj, Microsoft uređaj, Google

1496
01:09:34,450 --> 01:09:39,930
uređaj, Apple uređaj, koristiti
veličinu fonta i koristiti ovaj izgled izbornika,

1497
01:09:39,930 --> 01:09:42,670
inače koristiti zadani veći izgled.

1498
01:09:42,670 --> 01:09:45,410
>> Sada, koristeći ono
Temeljna tehnika danas

1499
01:09:45,410 --> 01:09:48,529
mogli su inženjeri koristiti
da znam da li je

1500
01:09:48,529 --> 01:09:53,660
iPhone, Android telefon, laptop,
desktop posjeti tvrtke server?

1501
01:09:53,660 --> 01:09:55,310
U čemu se oni dobiti tu informaciju?

1502
01:09:55,310 --> 01:09:56,080
>> PUBLIKA: Zaglavlje?

1503
01:09:56,080 --> 01:09:57,740
>> DAVID J. Malan: Da, HTTP zaglavlja.

1504
01:09:57,740 --> 01:10:01,714
Tako svaki HTTP zahtjev dolazi iz
njihovi kupci na njihove servere

1505
01:10:01,714 --> 01:10:03,880
uključuju, iznutra da virtualni
omotnice, cijela hrpa

1506
01:10:03,880 --> 01:10:08,260
HTTP zaglavlja, od kojih je jedan
preglednik i operativni sustav

1507
01:10:08,260 --> 01:10:10,290
čak i ako vam je stalo da
da razina detalja.

1508
01:10:10,290 --> 01:10:13,790
Sada, to je zagonetna izgleda niz, ali
postoji softver koji će samo

1509
01:10:13,790 --> 01:10:18,530
pojednostaviti to, a vi samo možete pitati
u programiranju code-- PHP, Java, C ++,

1510
01:10:18,530 --> 01:10:23,650
whatever-- što je telefon učinimo
što je uređaj taj korisnik koristi?

1511
01:10:23,650 --> 01:10:27,501
I onda se može reći, pokazati im to
verzija web stranice ako je telefon.

1512
01:10:27,501 --> 01:10:30,250
Pokaži im Ova verzija
Web stranica ako je to laptop ili desktop.

1513
01:10:30,250 --> 01:10:32,316
Ali ti ni ne treba
server-side složenosti.

1514
01:10:32,316 --> 01:10:33,940
To možete učiniti čak i najjednostavniji stvari.

1515
01:10:33,940 --> 01:10:34,815
>> Idem to učiniti.

1516
01:10:34,815 --> 01:10:38,995
Idem da ide naprijed u
moj Cloud9 okoliš,

1517
01:10:38,995 --> 01:10:41,370
a ja ću dodati oznaku
koje ste vidjeli na Googleu prije.

1518
01:10:41,370 --> 01:10:42,770
To se zove metatag.

1519
01:10:42,770 --> 01:10:45,520
I nikad ne zaboravite ovo, pa
Ja ću ga prepisati ovdje.

1520
01:10:45,520 --> 01:10:50,552
Meta name = "Pogledu", a zatim
content = "width = širina uređaja, intital

1521
01:10:50,552 --> 01:11:02,060
scale = 1 "i to je to.

1522
01:11:02,060 --> 01:11:06,230
>> Tako bi moglo biti i kao
kao čarobni bajanje.

1523
01:11:06,230 --> 01:11:11,300
To nije sve to jasno, ali ovo je
nešto učiniti s prikaza,

1524
01:11:11,300 --> 01:11:15,070
a vidljivi dio je samo Tijelo
web stranica je pravokutno područje koje

1525
01:11:15,070 --> 01:11:16,690
određuje najveći dio stranice.

1526
01:11:16,690 --> 01:11:19,060
A to je samo priča
preglednik, znate što?

1527
01:11:19,060 --> 01:11:22,589
Provjerite širinu ovoj stranici
učinkovito jednaka širini uređaja.

1528
01:11:22,589 --> 01:11:25,380
Drugim riječima, nemojte pretpostavljati da
Imate li kakve neograničen prostor.

1529
01:11:25,380 --> 01:11:29,920
Pretpostavimo da imate samo onoliko koliko
Prostor kao i sam uređaj je velika.

1530
01:11:29,920 --> 01:11:34,454
I tako sada, ako sam učitajte
u svom pregledniku, ne vidim promjene.

1531
01:11:34,454 --> 01:11:37,370
Ali, ako sam ovo correctly-- i
neka mi križ moj fingers-- ako vas sve

1532
01:11:37,370 --> 01:11:42,920
reload svoje telefone, zar ne
vidi uvjerljiv promjenu?

1533
01:11:42,920 --> 01:11:43,620
Da je that--

1534
01:11:43,620 --> 01:11:45,067
>> PUBLIKA: [nečujan]

1535
01:11:45,067 --> 01:11:45,900
DAVID J. Malan: Da.

1536
01:11:45,900 --> 01:11:46,400
U REDU.

1537
01:11:46,400 --> 01:11:47,850
Dakle, vjerojatno više čitati sada?

1538
01:11:47,850 --> 01:11:53,070
Ipak mala, da bude fer, ali ne
tako malen da bude nepodesan za rukovanje.

1539
01:11:53,070 --> 01:11:56,920
I sigurno mogu zaobići ovo
dalje s CSS ili na strani poslužitelja,

1540
01:11:56,920 --> 01:12:00,120
ali sve što si
vidim se više i više mogućnosti

1541
01:12:00,120 --> 01:12:02,900
dodaje se u
strani klijenta environments--

1542
01:12:02,900 --> 01:12:06,530
JavaScript, kako ćemo raspravljati
Sutra, CSS i HTML-- tako

1543
01:12:06,530 --> 01:12:09,190
da su sve ove upite
može obaviti na klijentu

1544
01:12:09,190 --> 01:12:11,910
tako da smetaju
poslužitelj puno manje, a ne

1545
01:12:11,910 --> 01:12:14,530
morati držati korak s, za
Primjerice, konstantna navala

1546
01:12:14,530 --> 01:12:17,210
novog operativnog sistema
verzije, nove verzije preglednika.

1547
01:12:17,210 --> 01:12:20,190
Vi samo možete pustiti preglednik
pitajte uređaj, koliki su ti,

1548
01:12:20,190 --> 01:12:22,890
a zatim napraviti nešto logično
odluke na temelju toga.

1549
01:12:22,890 --> 01:12:25,140
No, vidjet ćemo više prilika
za logičke odluke

1550
01:12:25,140 --> 01:12:27,223
Sutra u kontekstu
o programskom jeziku.

1551
01:12:27,223 --> 01:12:29,800

1552
01:12:29,800 --> 01:12:32,760
>> Dakle, bilo kakva pitanja, a onda,
na izradu web stranica?

1553
01:12:32,760 --> 01:12:36,130
Danas nije web programiranje, po
sebi, jer gotovo sve što smo učinili

1554
01:12:36,130 --> 01:12:38,370
bio je vrlo estetski, ako hoćete.

1555
01:12:38,370 --> 01:12:41,750
Nema donošenja odluka u
kod koje smo napisali,

1556
01:12:41,750 --> 01:12:44,990
pa to je razlog zašto HTML je markup
jezik, a ne programski jezik.

1557
01:12:44,990 --> 01:12:47,140
Ali sutra ćemo se
brz pogled, u konačnici,

1558
01:12:47,140 --> 01:12:49,340
u JavaScriptu, što je
stvarna programiranje

1559
01:12:49,340 --> 01:12:54,220
jezik koji omogućuje nam da radimo malo više.

1560
01:12:54,220 --> 01:12:56,800
>> Ima li pitanja?

1561
01:12:56,800 --> 01:13:00,480
Pa, neka mi predloži dva
mogućnosti izborni za domaću zadaću.

1562
01:13:00,480 --> 01:13:02,900
Jedan is-- ove Cloud9
računi neće isteći.

1563
01:13:02,900 --> 01:13:04,669
Vi ste dobrodošli da koristite
im da prtljati s.

1564
01:13:04,669 --> 01:13:05,960
To je besplatno razina usluge.

1565
01:13:05,960 --> 01:13:08,754
Shvatiti da, ako se prilikom izrade
vaš radni prostor, te je napravio to javno,

1566
01:13:08,754 --> 01:13:11,670
to ne znači da bilo tko na
Internet može vidjeti što pišete.

1567
01:13:11,670 --> 01:13:15,104
Dakle, možda samo uzeti u obzir
Nemojte se sramiti sebe

1568
01:13:15,104 --> 01:13:18,020
ako ste stavljajući svoju prvu web
Stranica vani javno slučajno,

1569
01:13:18,020 --> 01:13:20,134
ali nitko ne će
znam da izgleda tamo ionako.

1570
01:13:20,134 --> 01:13:23,760
>> I two-- neka mi bacanje
do ovog URL kao i,

1571
01:13:23,760 --> 01:13:28,250
pogotovo ako je došao u danas
malo manje udobna od drugih,

1572
01:13:28,250 --> 01:13:30,430
sigurni što su sve ove stvari znači.

1573
01:13:30,430 --> 01:13:36,780
Shvatite da je mnogo više od ovog videa,
koji je ujedno i dobar način da se spava

1574
01:13:36,780 --> 01:13:39,380
kao i da se smiju dok
Pritom, također ima

1575
01:13:39,380 --> 01:13:44,300
puno društveno interesantno
i sigurnosne relevantne rasprave

1576
01:13:44,300 --> 01:13:47,370
njemu od John Oliver,
iako komičara.

1577
01:13:47,370 --> 01:13:55,456
>> Ali ako nema više pitanja,
to nas dovodi do recepcije.

1578
01:13:55,456 --> 01:13:56,830
Pa zašto se ne uključim glazbu.

1579
01:13:56,830 --> 01:13:58,610
Tu bi trebao biti pića
i grickalice vani.

1580
01:13:58,610 --> 01:14:00,220
Drago mi je da druženje za sve
Sve dok ljudi bi htjeli,

1581
01:14:00,220 --> 01:14:01,600
odgovoriti na pitanja još jedan-na-jedan.

1582
01:14:01,600 --> 01:14:03,330
Ali, inače, vi ste dobrodošli
skinuti u bilo kojem trenutku,

1583
01:14:03,330 --> 01:14:05,740
pa ćemo vidjeti te opet
sutra ujutro za malo više.

1584
01:14:05,740 --> 01:14:07,290
U redu, hvala.

1585
01:14:07,290 --> 01:14:10,428