1
00:00:00,000 --> 00:00:03,486
>> [TÓNLIST spila]

2
00:00:03,486 --> 00:00:10,460

3
00:00:10,460 --> 00:00:14,250
>> DAVID J MALAN: Þetta er CS50 og
þetta er upphaf viku 7.

4
00:00:14,250 --> 00:00:15,060
Svo velkomin aftur.

5
00:00:15,060 --> 00:00:17,540
Og þú getur muna að
í Heimadæmi fjórum,

6
00:00:17,540 --> 00:00:21,510
það var a hluti af a hrææta veiði
fyrir nokkrum stórkostlegur verðlaun þar

7
00:00:21,510 --> 00:00:24,219
eftir að þú batna myndir af
Starfsfólk bæði hér og í New Haven,

8
00:00:24,219 --> 00:00:27,468
þú varst áskorun til að finna eins og margir af
þessir tölva vísindamenn og þú gætir.

9
00:00:27,468 --> 00:00:29,550
Og við höfum fengið allt
fullt af uppgjöf.

10
00:00:29,550 --> 00:00:31,930
Hélt ég myndi deila fáir
með þér hér í dag.

11
00:00:31,930 --> 00:00:35,100
>> Og við munum senda allar þessar netinu.

12
00:00:35,100 --> 00:00:39,310
En einkum, ég vildi
vekja athygli þína to-- vel eitt,

13
00:00:39,310 --> 00:00:42,670
Sam var í alveg nokkrar af þeim
almennt gera ráð fyrir svona.

14
00:00:42,670 --> 00:00:45,750
En það virðist sem eins af
í morgun, sigurvegari

15
00:00:45,750 --> 00:00:51,170
var ákveðin einhver heitir Ken með
24 starfsfólks tekin á myndavél

16
00:00:51,170 --> 00:00:54,600
eða nokkrar fleiri þegar þú tekur inn
reikningur margar starfsfólk á myndunum.

17
00:00:54,600 --> 00:00:58,300
Myndinni hér er Ken næsta
til Maríu í ​​New Haven.

18
00:00:58,300 --> 00:01:01,300
>> Nú, Ken, þó, snýr
út er hluti af horninu að ræða

19
00:01:01,300 --> 00:01:02,880
það er ekki enn gerst áður.

20
00:01:02,880 --> 00:01:05,713
Það kemur í ljós að það var ekki komið
mér að setja smáletur í vanda

21
00:01:05,713 --> 00:01:09,710
sett fjögur sem segir að starfsmenn eru
gjaldgengir fyrir stórkostlegur verðlaun

22
00:01:09,710 --> 00:01:13,130
vegna þess að Ken er að sjálfsögðu, einn af
ljósmyndararnir á starfsfólk okkar.

23
00:01:13,130 --> 00:01:16,820
Nú, með því að segja, að hann
upphaflega skrifaði mér að segja

24
00:01:16,820 --> 00:01:19,180
vinsamlegast ekki senda þessar myndir á netinu.

25
00:01:19,180 --> 00:01:21,630
Ég held að í stórum hluta
vegna flestar myndirnar

26
00:01:21,630 --> 00:01:24,499
að þetta ljósmyndari tók líta
a lítill eitthvað eins og þetta.

27
00:01:24,499 --> 00:01:25,040
Og þess háttar.

28
00:01:25,040 --> 00:01:28,990
>> En Ken langar mig að fullvissa þig
að hann er mjög góður ljósmyndari,

29
00:01:28,990 --> 00:01:33,190
Hann er faglegur, hann tekur
myndir sem eru ekki þoka,

30
00:01:33,190 --> 00:01:37,270
sem eru betri í fókus, og hann
tók alveg nokkrar af okkar eigið starfsfólk.

31
00:01:37,270 --> 00:01:40,370
En frekar en bara að viðurkenna
Ken, sem við héldum að við myndum gera

32
00:01:40,370 --> 00:01:43,390
er að fara í gegnum listann yfir
Raunveruleg nemendur sem lögð fram.

33
00:01:43,390 --> 00:01:48,640
Og það kemur í ljós að Lance með
15 myndir sem í morgun

34
00:01:48,640 --> 00:01:50,030
var sigurvegari okkar.

35
00:01:50,030 --> 00:01:55,730
>> Og á myndinni hér er Lance með Colton,
með Skaz, með sjálfum mér og með Sam.

36
00:01:55,730 --> 00:02:00,230
En þá kemur í ljós að frá og með
11:46, svo bara svolítið síðan,

37
00:02:00,230 --> 00:02:04,380
Ég fór aftur á netfangið mitt og fann
sem við höfðum enn eitt uppgjöf

38
00:02:04,380 --> 00:02:08,300
af nemanda sem heitir Bonnie
Hvers tölvupóst sagði bara þetta.

39
00:02:08,300 --> 00:02:10,800
Ekki að ljúga, ég er
gera þetta á bekknum.

40
00:02:10,800 --> 00:02:17,620
Og þá halda áfram að hengja bara
14 myndir, einn feiminn Lance er 15.

41
00:02:17,620 --> 00:02:22,690
>> En í myndum Bonnie er, það kemur í
út voru margar starfsmenn, Sam

42
00:02:22,690 --> 00:02:25,960
meðal þeirra, svo hvað við héldum að við
myndi gera er að viðurkenna að báðir þessir.

43
00:02:25,960 --> 00:02:29,240
Svo í viðbót við að fá Dropbox
rúm sem allir sem tóku þátt

44
00:02:29,240 --> 00:02:33,900
fær þessar tvær köflum mun einnig
fá gott veitingamaður hádegismat fyrir þá

45
00:02:33,900 --> 00:02:36,100
og kafla þeirra
Mates þetta kemur viku.

46
00:02:36,100 --> 00:02:38,970
Og svo þú munt heyra frá okkur,
Lance og Bonnie, um það.

47
00:02:38,970 --> 00:02:40,002
Svo stór hamingjuóskir til þeirra.

48
00:02:40,002 --> 00:02:42,210
Nú, þeir sem myndu
eins hádegismat almennt

49
00:02:42,210 --> 00:02:45,320
vita að CS50 hádegismat í Cambridge
og New Haven er á föstudaginn.

50
00:02:45,320 --> 00:02:48,510
Fara á CS50 er vefsíða slash RSVP.

51
00:02:48,510 --> 00:02:49,800
Og nú orð á námskeiðum.

52
00:02:49,800 --> 00:02:50,730
Meira curricularly.

53
00:02:50,730 --> 00:02:52,490
Þannig að við erum að nálgast
benda á önn

54
00:02:52,490 --> 00:02:55,200
þar sem þú ættir að byrja
hugsa um lokaverkefni.

55
00:02:55,200 --> 00:02:59,309
Og í raun, í bara smá, mun
Svonefnd fyrirfram tillögur stafað.

56
00:02:59,309 --> 00:03:01,850
Svo fyrirfram tillögur er ætlað að
vera nokkuð lítil áhrif og í raun

57
00:03:01,850 --> 00:03:04,109
bara tækifæri fyrir
þú að skrifa stutta athugasemd

58
00:03:04,109 --> 00:03:06,900
kennslu náungi þinn að apprise
hann eða hana hvað þú ert að hugsa þér

59
00:03:06,900 --> 00:03:09,140
might vilja til að gera fyrir lokaverkefnið þitt.

60
00:03:09,140 --> 00:03:11,730
>> Nú, margir nemendur endað
gera vefur undirstaða lokaverkefni.

61
00:03:11,730 --> 00:03:13,800
Og auðvitað, við erum bara
nú í síðustu viku í þessu

62
00:03:13,800 --> 00:03:15,890
og víðar köfun í forritun á vefnum.

63
00:03:15,890 --> 00:03:18,200
Svo ekki að hafa áhyggjur ef þú
hef ekki hugmynd um hvernig

64
00:03:18,200 --> 00:03:21,594
þú myndi byggja hugmyndir sem
þú gætir hafa í huga.

65
00:03:21,594 --> 00:03:24,510
Þetta er í raun bara að neyða virka
til að fá þig til að hugsa og tala

66
00:03:24,510 --> 00:03:25,650
með TF þinn um það.

67
00:03:25,650 --> 00:03:28,810
En til að hjálpa þér með það, og
með lokaverkefni að lokum,

68
00:03:28,810 --> 00:03:31,750
veit að CS50 hefur hefð
að bjóða námskeið.

69
00:03:31,750 --> 00:03:36,084
>> Og þetta eru valfrjáls, hendur á,
eða fyrirlestur miðað tækifæri

70
00:03:36,084 --> 00:03:39,000
til að læra meira um efni sem
smá viðbót við námskeiðið er

71
00:03:39,000 --> 00:03:43,310
kennsluáætlun, en engu að síður yndislegt
efni til að keyra lokaverkefni.

72
00:03:43,310 --> 00:03:46,840
Og svo er þetta listi sem er
CS50 starfsfólk hér í New Haven

73
00:03:46,840 --> 00:03:48,600
hafa komið upp með fyrir
á þessu ári um IOS

74
00:03:48,600 --> 00:03:50,730
forritun, Android
forritun, leikur þróun,

75
00:03:50,730 --> 00:03:54,480
og bunches af fleiri verkfæri
og tungumál og aðferðir.

76
00:03:54,480 --> 00:03:56,780
>> Svo að hafa auga á heimasíðu CS50 er.

77
00:03:56,780 --> 00:04:00,110
Og í millitíðinni, ef þú vilt
skrá áhuga þinn á eitthvað af þessu,

78
00:04:00,110 --> 00:04:02,510
fara til CS50 er slash skrá.

79
00:04:02,510 --> 00:04:05,770
Og við munum þá fylgja allt sem til
daga og flugáætlanir og staðir

80
00:04:05,770 --> 00:04:09,090
og everything-- mest allt mun
vera streyma og einnig í boði á eftirspurn

81
00:04:09,090 --> 00:04:11,750
eftir ef þú getur ekki í raun að gera það.

82
00:04:11,750 --> 00:04:15,800
Svo án frekari fjaðrafok, við
horfið síðasta skipti með FÁ.

83
00:04:15,800 --> 00:04:19,610
>> Og þetta var eins og skilaboð sem var
inni af the raunverulegur umslagi, muna,

84
00:04:19,610 --> 00:04:23,960
að við liðin frá leið til leið til að
leið milli vefur flettitæki og vefur

85
00:04:23,960 --> 00:04:24,487
miðlara.

86
00:04:24,487 --> 00:04:26,695
Og að boðskapur horfði
lítill eitthvað eins og þetta.

87
00:04:26,695 --> 00:04:29,700
Þetta var meira Bogagöng skilaboðin sem
var í raun inni umslagi

88
00:04:29,700 --> 00:04:34,440
skrifað á blað sem
Fyrsta lína segir bókstaflega, fá skástrik.

89
00:04:34,440 --> 00:04:37,830
>> Og rétt eins og andleg heilbrigði stöðva,
hvað gerði rista tákna?

90
00:04:37,830 --> 00:04:40,455
Hvað þýðir rista meina þegar
að biðja um vefsíðu?

91
00:04:40,455 --> 00:04:43,070

92
00:04:43,070 --> 00:04:44,250
Þú biður um það allan tímann.

93
00:04:44,250 --> 00:04:47,333
Flest allir skipti sem þú heimsækir vefsíðu, þú
í raun ekki að slá inn heiti skráarinnar.

94
00:04:47,333 --> 00:04:50,960
Þú sennilega bara að fara að Facebook.com,
að slá inn, gmail.com, eða þess háttar.

95
00:04:50,960 --> 00:04:52,260
Og hvað þýðir rista tákna?

96
00:04:52,260 --> 00:04:53,506
Hvað skrá?

97
00:04:53,506 --> 00:04:54,630
Eða hvaða síðu, sérstaklega?

98
00:04:54,630 --> 00:04:59,642

99
00:04:59,642 --> 00:05:00,720
>> Vísitalan, já.

100
00:05:00,720 --> 00:05:01,810
Svo sjálfgefna síðu.

101
00:05:01,810 --> 00:05:04,810
Þannig að ef þú tilgreinir ekki skrá
nafn eins og við munum byrja að sjá,

102
00:05:04,810 --> 00:05:07,750
þú ert í raun bara að biðja
gefa mér sjálfgefna síðu af Facebook

103
00:05:07,750 --> 00:05:10,800
eða gefa mér pósthólfið mitt eða gefa
mér sjálfgefið síða fréttum

104
00:05:10,800 --> 00:05:12,510
á vefsíðu CNN eða þess háttar.

105
00:05:12,510 --> 00:05:15,220
Og miðlara bregst þá til
að skilaboðin með eitthvað

106
00:05:15,220 --> 00:05:18,420
eins og þetta, að segja já, ég
tala HTTP útgáfa 1.1.

107
00:05:18,420 --> 00:05:21,130
>> 200, sem er staða
númer sem við menn sjaldan

108
00:05:21,130 --> 00:05:22,790
alltaf að sjá því það er gott.

109
00:05:22,790 --> 00:05:26,640
Því það þýðir lagi, að beiðni
barst og meðhöndlaðar á réttan hátt.

110
00:05:26,640 --> 00:05:28,960
Og efnisgerð
virðist í svari

111
00:05:28,960 --> 00:05:31,170
er nokkuð oft, en ekki alltaf, texta.

112
00:05:31,170 --> 00:05:32,580
Og sérstaklega HTML.

113
00:05:32,580 --> 00:05:34,760
Og það er í raun
þar sem við lítum á dag.

114
00:05:34,760 --> 00:05:37,140
>> Svo í raun, ég ætla að fara
á undan og opna vafra.

115
00:05:37,140 --> 00:05:40,410
Ég ætla að nota Chrome, getur þú notað
flest allir vafrann á næstu vikum til að koma.

116
00:05:40,410 --> 00:05:42,410
Við mælum með almennt Chrome
vegna þess að það er sérstaklega

117
00:05:42,410 --> 00:05:43,750
gott fyrir forritara.

118
00:05:43,750 --> 00:05:46,070
Það fékk mikið af innbyggður í
verkfæri sem gera það auðveldara

119
00:05:46,070 --> 00:05:49,800
að þróa ekki aðeins HTML og CSS,
hlutir sem við munum byrja að tala um í dag,

120
00:05:49,800 --> 00:05:51,530
en einnig önnur tungumál eins og heilbrigður.

121
00:05:51,530 --> 00:05:55,530
>> Og ég ætla að fara á undan og fara to--
Ég ætla að stjórna smellur eða rétt

122
00:05:55,530 --> 00:05:57,210
smelltu einhvers staðar á vefsíðu.

123
00:05:57,210 --> 00:05:59,070
Og ég ætla að fara að skoða frumefni.

124
00:05:59,070 --> 00:06:03,850
Og ég ætla að fínstilla minn
skjár bara svolítið hér.

125
00:06:03,850 --> 00:06:05,790
Leyfðu mér að færa þetta til botns.

126
00:06:05,790 --> 00:06:08,140
Svo er þetta það sem er kallað
Króm Inspector.

127
00:06:08,140 --> 00:06:11,010
Svo er þetta eins og kembiforrit
tól byggð í Chrome.

128
00:06:11,010 --> 00:06:13,520
>> Öll ykkar þegar hafa þetta
ef þú hefur verið að nota Chrome.

129
00:06:13,520 --> 00:06:17,169
Og það gerir þér kleift að sjá hvað er að gerast
á undir hetta sumra vefsíðu.

130
00:06:17,169 --> 00:06:19,210
Svo skulum við taka í raun
líta á þetta eins og hér segir.

131
00:06:19,210 --> 00:06:21,251
Það hefur þannig fleiri möguleika
og okkur er annt um í dag.

132
00:06:21,251 --> 00:06:22,760
En það er þessi flipa hérna.

133
00:06:22,760 --> 00:06:25,890
Elements, net, heimildir,
tímalína, og sum önnur efni.

134
00:06:25,890 --> 00:06:27,800
Ég ætla að smella á
Net um stund.

135
00:06:27,800 --> 00:06:30,500
>> Og það er svolítið yfirþyrmandi
við fyrstu sýn hér.

136
00:06:30,500 --> 00:06:34,190
En það sem ég ætla að gera er að láta
mér einfalda það svolítið.

137
00:06:34,190 --> 00:06:37,560
Ég ætla að kveikja á
upptöku ljósið þannig að það er rautt.

138
00:06:37,560 --> 00:06:39,140
Og ég ætla að segja að varðveita þig inn.

139
00:06:39,140 --> 00:06:41,015
Og þetta er bara smá
sem ég mynstrağur út

140
00:06:41,015 --> 00:06:44,120
tímanum sem er að fara að spara
allt sem gerist í vafranum.

141
00:06:44,120 --> 00:06:50,030
Og nú ætla ég að fara
að http://facebook.com.

142
00:06:50,030 --> 00:06:52,690
>> Reyndar, við skulum gera www
gott mál, rista.

143
00:06:52,690 --> 00:06:53,643
Sláðu.

144
00:06:53,643 --> 00:06:56,180
Svo URL að margir af
þú gætir hafa heimsótt.

145
00:06:56,180 --> 00:06:58,830
Og nú vefur Facebook
síðu kemur upp á toppinn.

146
00:06:58,830 --> 00:07:02,350
Og þá er allt fullt af
efni flaug með neðst.

147
00:07:02,350 --> 00:07:04,830
Og í raun, kemur í ljós að
þegar þú heimsækir facebook.com,

148
00:07:04,830 --> 00:07:09,320
þú ert ekki bara að gera eitt HTTP beiðni,
það kemur í ljós að fara til Facebook.com

149
00:07:09,320 --> 00:07:14,320
sendir 41 af þeim umslag,
hvert með eigin FÁ beiðni hennar,

150
00:07:14,320 --> 00:07:18,360
eins og tilgreint er, að vísu á bak við skjáinn
hér, neðst á skjánum,

151
00:07:18,360 --> 00:07:24,040
það gefur til kynna að, örugglega, minn
Vafrinn gerði 41 beiðnir.

152
00:07:24,040 --> 00:07:29,689
>> Og alls, flytja það 861
kílóbæti og það tók fyrir sumir ástæða

153
00:07:29,689 --> 00:07:31,730
eins og margir eins og átta sekúndur
að sækja allt það.

154
00:07:31,730 --> 00:07:33,790
Svo er það í raun svolítið skrýtið
þessi síða Facebook myndi taka að

155
00:07:33,790 --> 00:07:35,600
lengi, en svo vera það í þessu tilfelli.

156
00:07:35,600 --> 00:07:39,520
Nú, allt þetta sem ég er ekki alveg sama
um nema hæstur beiðni.

157
00:07:39,520 --> 00:07:46,440
Svo skulum við fara til þessa hérna
og láta mig súmma út fyrir réttlátur a augnablik.

158
00:07:46,440 --> 00:07:47,754
>> Og láta mig stækka á þessu.

159
00:07:47,754 --> 00:07:50,670
Svo það sem ég hef gert á vinstri jafnvel þótt
það er mikið að gerast hérna

160
00:07:50,670 --> 00:07:53,360
er ég hápunktur
Facebook.com og þá

161
00:07:53,360 --> 00:07:56,540
eftir því að ég er að fletta niður,
fletta niður, skruna niður,

162
00:07:56,540 --> 00:07:58,330
að biðja haus.

163
00:07:58,330 --> 00:08:01,720
Og þú munt sjá að Chrome er að sýna
me meginatriðum innri innihald

164
00:08:01,720 --> 00:08:02,810
beiðninnar ég gerði.

165
00:08:02,810 --> 00:08:06,130
Það er ekki að forsníða í alveg sama
leið, en eftir það er minnst á að fá,

166
00:08:06,130 --> 00:08:09,481
eftir því að það er minnst á her,
Facebook.com, leið, eða rista,

167
00:08:09,481 --> 00:08:10,730
sem er skrá I óskað.

168
00:08:10,730 --> 00:08:12,930
>> Og þá ef ég skruna
aftur upp, munum við í raun

169
00:08:12,930 --> 00:08:17,270
sjá að það Facebook aftur
mér er öll þessi haus.

170
00:08:17,270 --> 00:08:21,040
Svo inni í því raunverulegur umslagi
reyndar eru fullt af helstu gildi pör.

171
00:08:21,040 --> 00:08:23,130
Orð, tvípunktur, og þá gildi.

172
00:08:23,130 --> 00:08:25,050
Orð, tvípunktur og gildi.

173
00:08:25,050 --> 00:08:26,160
Þetta eru kallaðir haus.

174
00:08:26,160 --> 00:08:31,860
Og það er vegur meira smáatriði hér en
við sama í raun um núna.

175
00:08:31,860 --> 00:08:33,750
>> En þetta er annað að
seinast þarna niðri,

176
00:08:33,750 --> 00:08:38,809
fyrirvara að miðlara facebook.com er,
reyndar sagði hér kemur smá texti HTML.

177
00:08:38,809 --> 00:08:41,409
Svo er þetta allt að segja
að þegar þú biður vefur

178
00:08:41,409 --> 00:08:44,300
síðu úr vafranum til a
miðlara, að netþjónn bregst

179
00:08:44,300 --> 00:08:47,630
með umslagi á eigin spýtur
inni sem er texti.

180
00:08:47,630 --> 00:08:49,020
Með öðrum orðum, HTML.

181
00:08:49,020 --> 00:08:50,590
HyperText Markup Language.

182
00:08:50,590 --> 00:08:53,200
Sem er annað mál
að við kynna dag

183
00:08:53,200 --> 00:08:57,740
að menn eða tölvur búa
í því skyni að hrinda í framkvæmd vefsíðum.

184
00:08:57,740 --> 00:08:59,580
>> Sérstaklega, við skulum líta á þetta.

185
00:08:59,580 --> 00:09:03,277
Ég ætla að nú fara aftur
á vefsvæðið Facebook.

186
00:09:03,277 --> 00:09:05,360
Og ég ætla bara að
stjórn smellur eða hægrismelltu

187
00:09:05,360 --> 00:09:07,634
og smelltu á View Page Source.

188
00:09:07,634 --> 00:09:10,550
Og jafnvel ef þú notar ekki Chrome,
IE getur gert þetta, Firefox getur gert þetta,

189
00:09:10,550 --> 00:09:14,060
Safari getur gert þetta, jafnvel þótt valmyndinni
möguleikar getur litið svolítið öðruvísi.

190
00:09:14,060 --> 00:09:18,990
Og þetta er HTML sem Mark og
Félagið á Facebook hafa skrifað.

191
00:09:18,990 --> 00:09:24,640
>> Og sameiginlega, þetta tungumál hér
útfærir bláa og hvíta síðu

192
00:09:24,640 --> 00:09:26,370
sem við sáum áðan.

193
00:09:26,370 --> 00:09:28,030
Nú, þetta er svolítið yfirþyrmandi.

194
00:09:28,030 --> 00:09:31,400
En ef við lítum upp á efst til vinstri, við erum
að fara að byrja að sjá nokkrar mynstur.

195
00:09:31,400 --> 00:09:34,140
Það lítur út eins og það er mikið
þessara open angle bracket

196
00:09:34,140 --> 00:09:35,970
og þá er það þessi leitarorð HTML.

197
00:09:35,970 --> 00:09:38,330
Hér er annar opinn
oddklofi og höfuð.

198
00:09:38,330 --> 00:09:41,560
>> Hér er, ef við skruna niður
og niður og niður, ég er

199
00:09:41,560 --> 00:09:43,820
að fara á undan og reyna
að leita að einhverju.

200
00:09:43,820 --> 00:09:48,510
Það leið yfir á hægri
hér er opinn krappi líkami.

201
00:09:48,510 --> 00:09:50,800
Og muna frá síðustu
sinn sem við lagt

202
00:09:50,800 --> 00:09:53,364
sem einföldustu vefsíðu
að mönnum gæti skrifað

203
00:09:53,364 --> 00:09:55,030
gæti litið svolítið eitthvað eins og this.

204
00:09:55,030 --> 00:09:58,430
Open HTML tag, opinn höfuð
tag, opinn titill tag,

205
00:09:58,430 --> 00:10:03,230
síðan lokað titill, lokað höfuð, opinn
líkami tag, einhver texti, lokað líkama,

206
00:10:03,230 --> 00:10:04,720
lokað HTML.

207
00:10:04,720 --> 00:10:06,290
>> En hlé hér fyrir réttlátur a augnablik.

208
00:10:06,290 --> 00:10:09,030
Þetta númer, jafnvel ef þú hefur
aldrei skrifað það áður

209
00:10:09,030 --> 00:10:11,864
en samt ekki alveg að skilja
hvað er að gerast, lítur mjög vel út.

210
00:10:11,864 --> 00:10:12,821
Rétt, það er mjög hreinn.

211
00:10:12,821 --> 00:10:14,120
Það er mjög stylistically gott.

212
00:10:14,120 --> 00:10:16,190
A einhver fjöldi af skerðing og hvítt rúm.

213
00:10:16,190 --> 00:10:18,020
Facebook er ekki.

214
00:10:18,020 --> 00:10:23,190
Svo er Facebook hvers vegna svo mikið
verra en ég á að skrifa HTML?

215
00:10:23,190 --> 00:10:24,310
Apparently.

216
00:10:24,310 --> 00:10:26,899
>> Rétt, þetta er eins og einn
af fimm fyrir stíl.

217
00:10:26,899 --> 00:10:29,315
Það er sannfærandi ástæða
fyrir þá að skera þessar horn.

218
00:10:29,315 --> 00:10:31,069

219
00:10:31,069 --> 00:10:33,860
Allt í lagi, svo þeir vilja ekki að
gera það auðveldara fyrir þig að lesa það.

220
00:10:33,860 --> 00:10:36,940
Svo í einhverjum skilningi, þá eru þeir
obfuscating það, eins konar spæna það

221
00:10:36,940 --> 00:10:40,260
að minnsta kosti fagurfræðilega svo
að það er erfiðara fyrir Myspace

222
00:10:40,260 --> 00:10:42,705
að fara og rífa burt þeirra
Heimasíðan og HTML fyrir það.

223
00:10:42,705 --> 00:10:45,080
Það kemur í ljós að með áætlunum
þó, þar á meðal Króm,

224
00:10:45,080 --> 00:10:47,020
við getum hreinsa þetta upp frábær auðveldlega.

225
00:10:47,020 --> 00:10:49,420
Svo það er ekki alveg það sem ástæðu.

226
00:10:49,420 --> 00:10:51,290
Hvað annað gæti verið orsök.

227
00:10:51,290 --> 00:10:51,790
Já.

228
00:10:51,790 --> 00:10:54,680

229
00:10:54,680 --> 00:10:55,890
Já, hvítt rúm kostnaður gögn.

230
00:10:55,890 --> 00:10:56,598
Hvað meinarðu?

231
00:10:56,598 --> 00:11:02,250

232
00:11:02,250 --> 00:11:02,979
Já, einmitt.

233
00:11:02,979 --> 00:11:06,020
Ef þú högg á TAB takkann mikið eða
rúm bar, íhuga afleiðingar.

234
00:11:06,020 --> 00:11:10,060
Svo er hver lykill á lyklaborðinu sem
[Inaudible] fulltrúa sem eitt bæti.

235
00:11:10,060 --> 00:11:14,560
>> Svo ætla að Mark eða einhverju devs
þessa dagana hits rúm bara einu sinni

236
00:11:14,560 --> 00:11:17,899
í þessari HTML síðu sem
táknar upphafssíðuna Facebook.

237
00:11:17,899 --> 00:11:19,690
Og Facebook hefur mikið
notenda þessa dagana.

238
00:11:19,690 --> 00:11:24,030
Svo ætla að heimasíðunni Facebook
er heimsótt af milljarð manns í dag.

239
00:11:24,030 --> 00:11:27,020
Og einhver á Facebook hefur
högg the rúm bar bara einu sinni.

240
00:11:27,020 --> 00:11:29,890
>> Svo einn til viðbótar bæti,
milljarð beiðnir,

241
00:11:29,890 --> 00:11:32,790
hversu miklu meira gögn Facebook
flytja yfir netið

242
00:11:32,790 --> 00:11:37,160
vegna þess að einhver högg
rúm á lyklaborðinu hans eða hennar?

243
00:11:37,160 --> 00:11:41,660
A milljarða bytes, eða einn gígabæti af
gögn eru send frá Facebook netþjónum

244
00:11:41,660 --> 00:11:43,626
að fólk í kringum
heimur fyrir neitun góður ástæða.

245
00:11:43,626 --> 00:11:44,750
Nú, það er bara eitt bil.

246
00:11:44,750 --> 00:11:48,866
>> Ímyndaðu þér ef við hreinsa raun þetta
hlutur upp og grafin það og bætti

247
00:11:48,866 --> 00:11:50,990
a einhver fjöldi af hvítum rúm og
Tab stafir og bil,

248
00:11:50,990 --> 00:11:53,656
þú endar útgjöld gígabæta,
ef ekki Terra bytes meira pláss.

249
00:11:53,656 --> 00:11:56,640
Og svo frábær algeng í
Raunveruleg heimur vefur þróun

250
00:11:56,640 --> 00:11:58,950
er að minify kóðann þinn.

251
00:11:58,950 --> 00:12:01,280
Og við munum að lokum sjá
hvernig þú gætir gert þetta.

252
00:12:01,280 --> 00:12:04,630
>> En í dag, munum við byrja að skrifa kóða
það er í raun læsileg með okkur mönnum.

253
00:12:04,630 --> 00:12:10,120
Það kemur í ljós, þó, ef þú ferð aftur
að þetta tól í Króm Skoðið Element,

254
00:12:10,120 --> 00:12:12,030
áður, við vorum á Network flipann.

255
00:12:12,030 --> 00:12:15,430
Það kemur í ljós að ef þú ferð til
þættir flipann, það sem þú sérð í raun

256
00:12:15,430 --> 00:12:19,230
er Króm nokkuð prentuð
útgáfa af sama HTML.

257
00:12:19,230 --> 00:12:20,640
Þannig að við höfum deobfuscated það.

258
00:12:20,640 --> 00:12:22,472
Svo það er ekki passa fyrir tölvu.

259
00:12:22,472 --> 00:12:24,430
Og nú þú geta raunverulega
smella í kring og byrja

260
00:12:24,430 --> 00:12:27,630
að sjá stigveldi sem er vefsíða.

261
00:12:27,630 --> 00:12:28,780
Svo skulum gera í raun þetta.

262
00:12:28,780 --> 00:12:32,120
Ég ætla að fara á undan og opna upp á
Mac minn forrit sem heitir texti breyta.

263
00:12:32,120 --> 00:12:35,490
Og muna að þetta er bara
frábær einfaldur texti program.

264
00:12:35,490 --> 00:12:37,490
Windows hefur notepad.exe.

265
00:12:37,490 --> 00:12:39,820
Og ég ætla að orðrétt
tegund the hópur stuðningsmanna.

266
00:12:39,820 --> 00:12:44,650
Doc tegund HTML, opið krappi
HTML, lokað krappi HTML,

267
00:12:44,650 --> 00:12:49,000
við höfum höfuð síðu hér,
the endir af the höfuð síðu hér,

268
00:12:49,000 --> 00:12:52,310
titill verður eins, halló heimur.

269
00:12:52,310 --> 00:12:56,660
>> Og þá niður hér, þurfum við
líkami vefsíðu.

270
00:12:56,660 --> 00:12:58,050
Lokað líkami.

271
00:12:58,050 --> 00:13:00,700
Og þá hér, halló heimur.

272
00:13:00,700 --> 00:13:01,270
Allt í lagi.

273
00:13:01,270 --> 00:13:03,350
Þannig að við höfum skrifað frábær fljótur vefsíðu.

274
00:13:03,350 --> 00:13:06,675
Ég ætla að vista hana sem
hello.html á skjáborðið.

275
00:13:06,675 --> 00:13:09,050
My Mac er að fara að kvarta,
hugsa það, bíddu í eina mínútu,

276
00:13:09,050 --> 00:13:11,091
þetta er textaskrá, gera
þú vilt kalla það .txt?

277
00:13:11,091 --> 00:13:13,300
En nei, ég vil nota punktur HTML.

278
00:13:13,300 --> 00:13:16,140
>> Og þá er það gott ef ég
réttlátur tvöfaldur smellur á þessa skrá,

279
00:13:16,140 --> 00:13:18,600
hello.html, hér er vefsíða mín.

280
00:13:18,600 --> 00:13:22,564
Því miður, ég er
eina manneskjan í heiminum

281
00:13:22,564 --> 00:13:23,980
sem getur heimsótt þessa síðu núna.

282
00:13:23,980 --> 00:13:26,734
Vegna þess að þar er það lifandi virðist?

283
00:13:26,734 --> 00:13:27,650
Það er á Mac minn, ekki satt?

284
00:13:27,650 --> 00:13:28,470
Sem er gagnslaus.

285
00:13:28,470 --> 00:13:30,390
Eins og enginn í þessu herbergi
hvað þá á internetinu

286
00:13:30,390 --> 00:13:31,598
geta í raun fara á þá síðu.

287
00:13:31,598 --> 00:13:33,820
Svo í dag, þurfum við að
kynna annar þáttur.

288
00:13:33,820 --> 00:13:36,720
>> Og til að gera þetta, ég ætla að
fara á undan og opna ský 9.

289
00:13:36,720 --> 00:13:40,090
Svo er ský 9 auðvitað
ský undirstaða service-- CS50

290
00:13:40,090 --> 00:13:44,890
IDE-- Það hefur alla vinnusvæði okkar
gangi einhvers staðar á internetinu.

291
00:13:44,890 --> 00:13:48,330
Og það þýðir að allar skrár okkar
eru aðgengileg almenningi nú þegar.

292
00:13:48,330 --> 00:13:49,830
Svo skulum við fara á undan og gera þetta.

293
00:13:49,830 --> 00:13:53,670
Ég ætla að fara á undan og
búa til nýja skrá NCS50IDE.

294
00:13:53,670 --> 00:13:58,819
Ég ætla að spara það eins og áður
sem hello.html og smellir á Vista.

295
00:13:58,819 --> 00:14:01,860
Og nú bara til að spara tíma, ég er að fara
að fara á undan og afrita líma þennan kóða

296
00:14:01,860 --> 00:14:03,470
frekar en retype það.

297
00:14:03,470 --> 00:14:04,550
Og vista hana.

298
00:14:04,550 --> 00:14:07,550
Og svo nú hef ég a
skrá sem heitir hello.html.

299
00:14:07,550 --> 00:14:09,710
En hvernig get ég í raun
opna sem vefsíðu?

300
00:14:09,710 --> 00:14:14,120
Jæja, það kemur í ljós að byggð á CS50
IDE er ekki bara þýðanda eins clang

301
00:14:14,120 --> 00:14:16,670
og a aflúsara eins gdb og
bunches af öðrum forritum,

302
00:14:16,670 --> 00:14:21,140
there 'raunverulega a fullur viðvaningur
vefur framreiðslumaður hlaupandi innan CS50 IDE.

303
00:14:21,140 --> 00:14:23,900
>> Allir þér, það er að segja,
hafa eigin vefþjón þinn.

304
00:14:23,900 --> 00:14:26,850
Og a vefur framreiðslumaður er bara stykki
á hugbúnaði en tilgangur hennar í lífinu

305
00:14:26,850 --> 00:14:28,220
er að þjóna upp vefsíður.

306
00:14:28,220 --> 00:14:32,490
Að hlusta eftir beiðnum frá vafra og
bregðast við með litlu raunverulegur umslag

307
00:14:32,490 --> 00:14:35,290
inni sem er
efni sem ég hef skrifað.

308
00:14:35,290 --> 00:14:38,372
Svo er þetta vefur framreiðslumaður
í raun frjáls og opinn uppspretta.

309
00:14:38,372 --> 00:14:40,830
Þar opinn uppspretta þýðir bara
hugbúnaður sem einhver annar hefur

310
00:14:40,830 --> 00:14:43,480
skrifað að allir af okkur getur
í raun sjá og sækja og jafnvel

311
00:14:43,480 --> 00:14:44,780
breyta kóðann.

312
00:14:44,780 --> 00:14:46,150
Og það er kallað Apache.

313
00:14:46,150 --> 00:14:51,450
>> Og við höfum gert það svolítið auðveldara að
nota í CS50IDE því að kalla það Apache 50.

314
00:14:51,450 --> 00:14:53,780
Þannig að það getur í raun
skilja eftirfarandi.

315
00:14:53,780 --> 00:14:56,560
Ég ætla að segja Apache 50 byrjun.

316
00:14:56,560 --> 00:14:58,910
Og þá er ég bara að fara að segja punktur.

317
00:14:58,910 --> 00:15:01,080
Og við sjáum nokkrar nokkuð
yfirnáttúrulegt skilaboð orðatiltæki

318
00:15:01,080 --> 00:15:04,640
setja Apache skjal [? hópur?]
heimili, Ubuntu, hvað sem er,

319
00:15:04,640 --> 00:15:05,770
rista vinnusvæði.

320
00:15:05,770 --> 00:15:08,280
Byrjar vefþjóni
Apache 2 með góðum árangri.

321
00:15:08,280 --> 00:15:11,330
>> Svo löng saga stutt, ég
hafa bara ýtt á hnapp

322
00:15:11,330 --> 00:15:18,000
og kveikt á vefþjóni sem er nú
hlusta á internetinu á TCP höfn

323
00:15:18,000 --> 00:15:20,587
80 í tilteknu heimilisfangi.

324
00:15:20,587 --> 00:15:22,420
Og það segir hér, og
þetta mun breytast Byggt

325
00:15:22,420 --> 00:15:26,550
á notendanafni og öðrum þáttum,
en taka nú ef ég smelli þessu,

326
00:15:26,550 --> 00:15:30,211
IDE50 punktur jharvard og svo og
svo, eftir að allan þennan tíma

327
00:15:30,211 --> 00:15:31,960
á undanförnum
vikur, þú might hafa

328
00:15:31,960 --> 00:15:35,200
tók eftir því að eiga notendanafnið þitt
er felldur inn í topp hægri hendi

329
00:15:35,200 --> 00:15:37,130
horni CS50IDE.

330
00:15:37,130 --> 00:15:41,050
>> Og að í raun hafi verið allt þetta
tímasetja heimilisfang þar sem þú getur

331
00:15:41,050 --> 00:15:43,574
heimsækja allar skrár í gegnum vefinn.

332
00:15:43,574 --> 00:15:45,990
Þangað til nú, það hefur ekki máli,
vegna þess að í C, er yfirleitt

333
00:15:45,990 --> 00:15:48,073
vilja það gangi í
flugstöðinni, ekki á vefnum.

334
00:15:48,073 --> 00:15:50,800
En í dag, byrjum við
skrifa vefur undirstaða kóða

335
00:15:50,800 --> 00:15:53,350
sem við viljum
aðgengileg á opinberum slóðum.

336
00:15:53,350 --> 00:15:56,100
Svo það sem ég ætla að
gera er að smella á þessa slóð.

337
00:15:56,100 --> 00:16:00,880
>> Og eftir að ég sé nokkuð
ljótur vísitölu skrá skráningu,

338
00:16:00,880 --> 00:16:04,090
en hvaða skrá stökk út á þig sennilega?

339
00:16:04,090 --> 00:16:05,210
Hello.html.

340
00:16:05,210 --> 00:16:07,870
Það er vegna þess að ég bjargaði
skrá í vinnurými mínu.

341
00:16:07,870 --> 00:16:12,310
Og það sem ég hef sagt Apache vefþjón
er að leita í vinnusvæði skrá Davíðs.

342
00:16:12,310 --> 00:16:15,300
Og láta einhver í
heimurinn sjá þær skrár.

343
00:16:15,300 --> 00:16:19,050
>> Og reyndar, ef ég nú
smelltu á hello.html,

344
00:16:19,050 --> 00:16:22,180
Ég sé innan þessa flipa einmitt þessi skrá.

345
00:16:22,180 --> 00:16:26,430
Nú taka, Cloud 9 er að gera
eitthvað smá gagnlegt fyrir okkur.

346
00:16:26,430 --> 00:16:29,480
Innan CS50 IDE, eftir því að það er
skyndilega heimilisfang bar.

347
00:16:29,480 --> 00:16:33,690
Það er vegna þess að jafnvel þó að við erum
nota Chrome til að heimsækja CS50IDE,

348
00:16:33,690 --> 00:16:37,940
inni CS50IDE er eigin
útgáfa af vafranum núna.

349
00:16:37,940 --> 00:16:40,820
Og svo frekar en
flækja hlutina sem slík,

350
00:16:40,820 --> 00:16:42,955
Ég ætla að fara á undan
og bara að afrita þessa slóð.

351
00:16:42,955 --> 00:16:45,330
Ég ætla að fara á undan og bara
opna eigin Chrome gluggann minn.

352
00:16:45,330 --> 00:16:47,800
Þannig að það er engin galdur hér, engin CS50IDE.

353
00:16:47,800 --> 00:16:51,800
Ég ætla bara að fara að bókstaflega líma
minn J Harvard URL og ýta á Enter.

354
00:16:51,800 --> 00:16:54,750
Og voila, nú er ég, og
í orði, allir

355
00:16:54,750 --> 00:16:57,700
á internetinu, ef ég hef stillt
heimildir á viðeigandi hátt,

356
00:16:57,700 --> 00:16:58,720
getur heimsótt þessa skrá.

357
00:16:58,720 --> 00:17:03,230
Og svo nú, ef ég sagði
hello.html, Voila, það

358
00:17:03,230 --> 00:17:06,366
er ótrúlega underwhelming vefsíðu mína.

359
00:17:06,366 --> 00:17:07,740
Svo skulum gera a fljótur geðheilsu stöðva.

360
00:17:07,740 --> 00:17:09,710
Vegna þess að öll sem
er huglæg sett upp.

361
00:17:09,710 --> 00:17:13,180
Og við höfum í raun ekki raunverulega
Kennt hvernig á að skrifa HTML í sjálfu sér.

362
00:17:13,180 --> 00:17:16,084
Einhverjar spurningar svona langt
á hvað er bara gerðist?

363
00:17:16,084 --> 00:17:18,549

364
00:17:18,549 --> 00:17:19,049
Já.

365
00:17:19,049 --> 00:17:24,290

366
00:17:24,290 --> 00:17:25,800
Er CS50 eiga þessar vefsíður?

367
00:17:25,800 --> 00:17:26,460
Í hvaða skilningi?

368
00:17:26,460 --> 00:17:28,947

369
00:17:28,947 --> 00:17:29,530
Góð spurning.

370
00:17:29,530 --> 00:17:32,429
Svo nú CS50 er CS50.io.

371
00:17:32,429 --> 00:17:33,970
Við höfum reyndar keypt það lén.

372
00:17:33,970 --> 00:17:37,240
Og með því að eðli ykkur
skrá þig inn CS50IDE,

373
00:17:37,240 --> 00:17:39,270
þú fá allt það sem er kallað undirlén.

374
00:17:39,270 --> 00:17:46,840
>> Svo IDE50-MALAN eða IDE50-Rob.CS50.io,
sem er einstakt netfang þitt innan

375
00:17:46,840 --> 00:17:47,730
lén okkar.

376
00:17:47,730 --> 00:17:50,850
Svo að því er varðar að sjálfsögðu,
þú hafa eigin netfangið þitt.

377
00:17:50,850 --> 00:17:55,150
En við höfum einfaldað hlutina með
kaupa lénsendingu, CS50 punktur

378
00:17:55,150 --> 00:17:58,050
I / O og þá er allir aðrir
inni um það, svo að segja.

379
00:17:58,050 --> 00:17:59,890
Og við munum koma aftur til að
í nokkrar vikur líklega,

380
00:17:59,890 --> 00:18:01,930
sérstaklega á lokaverkefni
tími, þegar sumir af þú

381
00:18:01,930 --> 00:18:03,596
might vilja til fá eigið lén nöfn.

382
00:18:03,596 --> 00:18:06,270
Það er í raun tiltölulega
einfalt.

383
00:18:06,270 --> 00:18:06,770
Allt í lagi.

384
00:18:06,770 --> 00:18:07,880
Svo skulum nú gera þetta.

385
00:18:07,880 --> 00:18:11,910
Ég ætla að fara aftur í
CS50IDE, þar skrá minn núna,

386
00:18:11,910 --> 00:18:14,710
hello.html, er ekki allt sem áhugavert.

387
00:18:14,710 --> 00:18:17,130
Mig langar til að gera eitthvað
svolítið betur en það.

388
00:18:17,130 --> 00:18:19,440
Þannig að ég ætla að gera eitthvað svona.

389
00:18:19,440 --> 00:18:21,510
Leyfðu mér að opna paragraphs.html.

390
00:18:21,510 --> 00:18:23,560
Þannig að þetta er skrá sem ég skrifaði í fyrirfram.

391
00:18:23,560 --> 00:18:26,480
Á toppur af það, eins og
alltaf, höfum við athugasemdir.

392
00:18:26,480 --> 00:18:28,730
En í HTML, athugasemdir
líta svolítið öðruvísi.

393
00:18:28,730 --> 00:18:33,270
Á línu þrjú og línu 14, þú
sjá setningafræði fyrir byrjun athugasemd

394
00:18:33,270 --> 00:18:34,020
og enda umsögn.

395
00:18:34,020 --> 00:18:36,820
>> En ekkert af efni í
milli mála virkni.

396
00:18:36,820 --> 00:18:40,250
Það er bara í huga að a
manna hvað er að gerast hér.

397
00:18:40,250 --> 00:18:43,040
Og rétt eins og a fljótur geðheilsu
athuga, hvort ég skruna niður,

398
00:18:43,040 --> 00:18:46,820
hvað er augljóst nýr
tag sem við höfum kynnt?

399
00:18:46,820 --> 00:18:52,130
Merkin svona langt við höfum séð eru opin
krappi HTML, höfuð, titill, og líkami.

400
00:18:52,130 --> 00:18:54,400
En hvað er augljóslega nýtt núna?

401
00:18:54,400 --> 00:18:55,200
>> Já, svo bls.

402
00:18:55,200 --> 00:18:57,320
P tag eða tag lið.

403
00:18:57,320 --> 00:19:01,182
Og þá er ég að láni bara smá sjálfgefið
Latin texta til að mynda málsgreinar mínum.

404
00:19:01,182 --> 00:19:03,390
Því hvað ég vildi að
sýna er hvernig þú gætir

405
00:19:03,390 --> 00:19:05,859
tákna málsgreinum texta í HTML.

406
00:19:05,859 --> 00:19:08,400
Og svo það sem er að byrja að gerast
hér er að það er nú þegar

407
00:19:08,400 --> 00:19:09,657
mynstur þróa.

408
00:19:09,657 --> 00:19:10,990
Og láta mig fara á undan og gera þetta.

409
00:19:10,990 --> 00:19:12,760
Leyfðu mér að snúa fyrst burt Apache.

410
00:19:12,760 --> 00:19:17,340
Og ég ætla að segja það til að byrja sig
aftur inni uppspretta dag sjö

411
00:19:17,340 --> 00:19:18,420
m skrá.

412
00:19:18,420 --> 00:19:20,100
Svo að ég hef aðgang að öllu.

413
00:19:20,100 --> 00:19:22,230
>> Og nú, ef ég fer aftur til
þessari skrá skráningu,

414
00:19:22,230 --> 00:19:24,846
eftir ég sjá alla skrána frá því í dag.

415
00:19:24,846 --> 00:19:26,720
Og þú munt sjá í
Næsta vandamál setja, við munum

416
00:19:26,720 --> 00:19:28,594
Þú færð leiðbeiningar
fyrir að gera nákvæmlega þetta.

417
00:19:28,594 --> 00:19:35,210
Ef ég opna paragraphs.html, þetta gæti
eins vel líta út eins og forritunarmál

418
00:19:35,210 --> 00:19:36,970
að þér ef þú talar ekki eða lesa latínu.

419
00:19:36,970 --> 00:19:40,525
En þetta er aðeins þremur liðum
texta sem eru merktir upp í HTML.

420
00:19:40,525 --> 00:19:43,100
>> Og taka málsgrein
hlé á milli þeirra.

421
00:19:43,100 --> 00:19:46,400
Vegna þess að það kemur í ljós,
og jafnvel þó að þú

422
00:19:46,400 --> 00:19:49,210
gæti verið hneigðist til að gera þetta,
en í hinum raunverulega heimi,

423
00:19:49,210 --> 00:19:51,370
ef þú vilt setja línuna
hlé milli hluta,

424
00:19:51,370 --> 00:19:55,680
þú gætir einfaldlega
gera þetta og högg Vista.

425
00:19:55,680 --> 00:19:59,460
Og nú, ef ég endurhlaða hér, tilkynning
að allt dofnar bara saman

426
00:19:59,460 --> 00:20:01,100
í aðeins eitt Blob texta.

427
00:20:01,100 --> 00:20:03,570
Vegna HTML er góður af heimsk tungumáli.

428
00:20:03,570 --> 00:20:07,230
>> Því er ætlað að nota á þann
leið að vafrinn mun aðeins

429
00:20:07,230 --> 00:20:09,920
gera sérstaklega hvað þú segir það að gera.

430
00:20:09,920 --> 00:20:12,890
Svo ef þú segir ekki það
gefa mér nýja málsgrein,

431
00:20:12,890 --> 00:20:14,569
þú ert ekki að fara að sjá nýja málsgrein.

432
00:20:14,569 --> 00:20:16,360
Og í raun, hvað
Vafrinn er að fara að gera

433
00:20:16,360 --> 00:20:20,020
er jafnvel ef þú högg inn,
skulum segja aftur og aftur

434
00:20:20,020 --> 00:20:23,190
og aftur, færa textann leið
niður á skjánum og vista síðan

435
00:20:23,190 --> 00:20:26,610
og þá endurhlaða, vafrinn er að fara
að hrynja öll þessi hvítu plássi

436
00:20:26,610 --> 00:20:29,021
í aðeins einu, sýnilega bil.

437
00:20:29,021 --> 00:20:29,520
Allt í lagi.

438
00:20:29,520 --> 00:20:30,869
Svo er til að ákvæðið tag.

439
00:20:30,869 --> 00:20:32,910
Og svo hvað er að venju
sem er að þróa hér?

440
00:20:32,910 --> 00:20:37,450
Jæja, það virðist vera raunin að
HTML er allt um að byrja á merki

441
00:20:37,450 --> 00:20:38,460
og endar merki.

442
00:20:38,460 --> 00:20:39,300
Og hvað er tag?

443
00:20:39,300 --> 00:20:41,160
Jæja, það er bara klumpur af setningafræði.

444
00:20:41,160 --> 00:20:44,400
Open krappi, leitarorð,
lokað krappi, er tag.

445
00:20:44,400 --> 00:20:45,510
Eða byrja tag.

446
00:20:45,510 --> 00:20:48,590
Og svo þegar þú ert
gert að tjá þig,

447
00:20:48,590 --> 00:20:52,300
eins og í þú ert búinn með lið,
þú gerir svo að segja hið gagnstæða.

448
00:20:52,300 --> 00:20:55,480
En hið gagnstæða er ekki alveg afturábak.

449
00:20:55,480 --> 00:21:00,630
>> Þú forskeytið einfaldlega sama tag er
nafn með skástrik eins og þetta.

450
00:21:00,630 --> 00:21:01,130
Allt í lagi.

451
00:21:01,130 --> 00:21:02,570
Svo ekki allt sem spennandi.

452
00:21:02,570 --> 00:21:05,270
Og í raun, við erum ekki að gera
vefur allt að meira áhugavert.

453
00:21:05,270 --> 00:21:07,630
Hvað ef ég vil gera
það stærri og djörf?

454
00:21:07,630 --> 00:21:11,780
Svo kemur í ljós að hér er dæmi
í headings.html, þar á líkama mínum,

455
00:21:11,780 --> 00:21:17,280
Ég hef fengið H1 tag, h2, h3,
fjögur, fimm, eða sex, sem allt

456
00:21:17,280 --> 00:21:18,310
virðast nokkuð yfirnáttúrulegt.

457
00:21:18,310 --> 00:21:21,010
En ef ég fer að opna þetta
dæmi, við skulum taka a líta.

458
00:21:21,010 --> 00:21:22,490
Headings.html.

459
00:21:22,490 --> 00:21:27,030
>> Svo vafrar sjálfgefið getur gefið þér texta
það er stór og djörf af ólíkum stærðum.

460
00:21:27,030 --> 00:21:28,070
H1 er stór.

461
00:21:28,070 --> 00:21:31,240
H6 er minni og þá
allt annað á milli.

462
00:21:31,240 --> 00:21:34,170
Svo er það áhugavert en samt
í raun ekki vefur sem ég veit.

463
00:21:34,170 --> 00:21:36,870
Hvað ef við viljum ég hef
eitthvað eins lista. .

464
00:21:36,870 --> 00:21:40,190
Svo hér er Doppulisti af
þrír húsa Harvard.

465
00:21:40,190 --> 00:21:41,600
>> Hvernig fóruð þér að gera þetta?

466
00:21:41,600 --> 00:21:45,410
Jæja, taka a líta á list.html.

467
00:21:45,410 --> 00:21:47,870
Og hér, sjáum við
smá funkiness

468
00:21:47,870 --> 00:21:49,630
en við skulum íhuga hvað er að gerast.

469
00:21:49,630 --> 00:21:56,182
Svo miðað við það sem þú hefur bara séð,
UL stendur fyrir óraðaða lista.

470
00:21:56,182 --> 00:21:57,640
Óraðaðan lista bara þýðir áherslumerktur.

471
00:21:57,640 --> 00:21:58,431
Það er engin númer.

472
00:21:58,431 --> 00:22:01,850
Það er líka eitthvað sem nefnist
pantaði lista, sem er OL á merkinu.

473
00:22:01,850 --> 00:22:05,350
Þá LI, listi atriði er allt það þýðir.

474
00:22:05,350 --> 00:22:07,790
>> Og svo það sjálfkrafa
tölur allt fyrir þig.

475
00:22:07,790 --> 00:22:11,270
En aftur, öll skerðing mín
og hvítt rúm er bara mín vegna.

476
00:22:11,270 --> 00:22:13,050
Vafrinn er ekki
í raun að fara að kæra.

477
00:22:13,050 --> 00:22:16,670
Svo jafnvel þó að þú gætir ekki
gera þetta, bara til að vera skýr,

478
00:22:16,670 --> 00:22:19,880
þú ættir ekki að jafna þó
vafrinn mun enn

479
00:22:19,880 --> 00:22:22,130
vera fær um að skilja það bara fínt.

480
00:22:22,130 --> 00:22:24,590
Ég er hitting endurræsingu í mínum
vafra, ég smella endurhlaða

481
00:22:24,590 --> 00:22:26,760
og engin breyting er að gerast
vegna þess að vafrinn enn

482
00:22:26,760 --> 00:22:29,550
gera nákvæmlega það sem ég segja það að gera.

483
00:22:29,550 --> 00:22:30,050
>> Allt í lagi.

484
00:22:30,050 --> 00:22:31,340
Svo er þetta allt bara texti.

485
00:22:31,340 --> 00:22:33,730
Nú skulum gera eitthvað meira áhugavert.

486
00:22:33,730 --> 00:22:36,660
Ég ætla að fara á undan og
láni sumir af þessum HTML.

487
00:22:36,660 --> 00:22:40,910
Ég ætla að fara á undan og
búa til nýja skrá hér.

488
00:22:40,910 --> 00:22:43,370
Og við munum kalla þetta rick.html.

489
00:22:43,370 --> 00:22:46,190

490
00:22:46,190 --> 00:22:48,916
Við höfum óhóflega
notað eitthvað

491
00:22:48,916 --> 00:22:51,290
kallað Rick rúlla í þetta
flokki á þessu ári, ég veit ekki,

492
00:22:51,290 --> 00:22:53,880
það gerðist bara lífrænt.

493
00:22:53,880 --> 00:22:55,397
>> Og nú er farið úr böndunum.

494
00:22:55,397 --> 00:22:56,730
Þannig að ég ætla bara að fara að fara með það.

495
00:22:56,730 --> 00:22:59,700
Og ef ég fer til Google
Myndir og Rick Astley.

496
00:22:59,700 --> 00:23:02,450

497
00:23:02,450 --> 00:23:06,170
Ef þú veist ekki hvers vegna við gerum
þetta, bara að lesa upp á Wikipedia.

498
00:23:06,170 --> 00:23:11,520
Í hvert skipti sem þú hefur smellt á tengil,
einhver hefur verið að hlæja einhvers staðar.

499
00:23:11,520 --> 00:23:14,860
Og láta mig fara ahead-- það
við förum, við skulum skoða þessa mynd.

500
00:23:14,860 --> 00:23:16,750
>> Svo hér höfum við
mynd í Google Images.

501
00:23:16,750 --> 00:23:19,390
Og við skulum gera ráð fyrir að þetta er
nokkuð alls staðar á internetinu.

502
00:23:19,390 --> 00:23:22,570
Þannig að ég ætla að gera ráð það er í lagi fyrir mig
að í raun setja þetta í vefsíðu mína.

503
00:23:22,570 --> 00:23:24,820
Ég ætla að fara á undan
og afrita slóðina mynd.

504
00:23:24,820 --> 00:23:28,600
Og nú ef ég fer aftur til Cloud
9, við skulum sjá hvað ég get gert hér.

505
00:23:28,600 --> 00:23:30,630
Svo hér er bara vefur blaðsíða.

506
00:23:30,630 --> 00:23:39,020
Þetta er Rick Astley, haha,
Ég ætla að nú fara aftur

507
00:23:39,020 --> 00:23:43,510
að vafrinn minn, endurhlaða, og áhugavert.

508
00:23:43,510 --> 00:23:44,530
>> Hvar er Rick?

509
00:23:44,530 --> 00:23:46,050
Svo láta mig sjá hvað gerðist.

510
00:23:46,050 --> 00:23:49,114
Reyndar ætla ég að
láta eins og ég hafi ekki gert það.

511
00:23:49,114 --> 00:23:50,280
[Inaudible] settu hann hér.

512
00:23:50,280 --> 00:23:52,520
Við munum koma aftur til það í smá stund.

513
00:23:52,520 --> 00:23:54,200
Svo er hér rick.html.

514
00:23:54,200 --> 00:23:56,070
Svo það er ekki Rick Astley.

515
00:23:56,070 --> 00:23:59,680
Svo kemur í ljós að við getum
reyndar bæta við hann hér.

516
00:23:59,680 --> 00:24:00,830
Þetta er Rick Astley.

517
00:24:00,830 --> 00:24:06,680
Ég ætla að segja gefa mér mynd sem lét
Heimild er slóðin sem ég afrita bara, sem

518
00:24:06,680 --> 00:24:09,110
greinilega er hamingjusamur
afmæli eitthvað.

519
00:24:09,110 --> 00:24:13,280
>> Og nú ætla ég að
loka tag svona.

520
00:24:13,280 --> 00:24:15,170
Þannig að þetta er umbúðir frábær lengi.

521
00:24:15,170 --> 00:24:17,740
En eftir því að allt sem ég hef
gert er opinn krappi mynd,

522
00:24:17,740 --> 00:24:20,270
Heimild með eigindi þetta.

523
00:24:20,270 --> 00:24:21,530
Og það er mjög langur URL.

524
00:24:21,530 --> 00:24:23,720
Og á mjög lok, taka þetta.

525
00:24:23,720 --> 00:24:29,530
Hvers vegna hef ég gert rista horn krappi
í stað þess að, eins og öll önnur merki,

526
00:24:29,530 --> 00:24:33,590
með opinn krappi,
IMG, lokað krappi?

527
00:24:33,590 --> 00:24:37,040
Bara taka giska jafnvel ef þú
hafa enga þekkingu af neinu tagi

528
00:24:37,040 --> 00:24:40,410
með HTML áður.

529
00:24:40,410 --> 00:24:42,710
>> Svo það er hvernig það lokar
stjórn, en hvers vegna

530
00:24:42,710 --> 00:24:45,850
er það ekki raunverulega gera innsæi
vit til að gera eitthvað aðeins meira

531
00:24:45,850 --> 00:24:48,820
fjölorður eins nánu mynd?

532
00:24:48,820 --> 00:24:51,400
Já.

533
00:24:51,400 --> 00:24:52,000
Já.

534
00:24:52,000 --> 00:24:55,620
Bara merkingu, það er ekkert vit í
byrja mynd og endar mynd,

535
00:24:55,620 --> 00:24:56,870
það er annað hvort það eða það er ekki.

536
00:24:56,870 --> 00:25:00,960
Svo það er ekki skynsamleg að fara bil
fyrir neitt annað inni á myndinni.

537
00:25:00,960 --> 00:25:02,010
Þú bara getur ekki gert það.

538
00:25:02,010 --> 00:25:03,720
Og svo setningafræði
myndi almennt vera bara

539
00:25:03,720 --> 00:25:07,910
að gera skástrik inni
á opnum tag eða byrjun tag

540
00:25:07,910 --> 00:25:09,020
og þá högg Vista.

541
00:25:09,020 --> 00:25:13,350
>> Svo ef ég endurhlaða nú þessa skrá, nú
Ég hef fengið góða vefur síðu elda hér.

542
00:25:13,350 --> 00:25:15,100
Og við gátum vissulega
raunverulega ónáða fólk

543
00:25:15,100 --> 00:25:17,010
með embedding stað
eins og YouTube tengil.

544
00:25:17,010 --> 00:25:19,350
Og í raun, hvenær
þú hefur einhvern tíma farið á YouTube,

545
00:25:19,350 --> 00:25:22,190
og láta mig í raun tilviljun
Rick rúlla mig hér.

546
00:25:22,190 --> 00:25:25,770
Svo Rick rúlla.

547
00:25:25,770 --> 00:25:29,592
Svo Rick roll-- ég ætla að fara hér.

548
00:25:29,592 --> 00:25:31,900
>> [TÓNLIST spila]

549
00:25:31,900 --> 00:25:33,730
>> OK, einn maður líkaði það.

550
00:25:33,730 --> 00:25:37,270
Svo eftir allan þennan tíma, ef þú
smelltu á Deila hlekk þú auðvitað

551
00:25:37,270 --> 00:25:41,390
fá slóðina sem þú getur í raun
embed í tölvupósti eða réttar mynd

552
00:25:41,390 --> 00:25:43,730
eða í Heimadæmi eða í slide.

553
00:25:43,730 --> 00:25:49,055
Og nú, ef ég smelli í stað á embed,
eftir að allan þennan tíma, þetta dót

554
00:25:49,055 --> 00:25:49,680
hefur verið þar.

555
00:25:49,680 --> 00:25:50,910
Ég ætla að fara á undan og afrita þetta.

556
00:25:50,910 --> 00:25:54,000
>> Og bara svo við getum séð það betur, ég er
fara að líma það inn í textaritlinum minn.

557
00:25:54,000 --> 00:25:55,860
Takið eftir að þetta það
YouTube hefur verið að segja þér.

558
00:25:55,860 --> 00:25:57,693
Í hvert skipti sem þú heimsækir
YouTube vídeó, ef þú

559
00:25:57,693 --> 00:26:00,410
vilt að embed vídeó á þinn
Vefsíðan, einfaldlega grípa þetta.

560
00:26:00,410 --> 00:26:03,350
Svo er þetta enn eitt
HTML tag kallast iframe.

561
00:26:03,350 --> 00:26:04,590
Or an línu ramma.

562
00:26:04,590 --> 00:26:08,680
Svo það lítur líka svolítið meira
flókið en allir aðrir.

563
00:26:08,680 --> 00:26:11,950
Svo kemur í ljós að á myndinni
tag og greinilega iframe tag

564
00:26:11,950 --> 00:26:13,370
taka það sem kallast eiginleika.

565
00:26:13,370 --> 00:26:15,710
>> Og þetta er annar
stykki af setningafræði í HTML.

566
00:26:15,710 --> 00:26:19,240
Í viðbót við merkið er
nafn, opið krappi tag nafn,

567
00:26:19,240 --> 00:26:23,780
þú getur stjórnað hegðun tag
með því að hafa a heild búnt af eigindi

568
00:26:23,780 --> 00:26:24,860
jafngildir gildi.

569
00:26:24,860 --> 00:26:26,290
Eiginleiki jafngildir gildi.

570
00:26:26,290 --> 00:26:28,100
Og svo til dæmis,
YouTube er að segja okkur

571
00:26:28,100 --> 00:26:31,990
ef þú vilt breidd þetta myndband
að vera 420 pixlar og hæð

572
00:26:31,990 --> 00:26:35,470
að vera 315 pixlar, sem er
hvernig þú tjá það í HTML.

573
00:26:35,470 --> 00:26:38,480
>> The uppspretta af the vídeó er að fara
að vera það lengi YouTube URL

574
00:26:38,480 --> 00:26:40,830
og þá sumir önnur efni
eins strikinu er núll,

575
00:26:40,830 --> 00:26:43,500
þannig að líklega þýðir að það er
engin landamæri kringum málið.

576
00:26:43,500 --> 00:26:45,450
Leyfa fullur skjár líklega
þýðir að notandi

577
00:26:45,450 --> 00:26:47,840
smelltu á hnappinn og
reyndar fullur skjár vídeó.

578
00:26:47,840 --> 00:26:52,870
Svo ef ég vil virkilega að vera
áhrifamikill hér í Rick punktur HTML,

579
00:26:52,870 --> 00:26:58,490
frekar en að nota mynd tag, láta
mér eyða að í stað líma þetta.

580
00:26:58,490 --> 00:27:00,810
Og nú endurhlaða.

581
00:27:00,810 --> 00:27:02,500
Og nú hér við fara aftur.

582
00:27:02,500 --> 00:27:04,979

583
00:27:04,979 --> 00:27:06,020
Allt í lagi, það er nóg.

584
00:27:06,020 --> 00:27:08,970
Allt í lagi svo ég mun reyna
erfitt að gera það aftur.

585
00:27:08,970 --> 00:27:11,400
Svo hvaða ert sumir af the Takeaways hér?

586
00:27:11,400 --> 00:27:15,130
Svo HTML, eins ljótur og þessir vefsíðum
eru, er í raun mjög einfalt.

587
00:27:15,130 --> 00:27:16,467
Það er ekki forritunarmál.

588
00:27:16,467 --> 00:27:17,550
Það þarf ekki virka.

589
00:27:17,550 --> 00:27:18,410
Það þarf ekki lykkjur.

590
00:27:18,410 --> 00:27:19,535
Það þarf ekki skilyrði.

591
00:27:19,535 --> 00:27:22,900
Allt það hefur er heilmikið af
ólík merki, sem hver um sig

592
00:27:22,900 --> 00:27:24,620
hefur núll eða fleiri eiginleika.

593
00:27:24,620 --> 00:27:27,320
Og í raun, hvað er gaman við að
HTML og þú byrjar að kafa í

594
00:27:27,320 --> 00:27:29,560
er að það er mjög sjálf teachable.

595
00:27:29,560 --> 00:27:32,880
>> Allt það tekur er skilningur
um almenna ramma HTML.

596
00:27:32,880 --> 00:27:36,510
Hvað er tag, hvað er eiginleiki,
hvernig þú stillir raun vefsíðu

597
00:27:36,510 --> 00:27:37,250
eins og hér segir.

598
00:27:37,250 --> 00:27:40,720
Og allt annað er í raun afleiðing
að horfa upp á netinu tilvísun

599
00:27:40,720 --> 00:27:43,080
eða googling hvernig á að gera sumir
tækni eða eins og við höfum séð,

600
00:27:43,080 --> 00:27:45,371
horfa á upptök Facebook
númer, horfa á vefsíðu

601
00:27:45,371 --> 00:27:48,710
sem þú vilt í það er uppspretta merkjamál og
skilja hvernig verktaki þar

602
00:27:48,710 --> 00:27:50,550
reyndar lagðar það út.

603
00:27:50,550 --> 00:27:52,180
>> Þannig að við getum gert myndir eins og heilbrigður.

604
00:27:52,180 --> 00:27:53,994
Og í raun, við gerðum það í smá stund síðan.

605
00:27:53,994 --> 00:27:55,410
Leyfðu mér að fara á undan og bara sýna þér.

606
00:27:55,410 --> 00:27:56,770
Hér er nokkur dæmi um kóða.

607
00:27:56,770 --> 00:27:58,380
Ef þú vilt alltaf að sjá geðillur köttur.

608
00:27:58,380 --> 00:28:00,620
Svo eftir að ég get
hafa mynd tag hér.

609
00:28:00,620 --> 00:28:02,090
Og ég hef fengið athugasemd ofan það.

610
00:28:02,090 --> 00:28:04,490
Ég hef fengið val
texti fyrir aðgengi.

611
00:28:04,490 --> 00:28:07,250
Svo einhver sem er með skjá
lesandi af ástæðum augum

612
00:28:07,250 --> 00:28:10,172
geta í raun þá hafa þeirra
skjár lesandi segja geðillur köttur.

613
00:28:10,172 --> 00:28:11,880
Vegna þess að ef þeir geta ekki
sjá myndina, þeir

614
00:28:11,880 --> 00:28:14,504
geta að minnsta kosti hafa tölvuna sína
segja þeim munnlega hvað það er.

615
00:28:14,504 --> 00:28:18,020
Og uppspretta þessi skrá er cat.jpeg.

616
00:28:18,020 --> 00:28:22,472
Svo í raun, ef ég vildi virkilega að
fá snjall, það sem ég gæti hafa done--

617
00:28:22,472 --> 00:28:25,680
Ég lofa ekki að fara að Rick Astley, svo
Ég ætla að google fyrir kött í staðinn.

618
00:28:25,680 --> 00:28:28,290
Og ef ég fer á Google Myndir
hér, og við munum gera ráð

619
00:28:28,290 --> 00:28:30,040
að þetta er mynd af kettinum mínum.

620
00:28:30,040 --> 00:28:35,070
>> Segjum að ég hef stjórn smellti
eða hægri smellt á þetta, tilviljun

621
00:28:35,070 --> 00:28:35,630
hrollvekjandi.

622
00:28:35,630 --> 00:28:40,320
Og cat.jpeg ég ætla
að vista á skjáborðið.

623
00:28:40,320 --> 00:28:44,700
Leyfðu mér nú að fara aftur til ský 9.

624
00:28:44,700 --> 00:28:48,150
Takið eftir að hér, ég get
fara að hlaða staðbundnar skrár.

625
00:28:48,150 --> 00:28:51,530
Og ef ég grípa þetta
skrá, cat.jpeg tilkynning

626
00:28:51,530 --> 00:28:54,674
að ég get draga það og
falla það í ský 9

627
00:28:54,674 --> 00:28:56,090
og það er að fara að æpa á mig hér.

628
00:28:56,090 --> 00:28:59,000
>> Þar sem við höfum nú þegar
gefið þér cat.jpeg skrá,

629
00:28:59,000 --> 00:29:01,430
en það er frábær auðvelt að
grípa mynd sem þú hefur

630
00:29:01,430 --> 00:29:03,220
tekið af Facebook
eða Flickr eða þess háttar

631
00:29:03,220 --> 00:29:05,678
og í raun draga og falla því
í ský 9 og þá gera það

632
00:29:05,678 --> 00:29:07,970
hluti af eigin persónulega
website eða vandamál

633
00:29:07,970 --> 00:29:10,442
setja sjö eða átta eins og við munum fljótlega sjá.

634
00:29:10,442 --> 00:29:12,150
Og svo þegar þú
loksins heimsækja þessi köttur,

635
00:29:12,150 --> 00:29:16,610
miðað Ég niður að sama kött,
tilkynning that-- sem var yndisleg.

636
00:29:16,610 --> 00:29:19,160
>> Það sem þú vilt sjá er
eitthvað eins og þetta andlit hér.

637
00:29:19,160 --> 00:29:21,810
Þannig að skrár sem þú
tilvísun í vefsíðu

638
00:29:21,810 --> 00:29:26,050
getur annað hvort að vera staðbundin á eigin spýtur
reikning eða fjarlægur á einhverjum öðrum miðlara

639
00:29:26,050 --> 00:29:29,670
eins og í tilviki Rick
Astley mynd svolítið síðan.

640
00:29:29,670 --> 00:29:32,990
Svo hvar else-- hvað
annars getum við gert hér?

641
00:29:32,990 --> 00:29:34,890
Svo skulum taka a líta á the hópur stuðningsmanna.

642
00:29:34,890 --> 00:29:36,160
Þú veist hvað er góður af kaldur?

643
00:29:36,160 --> 00:29:39,330
>> Við höfum hingað til verið að gera
mjög truflanir vefsíðum.

644
00:29:39,330 --> 00:29:41,830
Ég vil til að hressa hlutina upp eins og hér segir.

645
00:29:41,830 --> 00:29:44,344
Ég vil gera eigin leitarvél mína vél.

646
00:29:44,344 --> 00:29:47,010
Svo til að gera a leita vél, við skulum
fara á undan og byrja að gera þetta.

647
00:29:47,010 --> 00:29:52,570
Ég ætla að fara á undan og búa til
ný skrá sem heitir search.html.

648
00:29:52,570 --> 00:29:54,890
Og við höfum prefabed útgáfur netinu.

649
00:29:54,890 --> 00:29:56,027
Úpps.

650
00:29:56,027 --> 00:29:57,610
Ekki líma ekki í flugstöðinni gluggann.

651
00:29:57,610 --> 00:29:58,744
Húshlutar útgáfur netinu.

652
00:29:58,744 --> 00:30:00,160
Og ég ætla að byrja eins og hér segir.

653
00:30:00,160 --> 00:30:04,490
Svo er hér upphafið
skrá sem heitir search.html.

654
00:30:04,490 --> 00:30:07,510
Ég ætla að spara það í
Heimild skrá dag.

655
00:30:07,510 --> 00:30:09,079
Ég ætla að hringja þessari leit.

656
00:30:09,079 --> 00:30:10,370
Reyndar munum við gera það betra.

657
00:30:10,370 --> 00:30:13,600
CS50 Leita og í raun tegund það.

658
00:30:13,600 --> 00:30:17,500
Og nú ætla ég að fara að segja
eitthvað eins og H1 CS50 Leita.

659
00:30:17,500 --> 00:30:20,930
Og þá niður hér, H2 væntanlegar.

660
00:30:20,930 --> 00:30:23,230
Og bara til að ágrip, H1 og
H2 meina það sig?

661
00:30:23,230 --> 00:30:26,750

662
00:30:26,750 --> 00:30:30,320
>> Já, svo stór og djörf, og
ekki eins stór, en samt djörf.

663
00:30:30,320 --> 00:30:37,375
Þannig að ef ég vista þetta og fara yfir hér,
við skulum sjá the skrá search.html.

664
00:30:37,375 --> 00:30:42,560
Allt í lagi, og þetta
er right-- [inaudible].

665
00:30:42,560 --> 00:30:46,980

666
00:30:46,980 --> 00:30:49,110
Standa við.

667
00:30:49,110 --> 00:30:49,945
David er ruglaður.

668
00:30:49,945 --> 00:30:52,610

669
00:30:52,610 --> 00:30:54,080
Ó, það er rétt þar.

670
00:30:54,080 --> 00:30:54,860
David er hálfviti.

671
00:30:54,860 --> 00:30:55,420
OK.

672
00:30:55,420 --> 00:30:56,660
Þannig að það er það.

673
00:30:56,660 --> 00:30:58,350
Svo CS50 leit væntanlegar.

674
00:30:58,350 --> 00:31:00,370
Svo nú skulum við mynda
það sem við gerðum í síðustu viku.

675
00:31:00,370 --> 00:31:03,400
>> Þar sem við ræddum um
neðri hæð aflfræði HTTP.

676
00:31:03,400 --> 00:31:05,780
Og þessar nýju hugmyndir
af HTML, sem er bara

677
00:31:05,780 --> 00:31:08,890
þetta Markup Language þar þig
segja að vafra nákvæmlega hvað á að gera

678
00:31:08,890 --> 00:31:10,740
og innleiða eigin leit okkar vél.

679
00:31:10,740 --> 00:31:12,520
Svo í stað þess bara
sagði væntanlegar, ég er

680
00:31:12,520 --> 00:31:14,810
fara að kynna
eitthvað sem kallast formi tag.

681
00:31:14,810 --> 00:31:19,610
Og í þessu formi, ég ætla að
hafa eitthvað eins og inntak sviði.

682
00:31:19,610 --> 00:31:22,450
>> Og nafn þessa inntak
reit, ég ætla að kalla það Q.

683
00:31:22,450 --> 00:31:26,240
Og tegund þessu innsláttarsvæði
Ég ætla að segja er bara "texti".

684
00:31:26,240 --> 00:31:29,130
Og texti sviði, eins og við munum
sjá, er bara texti kassi.

685
00:31:29,130 --> 00:31:32,830
Og svo það er ekki vit hér til að hafa
eitthvað inni af því á þessum tímapunkti.

686
00:31:32,830 --> 00:31:35,320
Og svo ég er einfaldlega að fara
að loka tag með að

687
00:31:35,320 --> 00:31:38,099
skástrik rétt í merkinu sjálfu.

688
00:31:38,099 --> 00:31:39,890
Og þá er ég að fara að
hafa eitt annað inntak.

689
00:31:39,890 --> 00:31:43,480
Input type jafngildir leggja.

690
00:31:43,480 --> 00:31:45,320
Og þá er ég að fara að
loka þessa líka.

691
00:31:45,320 --> 00:31:46,840
>> Og nú ætla ég að fara aftur hingað.

692
00:31:46,840 --> 00:31:49,520
Og þegar við sjáum,
að vísu ansi ljót, ég hef

693
00:31:49,520 --> 00:31:52,460
fékk upphaf
eigin leit síðuna mína hér.

694
00:31:52,460 --> 00:31:55,150
Í raun, láta mig reyna að
hreinsa þetta upp smá.

695
00:31:55,150 --> 00:31:57,330
Það kemur í ljós að á
inntak hér, get ég hafa

696
00:31:57,330 --> 00:31:59,910
annar eiginleiki heitir tákn.

697
00:31:59,910 --> 00:32:05,165
Og ég gæti séð eitthvað eins leitarorð,
eða nánar tiltekið, fyrirspurn fyrir q.

698
00:32:05,165 --> 00:32:07,820
>> Og eftir, nú, ég hef
svona gráum texta

699
00:32:07,820 --> 00:32:10,440
sem hverfur eins og
leið og ég byrja að skrifa,

700
00:32:10,440 --> 00:32:12,930
en það er líklega eitthvað
þú hefur séð í öðrum vefsíðum.

701
00:32:12,930 --> 00:32:14,650
Ég í raun ekki eins og á Senda hnappinn.

702
00:32:14,650 --> 00:32:18,320
Þannig að ég er reyndar að fara að gefa
Senda hnappinn gildið leit.

703
00:32:18,320 --> 00:32:21,680
Og nú, ef ég endurhlaða, eftir því
hnappinn minn verður heitir leit.

704
00:32:21,680 --> 00:32:24,140
Þú veist, ég í raun ekki
eins merkinu hér.

705
00:32:24,140 --> 00:32:27,140
Svo Google Font rafall.

706
00:32:27,140 --> 00:32:28,820
>> Ég vil til að hressa þetta upp frekar.

707
00:32:28,820 --> 00:32:30,660
Svo CS50 leit.

708
00:32:30,660 --> 00:32:31,870
Leyfðu mér að búa til eigin lógóið mitt.

709
00:32:31,870 --> 00:32:33,080
Þetta er flottur.

710
00:32:33,080 --> 00:32:36,945
Svo nú langar mig að vista þetta as-- koma á.

711
00:32:36,945 --> 00:32:40,710

712
00:32:40,710 --> 00:32:43,120
Hvar er það að fara?

713
00:32:43,120 --> 00:32:43,620
There.

714
00:32:43,620 --> 00:32:44,160
OK.

715
00:32:44,160 --> 00:32:44,980
Missti það.

716
00:32:44,980 --> 00:32:47,740
Vista sem.

717
00:32:47,740 --> 00:32:49,470
Heimskur vafra.

718
00:32:49,470 --> 00:32:51,700
Standa eftir, við erum að fara að
laga þetta í eitt skipti fyrir öll.

719
00:32:51,700 --> 00:32:57,650

720
00:32:57,650 --> 00:32:58,590
Það sem við förum.

721
00:32:58,590 --> 00:32:59,090
Allt í lagi.

722
00:32:59,090 --> 00:32:59,600
Sorry.

723
00:32:59,600 --> 00:33:00,750
Frídagur.

724
00:33:00,750 --> 00:33:02,310
Nú er þetta angurvær.

725
00:33:02,310 --> 00:33:03,160
Hætta fullur skjár.

726
00:33:03,160 --> 00:33:04,150
Allt í lagi.

727
00:33:04,150 --> 00:33:06,870
>> Nú, eins og eðlilegt
manneskja, vista myndina sem.

728
00:33:06,870 --> 00:33:08,810
Logo.gif.

729
00:33:08,810 --> 00:33:13,194
Nú ætla ég að fara í CS50IDE og
Ég ætla að einfaldlega grípa merkið,

730
00:33:13,194 --> 00:33:15,360
Ég ætla að draga það inn í
minn uppspretta sjö skrá,

731
00:33:15,360 --> 00:33:17,002
skrá er þegar til, ég er í lagi með það.

732
00:33:17,002 --> 00:33:19,210
Þannig að ég ætla að hunsa það
vegna þess að ég hafði þegar það.

733
00:33:19,210 --> 00:33:20,630
Og nú hvernig ég losna við þetta?

734
00:33:20,630 --> 00:33:24,670
>> Við skulum fara á undan hér og gera
Image Source jafngildir logo.gif.

735
00:33:24,670 --> 00:33:25,490
Loka þessu.

736
00:33:25,490 --> 00:33:26,050
Vista.

737
00:33:26,050 --> 00:33:30,560
Og nú ef ég fer aftur til leit minni
síðu, nú er að leita nokkuð gott.

738
00:33:30,560 --> 00:33:33,610
Allt í lagi, svo það er ekki
alveg gert neitt gagnlegt.

739
00:33:33,610 --> 00:33:37,000
Í raun, láta mig reyna að leita
fyrir kött og sjá hvað gerist.

740
00:33:37,000 --> 00:33:38,890
Kettir.

741
00:33:38,890 --> 00:33:39,420
Fari það.

742
00:33:39,420 --> 00:33:41,400
Það er ekki bara vinna, greinilega.

743
00:33:41,400 --> 00:33:43,760
Svo er það lykillinn stykki
sem vantar hér?

744
00:33:43,760 --> 00:33:49,100
>> Rétt, jafnvel ef þú veist ekki hvaða HTML,
Ég hef byrjað að merkja upp símann mynd

745
00:33:49,100 --> 00:33:54,130
og ég hef sagt það hvernig á að fá inntak,
gefa mér textabox og senda hnappinn,

746
00:33:54,130 --> 00:33:55,730
hvaða stykki er greinilega vantar?

747
00:33:55,730 --> 00:33:58,975
Segjum að við viljum raunverulega fá
Þessi hlutur virki rétt.

748
00:33:58,975 --> 00:34:02,420

749
00:34:02,420 --> 00:34:05,360
Hvað þurfum við að gera?

750
00:34:05,360 --> 00:34:08,860
Við höfum þörf fyrir að innleiða aftur enda
Gagnagrunnurinn eða leitarvél sjálft,

751
00:34:08,860 --> 00:34:11,210
og það er að fara að taka a
heild einhver fjöldi af tími, hreinskilnislega.

752
00:34:11,210 --> 00:34:13,380
>> Svo man hvað við gerðum síðast.

753
00:34:13,380 --> 00:34:18,230
Svo ef þú leitar að einhverju á Google
og þú hefur fyrirfram slökkt,

754
00:34:18,230 --> 00:34:20,355
muna, augnablik leit.

755
00:34:20,355 --> 00:34:22,230
Svo láta mig snúa það burt
þannig að þetta í raun

756
00:34:22,230 --> 00:34:26,650
hegðar sér eins og eldri skóla vafra,
ef ég leita nú fyrir eitthvað eins ketti,

757
00:34:26,650 --> 00:34:28,190
muna hvað URL lítur út.

758
00:34:28,190 --> 00:34:29,449
Það er nokkuð dulinn.

759
00:34:29,449 --> 00:34:33,000
En embed in það,
muna, er skástrik leit.

760
00:34:33,000 --> 00:34:35,100
Spurningarmerki q jafngildir ketti.

761
00:34:35,100 --> 00:34:37,760
>> Og það virðist að gefa mér
a heild búnt af leitarniðurstöðum.

762
00:34:37,760 --> 00:34:39,134
Svo þú veist hvað ég er að fara að gera?

763
00:34:39,134 --> 00:34:41,650
Ég ætla að taka lán
Google fyrir aðeins eina mínútu.

764
00:34:41,650 --> 00:34:43,670
Ég ætla að fara yfir
hér og ég ætla að segja

765
00:34:43,670 --> 00:34:47,850
sem myndar aðgerð eða
áfangastað, svo að segja,

766
00:34:47,850 --> 00:34:49,330
ætti bókstaflega að vera Google.

767
00:34:49,330 --> 00:34:52,590
Og aðferðin sem ég vildi
að nota er að fara að vera að fá.

768
00:34:52,590 --> 00:34:53,560
>> Svo er það aðgerð?

769
00:34:53,560 --> 00:34:55,760
Aðgerð er furðulegur heitir,
en það bara þýðir

770
00:34:55,760 --> 00:34:58,120
sem er að fara að takast á
aðgerð af þessu formi?

771
00:34:58,120 --> 00:35:00,820
Þegar ég smelltu á Leita, þar
ætti niðurstaðan að fara?

772
00:35:00,820 --> 00:35:05,300
Og ef ég fer nú aftur í formi minni
hér og endurhlaða vefsíðu mína

773
00:35:05,300 --> 00:35:09,000
og nú leita að einhverju
eins hundur, eftir nú

774
00:35:09,000 --> 00:35:10,850
Ég hef aftur innleitt Google.

775
00:35:10,850 --> 00:35:11,350
Ekki satt?

776
00:35:11,350 --> 00:35:14,141
>> Ef ég vil að leita að einhverju
annars, það virkar fyrir ekki bara hunda,

777
00:35:14,141 --> 00:35:16,400
það virkar líka fyrir ketti.

778
00:35:16,400 --> 00:35:21,930
Það virkar einnig fyrir CS50.

779
00:35:21,930 --> 00:35:24,310
Og OK, þetta er bara
undir whelming, er það ekki?

780
00:35:24,310 --> 00:35:25,920
Allt í lagi, en það virkar í raun.

781
00:35:25,920 --> 00:35:27,360
Svo hvað er í raun verið að fara á?

782
00:35:27,360 --> 00:35:31,340
Þannig að ég hef kennt vafrann minn, með
HTML, að taka inntak frá notanda

783
00:35:31,340 --> 00:35:35,810
og í raun senda þessi inntak
til a fjarlægur framreiðslumaður using HTTP.

784
00:35:35,810 --> 00:35:39,120
>> Og vegna þess að vafrinn minn
skilur HTTP, reyndar það

785
00:35:39,120 --> 00:35:43,500
smíða slóðina svo að það
Ég enda á í vafranum mínum,

786
00:35:43,500 --> 00:35:45,660
eftir hvað gerist
þegar ég leitaði fyrir hundinn.

787
00:35:45,660 --> 00:35:49,270
Ef ég smelli Leita, eftir því
slóðin breytist eins og ég ætlaði

788
00:35:49,270 --> 00:35:52,770
að google.com/search~~V fyrirspurn jafngildir hund.

789
00:35:52,770 --> 00:35:56,020
Og það er vegna þess formi
veit, vegna þess að aðferðin er að fá,

790
00:35:56,020 --> 00:35:59,560
að einfaldlega bæta það til þessa vefslóð þar.

791
00:35:59,560 --> 00:36:01,730
>> Nú eru þessar vefsíður enn ljót.

792
00:36:01,730 --> 00:36:04,890
Svo skulum kynna eitt annað
stykki af setningafræði ef við getum í dag.

793
00:36:04,890 --> 00:36:07,640
Og þetta er eitthvað þekkt
eins stílblöð.

794
00:36:07,640 --> 00:36:10,720
Svo láta mig taka a líta á
þetta dæmi hér og sjá

795
00:36:10,720 --> 00:36:12,380
ef við getum ætlað hvað er að gerast.

796
00:36:12,380 --> 00:36:14,520
Þetta er CSS0.html.

797
00:36:14,520 --> 00:36:16,532
Og þetta er þar sem hlutirnir
fá smá ljót.

798
00:36:16,532 --> 00:36:18,490
Vegna miður,
í heimi vefnum,

799
00:36:18,490 --> 00:36:20,920
HTML einn getur ekki gert allt.

800
00:36:20,920 --> 00:36:22,920
Og svo ef þú vilt
stylize vefsíðu þinni,

801
00:36:22,920 --> 00:36:28,370
þú þarft í raun að einbeita sér að
fagurfræði á annan hátt.

802
00:36:28,370 --> 00:36:33,090
Svo hér, ég hef líkama minn vefur
síðu inni sem er stór div.

803
00:36:33,090 --> 00:36:34,700
Og div þýðir bara deild.

804
00:36:34,700 --> 00:36:38,060
Svo það er eins og lið en það
hefur ekki sömu merkingu

805
00:36:38,060 --> 00:36:39,180
af málsgrein textans.

806
00:36:39,180 --> 00:36:40,940
>> Þetta þýðir bara að við
vafra, hér kemur

807
00:36:40,940 --> 00:36:45,210
stór rétthyrnd svæði vefnum mínum
síðu, ég vil að höndla það sérstaklega.

808
00:36:45,210 --> 00:36:47,420
Nú, lína 21 er þar sem div byrjar.

809
00:36:47,420 --> 00:36:48,770
Og bara taka giska.

810
00:36:48,770 --> 00:36:53,080
Hvað er áhrif línu 21 á
restin af innihaldi síðunnar?

811
00:36:53,080 --> 00:36:55,640

812
00:36:55,640 --> 00:36:56,311
Centering það.

813
00:36:56,311 --> 00:36:56,810
Það er allt og sumt.

814
00:36:56,810 --> 00:36:58,830
Þannig að við höfum ekki séð leið
reyndar centering texta.

815
00:36:58,830 --> 00:37:00,996
>> Í raun, search engine minn,
ólíkt raunverulegum Google,

816
00:37:00,996 --> 00:37:03,040
var allt réttlætanlegt yfir til vinstri.

817
00:37:03,040 --> 00:37:07,430
Og svo nú í línu 21, ég er að segja, hey
vafra, búa til deild á síðunni.

818
00:37:07,430 --> 00:37:09,450
Bara gefa mér stóran, ósýnilega rétthyrningur.

819
00:37:09,450 --> 00:37:11,490
Það er hvernig ég vil
hugsa um vefsíðu.

820
00:37:11,490 --> 00:37:13,870
Og þá stylize það sem hér segir.

821
00:37:13,870 --> 00:37:16,900
Inni þessara vitna,
nú, er annað tungumál

822
00:37:16,900 --> 00:37:19,969
sem við kynnt í dag
kallast Cascading Style Sheets.

823
00:37:19,969 --> 00:37:22,010
Sem betur fer, það er líka ekki
forritunarmál,

824
00:37:22,010 --> 00:37:26,470
svo það er mjög takmarkað í setningafræði þess en
einnig mjög takmarkað í virkni þess

825
00:37:26,470 --> 00:37:30,670
en HTML er allur óður í
merking upp gögn af vefsíðu

826
00:37:30,670 --> 00:37:32,130
og uppbyggingu vefsíðu.

827
00:37:32,130 --> 00:37:35,320
CSS er almennt um
Lokaspretturinn, fagurfræði,

828
00:37:35,320 --> 00:37:40,160
fá stærð og lit og þess
Staðsetning nákvæmlega rétt í a vefur blaðsíða.

829
00:37:40,160 --> 00:37:43,000
Og reyndar er það myndast
með helstu gildi pör.

830
00:37:43,000 --> 00:37:46,290
>> A eign svona, texta
samræma, eftir tvípunkti,

831
00:37:46,290 --> 00:37:49,720
fylgt eftir með virði sem
eign, sem í þessu tilfelli er sent.

832
00:37:49,720 --> 00:37:51,910
Og nú eftir þér
geta byggt hreiður þetta.

833
00:37:51,910 --> 00:37:56,780
Ef ég vildi allt í að
Ég hef bent á að vera fyrir miðju,

834
00:37:56,780 --> 00:38:00,270
það er hvers vegna ég hef línu 21 og
samsvarandi lína 31.

835
00:38:00,270 --> 00:38:04,820
En býst nú vil segja John
Harvard, velkomin á heimasíðuna mína.

836
00:38:04,820 --> 00:38:06,530
>> Copyright tákn John Harvard.

837
00:38:06,530 --> 00:38:09,180
Og ætla ég vil fyrsta
þær línur að vera nokkuð stór.

838
00:38:09,180 --> 00:38:10,450
36 pixlar.

839
00:38:10,450 --> 00:38:11,530
Svo er það ágætis stærð.

840
00:38:11,530 --> 00:38:13,240
Og ég vildi þyngd sína að vera djörf.

841
00:38:13,240 --> 00:38:15,450
En þá neðan að,
Ég vil minni texta.

842
00:38:15,450 --> 00:38:19,980
Og neðan að, ég vil
jafnvel minni texta.

843
00:38:19,980 --> 00:38:20,480
Sorry.

844
00:38:20,480 --> 00:38:24,490

845
00:38:24,490 --> 00:38:26,940
Í dag er eins og á daginn.

846
00:38:26,940 --> 00:38:29,840
>> Svo nú, hvað er ég að gera til að tjá þetta?

847
00:38:29,840 --> 00:38:34,580
Hér á línu 22 er embed in
div eða hreiður div, ef þú vilt.

848
00:38:34,580 --> 00:38:36,190
Það hefur líka eigin stíl tag sína.

849
00:38:36,190 --> 00:38:38,160
Ég tilgreina leturstærð 36.

850
00:38:38,160 --> 00:38:40,460
Ég tilgreina leturgerð þyngd feitletraðar.

851
00:38:40,460 --> 00:38:43,360
Niður hér, tilgreina ég bara 24 punktar.

852
00:38:43,360 --> 00:38:45,960
Og að lokum, í samræmi 28, ég tilgreina 12.

853
00:38:45,960 --> 00:38:49,070
Svo bara eins og a fljótur andleg heilbrigði stöðva
og við manneskju að lesa þetta,

854
00:38:49,070 --> 00:38:52,545
hvaða orð á skjánum eru
í raun að fara að vera djörf?

855
00:38:52,545 --> 00:38:56,100

856
00:38:56,100 --> 00:38:58,760
Hvaða línur eru í raun djörf?

857
00:38:58,760 --> 00:38:59,570
>> Bara John Harvard.

858
00:38:59,570 --> 00:39:00,070
Ekki satt?

859
00:39:00,070 --> 00:39:05,940
Því bara eins og línan 22 segir hey
vafra, hér er deild síðunni.

860
00:39:05,940 --> 00:39:07,920
Gerðu það leturstærð 36 lið.

861
00:39:07,920 --> 00:39:09,460
Gera letrið þyngd feitletraðar.

862
00:39:09,460 --> 00:39:11,920
Um leið og þú nærð
Samsvarandi endir tag

863
00:39:11,920 --> 00:39:15,340
eða lokað tag á línu 24,
það þýðir, hey vafra,

864
00:39:15,340 --> 00:39:17,640
hætta að gera hvað sem það er sem þú ert að gera.

865
00:39:17,640 --> 00:39:21,020
Og takið eftir að vera skýr, jafnvel þótt
lína 22 er öllum þessum eiginleikum

866
00:39:21,020 --> 00:39:24,430
eins stíl, þegar þér
loka tag í línu 24,

867
00:39:24,430 --> 00:39:25,940
þú nefnir aðeins nafn tag er.

868
00:39:25,940 --> 00:39:29,990
>> Þú endurtaka ekki orðið stíl eða
eitthvað sem er inni í þessum tilvitnunum.

869
00:39:29,990 --> 00:39:32,860
Og svo ef ég horfi á þetta núna
í vafranum mínum, við skulum taka

870
00:39:32,860 --> 00:39:38,060
a líta á the endir afleiðing. Slepptu mér
undan þessari skrá, sem er CSS 0.

871
00:39:38,060 --> 00:39:41,814
Og það er enn nokkuð látlaus,
en að fá ansi áhugavert.

872
00:39:41,814 --> 00:39:43,980
En það kemur í ljós að það er
aðrir hlutir sem ég get gert hér,

873
00:39:43,980 --> 00:39:46,490
og í hættu á að gera
þetta alveg hideous,

874
00:39:46,490 --> 00:39:48,630
eftir hér að mínu
Lík vefsíðu mína,

875
00:39:48,630 --> 00:39:53,930
Ég get gert eitthvað fyndið
eins bg eða bakgrunnslit.

876
00:39:53,930 --> 00:39:56,670
>> Og fljótur, það er uppáhalds liturinn þinn?

877
00:39:56,670 --> 00:39:57,720
Grænn Ég heyrði.

878
00:39:57,720 --> 00:39:58,750
Allt í lagi.

879
00:39:58,750 --> 00:40:02,920
Svo nú, ef ég högg endurhlaða núna,
Gróðurhús vefsíðu.

880
00:40:02,920 --> 00:40:04,710
Allt í lagi, svo það er ekki slæmt.

881
00:40:04,710 --> 00:40:08,350
Og nú, ef ég vil gera þetta virkilega
flott, ég get gert lit á texta mínum

882
00:40:08,350 --> 00:40:09,360
jafnvel rautt.

883
00:40:09,360 --> 00:40:10,870
Svo skulum sjá hvað þetta lítur út.

884
00:40:10,870 --> 00:40:12,230
Nú það er að leita nokkuð gott.

885
00:40:12,230 --> 00:40:15,460
Og hérna, ef þú virkilega
langar að skipta við einhvern

886
00:40:15,460 --> 00:40:17,487
eða ef þú vilt vera
einn af þeim sem

887
00:40:17,487 --> 00:40:20,570
reynir að plata þig í að heimsækja vefinn
síðu vegna þess að þeir hafa brögð Google

888
00:40:20,570 --> 00:40:27,610
í hugsun það er allt fullt
af lykilorðin like-- skulum sjá, endurhlaða.

889
00:40:27,610 --> 00:40:29,020

890
00:40:29,020 --> 00:40:30,680
Hvar var það að fara?

891
00:40:30,680 --> 00:40:31,530
Og það það okkur.

892
00:40:31,530 --> 00:40:32,030
Allt í lagi.

893
00:40:32,030 --> 00:40:34,905
Svo ég segi þetta eins og innskot, við munum
tala um þetta efni í nokkrar vikur

894
00:40:34,905 --> 00:40:36,740
þegar við tölum um
öryggi, ef þú í raun

895
00:40:36,740 --> 00:40:38,852
embed heild bunches af
leitarorð í a vefur blaðsíða,

896
00:40:38,852 --> 00:40:41,810
jafnvel ef þeir eru ekki sýnileg a
manna, einhver eins og Google, að sjálfsögðu,

897
00:40:41,810 --> 00:40:43,250
getur samt í raun að finna þetta.

898
00:40:43,250 --> 00:40:45,820
Allt í lagi, svo það er ansi
hideous ansi fljótt.

899
00:40:45,820 --> 00:40:48,420
>> Og í raun, það er ekki allt
að mikið ólíkt mínu eigin vefnum

900
00:40:48,420 --> 00:40:51,480
síðu sem grunnnámi, sem
Ég byrjaði googling kring til að finna

901
00:40:51,480 --> 00:40:53,690
fyrri útgáfur af gömlum vefsíðum mínum.

902
00:40:53,690 --> 00:40:54,500
Það var frekar slæmt.

903
00:40:54,500 --> 00:40:56,650
Í raun gerði ég finna
einn rétt fyrir bekknum.

904
00:40:56,650 --> 00:40:58,620
En það er verra þarna úti.

905
00:40:58,620 --> 00:41:01,534
Þetta var greinilega minn
heimasíða árið 1996.

906
00:41:01,534 --> 00:41:04,200
Virðist ég hélt að það væri
viðeigandi að spyrja fólk nafn sitt

907
00:41:04,200 --> 00:41:05,991
áður en þeir gátu
í raun sjá vefsíðu mína.

908
00:41:05,991 --> 00:41:09,380

909
00:41:09,380 --> 00:41:11,920
>> Og þá sýndi ég þeim
eitthvað heimskur, sennilega.

910
00:41:11,920 --> 00:41:13,450
Ég grafa upp meira fyrir næsta tíma.

911
00:41:13,450 --> 00:41:16,220
En nú, við skulum
íhuga smá hönnun.

912
00:41:16,220 --> 00:41:17,444
Við höfum talað um stíl.

913
00:41:17,444 --> 00:41:19,735
Og þessari síðu svona langt og
mest allt sem ég hef skrifað

914
00:41:19,735 --> 00:41:21,890
er nokkuð hreinn stylistically.

915
00:41:21,890 --> 00:41:23,320
En hvað um hönnun?

916
00:41:23,320 --> 00:41:25,990
Jæja, það er mikið offramboð
í það sem ég hef verið að gera hér.

917
00:41:25,990 --> 00:41:28,156
>> Ég hef getið orðið
litur í nokkra staði.

918
00:41:28,156 --> 00:41:31,630
Ég hef getið leturstærð í nokkra
stöðum og djörf í nokkra staði.

919
00:41:31,630 --> 00:41:34,870
Og grundvallaratriðum, ég er co
mingling tvö tungumál.

920
00:41:34,870 --> 00:41:38,100
Ég hef fengið HTML með tags mitt og
eiginleika og þá allt í einu,

921
00:41:38,100 --> 00:41:40,100
milli gæsalappa, ég hef
sem annað tungumál í dag

922
00:41:40,100 --> 00:41:43,830
kallað CSS, sem aftur er bara þessi
lykill gildi pör eða þessir eiginleikar

923
00:41:43,830 --> 00:41:45,280
aðskilin með tvípunkti.

924
00:41:45,280 --> 00:41:47,700
>> Það kemur í ljós að mikið
eins og í C þar sem við

925
00:41:47,700 --> 00:41:50,550
getur byrjað að þáttur út
sumir kóða í haus skrá,

926
00:41:50,550 --> 00:41:53,520
svo við getum gert það sama í HTML.

927
00:41:53,520 --> 00:41:56,030
Og skref í átt sem er sem hér segir.

928
00:41:56,030 --> 00:42:02,230
Takið eftir að þessi útgáfa, CSS1.html er
byggingu nákvæmlega sömu vefsíðu.

929
00:42:02,230 --> 00:42:05,250
Svo ég hef fengið a heild búnt
af Divs, en í þetta skipti, hef ég

930
00:42:05,250 --> 00:42:07,220
fengið losa af umbúðir
div eins og þú munt sjá.

931
00:42:07,220 --> 00:42:12,390
>> Og ég hef gefið þeim þrjú Divs
efst, miðju og neðst, einstakt auðkenni.

932
00:42:12,390 --> 00:42:14,760
Þetta er gott, því við
gefa þeim deildum

933
00:42:14,760 --> 00:42:18,715
af bls einkvæm auðkenni,
Ég get vísað þeim annars staðar.

934
00:42:18,715 --> 00:42:19,215
Hvar?

935
00:42:19,215 --> 00:42:21,070
Jæja, láttu mig fletta upp.

936
00:42:21,070 --> 00:42:24,070
Og svona langt, hvenær við höfum litið
í höfuðið á a vefur blaðsíða, það er

937
00:42:24,070 --> 00:42:28,560
eina tag við höfum haft í
yfirmaður vefsíðu?

938
00:42:28,560 --> 00:42:29,740
Smá hávær.

939
00:42:29,740 --> 00:42:30,799
Bara titillinn hingað til.

940
00:42:30,799 --> 00:42:32,590
En það kemur í ljós að það er
nokkur önnur atriði

941
00:42:32,590 --> 00:42:35,840
þú getur sett í það, einn af
sem það er kallað stíl tag.

942
00:42:35,840 --> 00:42:37,850
Svo smá stund síðan, leit við
á stíl eiginleiki.

943
00:42:37,850 --> 00:42:39,150
Skrúfjárn út það er stíll tag.

944
00:42:39,150 --> 00:42:41,200
Það tilheyrir inni
yfirmaður vefsíðu.

945
00:42:41,200 --> 00:42:42,840
Og nú eftir hvað ég er að gera.

946
00:42:42,840 --> 00:42:46,540
Ég hef inni þetta
stíl tag eftirfarandi.

947
00:42:46,540 --> 00:42:51,190
Ég er bókstaflega að minnast á línu 20 á
Heiti merki sem ég vil stylize.

948
00:42:51,190 --> 00:42:53,489
>> Þá hef ég opinn hrokkið Brace
og lokað hrokkið Brace.

949
00:42:53,489 --> 00:42:56,030
Svo líkur í anda að C, en
aftur, þetta er ekki fall,

950
00:42:56,030 --> 00:42:57,796
þetta er bara nokkur dæmi um setningarleg smáatriði hér.

951
00:42:57,796 --> 00:43:00,170
Og þá auðvitað er ég að segja
vafra, hey vafra,

952
00:43:00,170 --> 00:43:05,210
gera allan líkamann á síðunni
hafa texta jöfnun miðju.

953
00:43:05,210 --> 00:43:06,930
Og þá er þetta að segja eftirfarandi.

954
00:43:06,930 --> 00:43:12,600
Hey vafra, ef þú sérð HTML
þáttur eða tag í síðunni sem

955
00:43:12,600 --> 00:43:17,040
hefur einstakt auðkenni á toppinn,
svo kjötkássa tákn hér þýðir bara

956
00:43:17,040 --> 00:43:21,010
einstök hugmynd um toppinn, fara á undan
og gera leturstærð hennar 36

957
00:43:21,010 --> 00:43:22,490
og letur þyngd hennar feitletraðar.

958
00:43:22,490 --> 00:43:26,840
>> Hey vafra, stak sem
ID er miðja, gera það 24 punktar.

959
00:43:26,840 --> 00:43:31,070
Og hey vafra, ef þú sérð
Hugmyndin um botn, gera það 12 punktar.

960
00:43:31,070 --> 00:43:33,540
Áhrifin á endanum
er einmitt Sam.

961
00:43:33,540 --> 00:43:36,500
Ef ég fer inn í CSS 1,
gáir sama.

962
00:43:36,500 --> 00:43:39,810
En við erum skref í átt
örlítið betri hönnun.

963
00:43:39,810 --> 00:43:44,850
Leyfðu mér nú að fara aftur hingað til CSS2
og sjá hvað ég hef gert.

964
00:43:44,850 --> 00:43:48,030
>> Nú er síðan í raun, mjög hreinn.

965
00:43:48,030 --> 00:43:50,730
Í raun get ég passa alla
innihald á síðunni hér.

966
00:43:50,730 --> 00:43:54,270
En hvað nýja tag hef ég
kynnt, augljóslega?

967
00:43:54,270 --> 00:43:54,770
Link.

968
00:43:54,770 --> 00:43:57,853
Og það er ekki það besta nafn fyrir tag,
vegna þess að það er ekki tengill í skilningi

969
00:43:57,853 --> 00:44:00,780
að við vitum það, en þetta þýðir
tengill í annan skrá.

970
00:44:00,780 --> 00:44:02,890
Þetta er góður af eins og skarpur eru í C.

971
00:44:02,890 --> 00:44:06,280
>> Þetta er leiðin í HTML
að segja hey vafra,

972
00:44:06,280 --> 00:44:10,240
fara að fá innihald
skráin heitir css2.css.

973
00:44:10,240 --> 00:44:12,880
Sambandið, að mér
er að það er stíll lak.

974
00:44:12,880 --> 00:44:17,980
Og reyndar, það er það sem einn af
S er í Cascading Style Sheets hætti.

975
00:44:17,980 --> 00:44:20,350
Þetta er stíll lak.

976
00:44:20,350 --> 00:44:23,120
Það er bara textaskrá sem inniheldur
a heild búnt af hótelinu.

977
00:44:23,120 --> 00:44:25,940
Það er allt fullt af stíl
sem þú vilt beita á síðu.

978
00:44:25,940 --> 00:44:28,860
>> Og svo þetta virðist er
vísa til seinni skráin.

979
00:44:28,860 --> 00:44:32,970
Og ef ég opna það, CSS2.css,
eftir því að allt sem ég hef gert

980
00:44:32,970 --> 00:44:35,900
er að afrita og líma allt
þetta í þessari skrá.

981
00:44:35,900 --> 00:44:38,220
Og nú, jafnvel ef þú hefur aldrei
dulmáli þetta efni áður,

982
00:44:38,220 --> 00:44:40,700
bara telja með
proverbial verkfræði húfu

983
00:44:40,700 --> 00:44:44,220
á, hvers vegna er þetta
betri hönnun sennilega?

984
00:44:44,220 --> 00:44:48,910
Þátta út þá CSS eiginleika,
setja þau í eigin skrá þeirra.

985
00:44:48,910 --> 00:44:51,330
Jafnvel þó að við leyst þetta
vandamál eins fimm mínútum

986
00:44:51,330 --> 00:44:52,600
í fyrsta útgáfa.

987
00:44:52,600 --> 00:44:55,730
>> Við höfum ekki batnað á
síðu stylistically,

988
00:44:55,730 --> 00:44:57,520
þetta er bara betra
hönnun í einhverjum skilningi.

989
00:44:57,520 --> 00:44:58,990
Hvers vegna finnst þér?

990
00:44:58,990 --> 00:45:01,510
Já.

991
00:45:01,510 --> 00:45:02,260
Sveigjanlegri hvernig?

992
00:45:02,260 --> 00:45:05,040

993
00:45:05,040 --> 00:45:05,540
Já.

994
00:45:05,540 --> 00:45:07,373
Svo ef þú vilt fara
aftur og breyta hlutum,

995
00:45:07,373 --> 00:45:09,540
nú hefur þú einn stað
þar sem þú getur breytt hlutum.

996
00:45:09,540 --> 00:45:11,622
Og í raun, fyrir eitthvað
eins Heimadæmi sjö,

997
00:45:11,622 --> 00:45:13,690
þar sem við munum innleiða
birgðir viðskipti website,

998
00:45:13,690 --> 00:45:15,523
það er að fara að hafa
allt fullt af síðum.

999
00:45:15,523 --> 00:45:17,620
Og það væri mjög
pirrandi ef þú ákveður, HM,

1000
00:45:17,620 --> 00:45:21,630
Ég í raun ekki eins og 24 punkta, ég vil
það að vera 28 pixlar eða örlítið stærri.

1001
00:45:21,630 --> 00:45:23,550
Og þá þarf að gera a
alþjóðlegt finna og skipta

1002
00:45:23,550 --> 00:45:27,560
eða opna allar skrár vefsvæðis þíns
einfaldlega að raunverulega breyta einu gildi.

1003
00:45:27,560 --> 00:45:31,290
By þátta út þessar stíl
í einum miðlægum stað,

1004
00:45:31,290 --> 00:45:34,720
þú getur nú opnað einn textaskrá
í CS50IDE í einhverju forriti,

1005
00:45:34,720 --> 00:45:36,479
breyta því, vista það, og gert.

1006
00:45:36,479 --> 00:45:38,270
Þú hefur ræktað þá
breytingar alls staðar.

1007
00:45:38,270 --> 00:45:42,450
Og það væri sama
í punktur h skrá eins og heilbrigður.

1008
00:45:42,450 --> 00:45:46,697
Svo einhverjar spurningar þannig
langt á þessari setningafræði?

1009
00:45:46,697 --> 00:45:48,530
Allt í lagi, þannig að við höfum
gert allt það virðist

1010
00:45:48,530 --> 00:45:51,170
nema raunverulega framkvæma tengla.

1011
00:45:51,170 --> 00:45:52,740
Og svo skulum fara á undan og gera þetta.

1012
00:45:52,740 --> 00:45:54,830
Leyfðu mér að fara á undan og
búa til nýja skrá hér.

1013
00:45:54,830 --> 00:45:59,970
Ég ætla að kalla það
link.html, setja í númerið dag.

1014
00:45:59,970 --> 00:46:03,000
>> Og ég ætla að gera opinn
krappi doc tegund HTML.

1015
00:46:03,000 --> 00:46:05,970
Sem innskot, þetta hlutur á að
efst, þetta doc tegund yfirlýsingu,

1016
00:46:05,970 --> 00:46:08,420
það er eina sem er skrítið
með upphrópunarmerki.

1017
00:46:08,420 --> 00:46:12,100
Þú verður bara að gera það þar og það
þýðir að við erum að nota HTML útgáfu 5.

1018
00:46:12,100 --> 00:46:14,460
Eldri útgáfur af
Tungumál hafði mikið lengur

1019
00:46:14,460 --> 00:46:16,400
strengir sem þú þarf til að setja það.

1020
00:46:16,400 --> 00:46:18,620
Svo hér er dæmi kölluð tengilinn.

1021
00:46:18,620 --> 00:46:20,950
>> Ég þarf líkama vefsíðu mína hér.

1022
00:46:20,950 --> 00:46:29,770
Og hér, a href jafngildir
skulum segja HTTP://www.disney.com

1023
00:46:29,770 --> 00:46:35,420
og uppáhalds vefsíðan mín, munum við segja.

1024
00:46:35,420 --> 00:46:38,550
Allt í lagi, svo mjög
innocuous, notendavænt síðu.

1025
00:46:38,550 --> 00:46:42,950
Ef ég fer nú í möppuna mína
skráningu hér og opna link.html,

1026
00:46:42,950 --> 00:46:44,780
við höfum há texta.

1027
00:46:44,780 --> 00:46:47,410
>> Og reyndar, þetta er þar
sem H í HTTP kemur frá.

1028
00:46:47,410 --> 00:46:51,580
Hypertext Transfer Protocol
er um að flytja texta

1029
00:46:51,580 --> 00:46:53,840
sem hefur tengla á aðrar auðlindir.

1030
00:46:53,840 --> 00:46:58,210
Og reyndar, hér er kunnugt,
ef Retro, blár tengill að ef smellt

1031
00:46:58,210 --> 00:47:02,607
mun í raun leiða mig til Disney.com.

1032
00:47:02,607 --> 00:47:03,940
Nú, ó, sem er að koma út fljótlega.

1033
00:47:03,940 --> 00:47:08,970
Allt í lagi, svo nú, hvað eru sumir
þeim áhrifum sem þetta?

1034
00:47:08,970 --> 00:47:11,610
>> Og hreinskilnislega, heimurinn byrjar
að fá smá meira kunnugleg

1035
00:47:11,610 --> 00:47:15,090
og líka litla scarier
en einnig aðeins meira

1036
00:47:15,090 --> 00:47:17,840
sjálf defensible þegar þú byrjar
að skilja þetta.

1037
00:47:17,840 --> 00:47:21,610
Vegna líkurnar eru, sumir af þú, ef þú ferð
gegnum Gmail spam mappa eða jafnvel

1038
00:47:21,610 --> 00:47:23,990
pósthólfið, hefur þú sennilega
fengið einhvers konar tölvupósti

1039
00:47:23,990 --> 00:47:26,980
sem er að biðja þig að breyta þinn
lykilorð kannski eða kannski staðfesta

1040
00:47:26,980 --> 00:47:28,910
PayPal persónuskilríki eða whatnot.

1041
00:47:28,910 --> 00:47:34,510
>> Og í raun, þú gætir hafa fengið
eitthvað sem segir eins smelltu hér

1042
00:47:34,510 --> 00:47:42,260
að endurstilla PayPal lykilorðið þitt.

1043
00:47:42,260 --> 00:47:44,130
Og nú, eftir, ef
þetta er ekki Disney.com

1044
00:47:44,130 --> 00:47:51,600
en eins badplace.com og
endurhlaða, athugið að texti hér

1045
00:47:51,600 --> 00:47:53,710
gæti sagt neitt af neinu tagi.

1046
00:47:53,710 --> 00:47:55,260
Og í raun, þetta er bara orð.

1047
00:47:55,260 --> 00:48:04,610
Hví ekki ég reyndar vera frábær illgjarn
og segja http://www.paypal.com.

1048
00:48:04,610 --> 00:48:14,090
>> Smelltu hér endurstilla paypal
lykilorð og nú endurhlaða.

1049
00:48:14,090 --> 00:48:16,220
Þetta lítur mjög lögmæt, ekki satt?

1050
00:48:16,220 --> 00:48:20,470
Ég meina, ég myndi ekki smella á
tölvupóst sem bara segir þetta.

1051
00:48:20,470 --> 00:48:22,450
En taka á slag hér.

1052
00:48:22,450 --> 00:48:26,880
Það segir www.paypal.com,
og í raun, bíddu í eina mínútu,

1053
00:48:26,880 --> 00:48:29,210
við vitum að þú vilt
sem s fyrir öryggi.

1054
00:48:29,210 --> 00:48:35,450
Svo nú er farið að www.paypal.com HTTPS,
en ef þú hefur aldrei gert þetta áður,

1055
00:48:35,450 --> 00:48:38,182
fæ í ​​vana að
sveima yfir litlu tenglum hér.

1056
00:48:38,182 --> 00:48:39,890
Og það er erfitt að sjá
á skjánum,

1057
00:48:39,890 --> 00:48:41,340
og það er ekki allt sem auðveldara hér.

1058
00:48:41,340 --> 00:48:43,615
En leið niður hér í
pínulítill lítill horn

1059
00:48:43,615 --> 00:48:45,740
er að vafrinn hafi
segja þér að við erum að fara

1060
00:48:45,740 --> 00:48:48,850
að badplace.com stað paypal.com.

1061
00:48:48,850 --> 00:48:51,620
Nú, þar sem við erum að fara með þetta?

1062
00:48:51,620 --> 00:48:54,859
Öll dæmi sem við höfum gert í dag,
við höfum harður dulmáli og slegið út höndunum.

1063
00:48:54,859 --> 00:48:56,900
Vefurinn er ótrúlega
uninteresting þegar þér erfitt

1064
00:48:56,900 --> 00:48:59,844
kóða þinn vefur blaðsíða til að efnið
er fast og aldrei breytast.

1065
00:48:59,844 --> 00:49:01,760
Auðvitað, allt okkar
uppáhalds vefsíður í dag,

1066
00:49:01,760 --> 00:49:04,470
hvort sem það er Gmail eða Twitter eða
Facebook eða allir tala af öðrum

1067
00:49:04,470 --> 00:49:05,290
eru dynamic.

1068
00:49:05,290 --> 00:49:07,340
Þeir eru að breyta í
svar við notandi inntak

1069
00:49:07,340 --> 00:49:08,840
rétt eins og Google leitarniðurstöðum.

1070
00:49:08,840 --> 00:49:12,415
>> Og svo á miðvikudaginn, það sem við gerum er
við leggjum HTML og CSS kynning

1071
00:49:12,415 --> 00:49:14,290
á bak við okkur og við tökum
sjálfsögðum hlut að við nú

1072
00:49:14,290 --> 00:49:16,640
veit það og við kynna
nýtt forritunarmál

1073
00:49:16,640 --> 00:49:19,050
heitir PHP, sem eins
C, er að fara að gefa okkur

1074
00:49:19,050 --> 00:49:22,450
vald til raunverulega búa til forrit
sem sér mynda framleiðsla.

1075
00:49:22,450 --> 00:49:25,900
Í þessu tilfelli, munum við vera með
PHP til að búa til virk vefnum

1076
00:49:25,900 --> 00:49:27,340
síður sem nota þetta nýtt tungumál.

1077
00:49:27,340 --> 00:49:28,989
Svo meira um það á miðvikudag.

1078
00:49:28,989 --> 00:49:29,530
Sjáumst þá.

1079
00:49:29,530 --> 00:49:33,130

1080
00:49:33,130 --> 00:49:37,380
>> [TÓNLIST spila]

1081
00:49:37,380 --> 00:52:38,864