1
00:00:00,000 --> 00:00:06,100

2
00:00:06,100 --> 00:00:08,790
>> DOUG LLOYD: Så vi har brukt
om-- hvis min matte er riktig,

3
00:00:08,790 --> 00:00:11,900
og jeg tror ser back-- jeg tror
vi brukte ca 35 videoer snakker

4
00:00:11,900 --> 00:00:15,139
om ulike aspekter av C, kanskje
litt mer, kanskje litt mindre.

5
00:00:15,139 --> 00:00:16,930
Og vi fikk ikke dekke
alt i C, men vi

6
00:00:16,930 --> 00:00:21,170
dekket en stor del av den
språk, det store flertallet av det,

7
00:00:21,170 --> 00:00:22,882
sikkert for vanlige bruker.

8
00:00:22,882 --> 00:00:25,090
Nå skal vi snakke
om et annet språk, HTML.

9
00:00:25,090 --> 00:00:28,180
Og vi kommer til å dekke
det i løpet av bare én video.

10
00:00:28,180 --> 00:00:29,340
>> Men det kommer til å være OK.

11
00:00:29,340 --> 00:00:31,410
Det kommer til å faktisk bli
noe du kommer til å bli vant til.

12
00:00:31,410 --> 00:00:33,535
Nå som du har
grunnleggende av ett språk,

13
00:00:33,535 --> 00:00:35,776
det er faktisk ganske lett
å begynne å lære andre.

14
00:00:35,776 --> 00:00:37,650
Så vi kommer til å starte
å gå litt tilbake

15
00:00:37,650 --> 00:00:43,340
og glatte over de grunnleggende
Forskjellene mellom disse språkene

16
00:00:43,340 --> 00:00:45,750
og liksom la deg til det.

17
00:00:45,750 --> 00:00:48,530
Det finnes en rekke virkelig gode
ressurser på Internett, som

18
00:00:48,530 --> 00:00:51,279
vi kommer til å begynne å henvise deg
mot fordi internett er

19
00:00:51,279 --> 00:00:53,340
et stort lager av informasjon.

20
00:00:53,340 --> 00:00:55,960
Og så det er ikke som du vil
være gjekk ut nødvendigvis

21
00:00:55,960 --> 00:00:58,349
ved ikke å ha den informasjonen
dekket i en video.

22
00:00:58,349 --> 00:01:00,640
Du vil fortsatt kunne få
alt du trenger og bruk

23
00:01:00,640 --> 00:01:03,590
den kunnskapen du allerede har
bygget opp ved å forstå C

24
00:01:03,590 --> 00:01:07,130
for å gjøre læringskurven for disse
andre språk faktisk mye flatere.

25
00:01:07,130 --> 00:01:08,640
Jeg lover.

26
00:01:08,640 --> 00:01:12,770
>> Men la oss snakke om ett språk
det er egentlig grunnleggende for alle web

27
00:01:12,770 --> 00:01:14,830
siden som er HTML.

28
00:01:14,830 --> 00:01:18,230
HTML er Hyper Text Markup Language.

29
00:01:18,230 --> 00:01:22,700
HTML er et språk, men det er
ikke et programmeringsspråk.

30
00:01:22,700 --> 00:01:23,900
>> HTML har ikke variabler.

31
00:01:23,900 --> 00:01:26,430
Det trenger ikke logikk eller
funksjoner eller noe sånt.

32
00:01:26,430 --> 00:01:30,301
Vi kan ikke gjøre noe
programmering per se i HTML.

33
00:01:30,301 --> 00:01:32,300
Noen ganger vil du høre
folk beskriver seg selv

34
00:01:32,300 --> 00:01:35,710
som HTML-programmerere, som
er ikke helt nøyaktig.

35
00:01:35,710 --> 00:01:37,980
Vi kan ikke skrive HTML-programmer.

36
00:01:37,980 --> 00:01:40,770
>> HTML er bare brukt til å markere tekst.

37
00:01:40,770 --> 00:01:42,690
Det kalles et kodespråk.

38
00:01:42,690 --> 00:01:47,680
Og hva dette does-- dette markup--
vi bruker koder i HTML og disse tags--

39
00:01:47,680 --> 00:01:51,600
dette markup-- semantisk
definerer strukturen for en side

40
00:01:51,600 --> 00:01:55,280
og fører til at ren tekst som
eksisterer mellom kodene skal tolkes

41
00:01:55,280 --> 00:01:57,320
av nettlesere på ulike måter.

42
00:01:57,320 --> 00:02:00,370
Og kanskje det er best å forklare
dette ved hjelp av en illustrasjon.

43
00:02:00,370 --> 00:02:06,450
>> Her er en veldig enkel HTML-side, ikke
en HTML-program, igjen, en HTML-side.

44
00:02:06,450 --> 00:02:08,680
Og vi vet at det er en
HTML-side fordi vi har

45
00:02:08,680 --> 00:02:11,480
avgrenset alt med HTML-koder.

46
00:02:11,480 --> 00:02:13,850
Så dette er hva en HTML-kode ser ut.

47
00:02:13,850 --> 00:02:15,870
Det er mellom vinkelparenteser.

48
00:02:15,870 --> 00:02:18,570
Og legg merke til på toppen vi har
HTML og helt nederst,

49
00:02:18,570 --> 00:02:21,400
etter at vi har gjort det som er
tilsynelatende mye annet HTML,

50
00:02:21,400 --> 00:02:24,310
vi har vinkelfeste slash HTML.

51
00:02:24,310 --> 00:02:29,262
Så den slags er grensen
mellom hva som er HTML og hva som ikke.

52
00:02:29,262 --> 00:02:32,220
Og selvfølgelig, konvensjonelt, bare
som du skrev alle dine C-programmer

53
00:02:32,220 --> 00:02:35,300
med dot C utvidelser,
alle HTML-filer

54
00:02:35,300 --> 00:02:37,909
vil ende med punkt HTML utvidelser.

55
00:02:37,909 --> 00:02:39,200
Men det er mer å gå på her.

56
00:02:39,200 --> 00:02:40,658
Vi trenger ikke bare disse HTML-koder.

57
00:02:40,658 --> 00:02:44,010
Vi tilsynelatende har dette
ting som kalles et hode tag.

58
00:02:44,010 --> 00:02:46,010
Vel, OK, hva er det?

59
00:02:46,010 --> 00:02:48,550
>> Vel kanskje det er best å
skille ved hjelp av et organ,

60
00:02:48,550 --> 00:02:50,590
Kroppen blir innholdet på nettsiden.

61
00:02:50,590 --> 00:02:55,860
Så kanskje hodet tag definerer ting
som ikke er i nettleservinduet riktig,

62
00:02:55,860 --> 00:02:59,410
men er liksom viktig for vår
nettside blir gjort på riktig måte.

63
00:02:59,410 --> 00:03:02,490
For eksempel, på innsiden av
head tag vi har titler.

64
00:03:02,490 --> 00:03:05,500
>> Så tittelen er hello world,
som faktisk kommer til å være det

65
00:03:05,500 --> 00:03:08,797
dukker opp i den kategorien i Chrome
eller i safari eller Firefox--

66
00:03:08,797 --> 00:03:11,880
uansett nettleser du prefer-- det er
hva som kommer til å dukke opp i tittelen.

67
00:03:11,880 --> 00:03:14,800
Og før tabs ville det vise seg
opp i hele nettleservinduet

68
00:03:14,800 --> 00:03:19,710
og du kan bare ha én side
åpnes i et nettleservindu om gangen.

69
00:03:19,710 --> 00:03:22,160
Så det kommer til å bli den
Tittelen på min side opp i kategorien

70
00:03:22,160 --> 00:03:24,600
eller nettleservinduet bar, hallo verden.

71
00:03:24,600 --> 00:03:28,611
Og da innholdet i min
nettside vil være verden, hallo.

72
00:03:28,611 --> 00:03:31,360
Så la oss ta en titt på hva noen
ting som dette kan se ut.

73
00:03:31,360 --> 00:03:33,210
Dette er en ganske enkel HTML-side.

74
00:03:33,210 --> 00:03:35,970
Så jeg er her i min CS50 IDE og
Jeg har zoomet inn litt.

75
00:03:35,970 --> 00:03:38,290
Og jeg skal bare
åpne opp hallo dot HTML

76
00:03:38,290 --> 00:03:42,000
og vise deg at dette er ganske mye
innholdet på siden som vi har sett før.

77
00:03:42,000 --> 00:03:45,240
Mine enkle HTML, head-koder,
title tags, body, og så videre.

78
00:03:45,240 --> 00:03:47,320
Jeg har rykket inn for å være ren.

79
00:03:47,320 --> 00:03:51,530
>> Og hva jeg kan gjøre i min
IDE er bare forhåndsvise siden.

80
00:03:51,530 --> 00:03:52,630
Og der vi går.

81
00:03:52,630 --> 00:03:56,070
Innholdet på siden min er verden,
hei, og jeg ser ikke noe

82
00:03:56,070 --> 00:03:58,500
fra hodet kodene der.

83
00:03:58,500 --> 00:03:59,980
Det er bare innholdet av kroppen.

84
00:03:59,980 --> 00:04:00,780
Verden, hallo.

85
00:04:00,780 --> 00:04:03,700
Og igjen kroppen bare
sa, verden, hallo.

86
00:04:03,700 --> 00:04:06,160
Den andre delen er savnet.

87
00:04:06,160 --> 00:04:07,610
>> Så det er egentlig alt det er.

88
00:04:07,610 --> 00:04:11,370
Dette er en veldig enkel grunnleggende HTML-side.

89
00:04:11,370 --> 00:04:14,280
Nå har jeg rykket mitt HTML til
være veldig hyggelig og organisert,

90
00:04:14,280 --> 00:04:15,840
men jeg faktisk ikke må.

91
00:04:15,840 --> 00:04:17,959
Jeg kunne gjøre det ser ganske stygt.

92
00:04:17,959 --> 00:04:19,467
Og dette vil fortsatt fungere.

93
00:04:19,467 --> 00:04:21,050
Dette ville være nøyaktig samme nettside.

94
00:04:21,050 --> 00:04:23,100
Jeg har nettopp blitt kvitt
all white space.

95
00:04:23,100 --> 00:04:24,820
>> Som det viser seg, er tomrom data.

96
00:04:24,820 --> 00:04:28,540
Og så når vi sender data fra
avsender til mottaker, fra server

97
00:04:28,540 --> 00:04:30,670
til klienten, data koster penger.

98
00:04:30,670 --> 00:04:34,460
Og så bli kvitt mellomrom
er faktisk en god idé

99
00:04:34,460 --> 00:04:37,320
hvis du er noen som tjener
opp mye av web-innhold.

100
00:04:37,320 --> 00:04:39,820
Det er en dårlig idé hvis du er
noen som er å lære dette ting

101
00:04:39,820 --> 00:04:41,528
og du vil ha
det pent organisert.

102
00:04:41,528 --> 00:04:43,810
Dette er mye lettere å analysere enn dette.

103
00:04:43,810 --> 00:04:45,540
Men det er funksjonelt identiske.

104
00:04:45,540 --> 00:04:48,720
>> Innrykk og sånt
faktisk ikke saken i HTML.

105
00:04:48,720 --> 00:04:53,634
Alt som teller er åpne koder og
lukking tags i riktig rekkefølge.

106
00:04:53,634 --> 00:04:55,050
Legg merke til hva som skjedde her, skjønt.

107
00:04:55,050 --> 00:04:58,450
Markup gir oss en måte å
kommunisere ekstra informasjon

108
00:04:58,450 --> 00:04:59,940
om hva vi har skrevet.

109
00:04:59,940 --> 00:05:03,130
The Hello, World del var
tolket som tittel.

110
00:05:03,130 --> 00:05:06,410
Og verden, hallo del var
tolket som innholdet

111
00:05:06,410 --> 00:05:09,090
eller hva som bør være
synlig på nettsiden min.

112
00:05:09,090 --> 00:05:12,167
>> Det finnes over 100 av disse forskjellige
tags og massevis av flotte ressurser

113
00:05:12,167 --> 00:05:13,000
på nettet for å finne dem.

114
00:05:13,000 --> 00:05:14,900
Vi kommer til å snakke om en
noen av dem i denne videoen, noen

115
00:05:14,900 --> 00:05:16,440
av de virkelig grunnleggende ting.

116
00:05:16,440 --> 00:05:18,440
Men vi skal ikke snakke
om det hele, fordi det

117
00:05:18,440 --> 00:05:20,250
ville være uttømmende for å gjøre dette.

118
00:05:20,250 --> 00:05:22,880
>> En annen ting du kan gjøre, skjønt,
er åpne utviklerverktøy.

119
00:05:22,880 --> 00:05:26,069
Og hvis du husker fra
vår video på HTTP,

120
00:05:26,069 --> 00:05:27,860
Jeg forklarte hvordan du åpner
opp utviklerverktøy.

121
00:05:27,860 --> 00:05:32,020
I Chrome er det vanligvis F12-tasten
å åpne opp utvikleren verktøylinjen.

122
00:05:32,020 --> 00:05:35,909
Så i stedet for å velge Network
fanen kan du velge fanen Elements.

123
00:05:35,909 --> 00:05:37,700
Og hvis du laster inn en nettside
side, vil du faktisk

124
00:05:37,700 --> 00:05:40,280
se HTML som skaper denne websiden.

125
00:05:40,280 --> 00:05:44,090
Og så kan du lære mye om HTML
ved å se på dine favoritt nettsteder

126
00:05:44,090 --> 00:05:48,474
og se hvordan de bygger
ulike delene av dem som du liker.

127
00:05:48,474 --> 00:05:50,890
Så kanskje det er denne kule
mønster eller noe sånt.

128
00:05:50,890 --> 00:05:52,140
Hvordan de gjør det med HTML do?

129
00:05:52,140 --> 00:05:55,630
Vel du kan bare åpne opp utvikleren
verktøy og sveve over det elementet

130
00:05:55,630 --> 00:05:57,700
og se nøyaktig hva som HTML gjør det.

131
00:05:57,700 --> 00:05:59,450
Så det er en veldig
god måte å lære HTML,

132
00:05:59,450 --> 00:06:02,330
og jeg anbefaler sterkt at
du gjør det både for å lære HTML

133
00:06:02,330 --> 00:06:04,930
og også å lære litt
litt om noen av alternativene

134
00:06:04,930 --> 00:06:07,050
tilgjengelig for deg i
utviklerverktøy, som

135
00:06:07,050 --> 00:06:10,200
vil sikkert komme godt med som
du begynner å gjøre mer intensiv web

136
00:06:10,200 --> 00:06:11,090
programmering.

137
00:06:11,090 --> 00:06:14,080
>> Så la oss ta en titt på en
par vanlige HTML-koder.

138
00:06:14,080 --> 00:06:17,210
Og vi vil hoppe og ta en titt på
hva disse kodene vil også gjengi

139
00:06:17,210 --> 00:06:20,490
som ved å se på noen filer i min IDE.

140
00:06:20,490 --> 00:06:26,330
Så her er tre svært grunnleggende koder for
tweaking det visuelle inntrykket av teksten.

141
00:06:26,330 --> 00:06:29,050
Det er B-koder, jeg koder og U-koder.

142
00:06:29,050 --> 00:06:33,170
Og henholdsvis det de gjør er
gjengi teksten mellom dem i fet skrift,

143
00:06:33,170 --> 00:06:35,430
kursiv og understreking.

144
00:06:35,430 --> 00:06:40,430
Så la oss se hva som ville se
som på en faktisk nettside i min IDE.

145
00:06:40,430 --> 00:06:43,390
>> Så her i min IDE har jeg en
fil som heter BIU dot HTML.

146
00:06:43,390 --> 00:06:46,770
BIU dot HTML bare å være
fet, kursiv, understreking.

147
00:06:46,770 --> 00:06:47,830
Jeg skal åpne den opp.

148
00:06:47,830 --> 00:06:51,810
>> Og vi vil se at her jeg
har denne teksten er B-koder fet.

149
00:06:51,810 --> 00:06:54,010
Denne teksten er jeg tags kursiv.

150
00:06:54,010 --> 00:06:56,307
Og denne teksten er U-koder understreket.

151
00:06:56,307 --> 00:06:57,640
Hva er dette kommer til å se ut?

152
00:06:57,640 --> 00:06:59,473
Vel igjen, har alt jeg
å gjøre er å gå over her

153
00:06:59,473 --> 00:07:04,690
til nettleseren min, min filbehandler, klikk
Preview, og dette er hva som kommer opp.

154
00:07:04,690 --> 00:07:07,520
>> Teksten i mellom B
tags er faktisk nå dristig.

155
00:07:07,520 --> 00:07:10,720
Teksten i mellom I
tags er faktisk nå kursiv.

156
00:07:10,720 --> 00:07:14,634
Og teksten på mellom U
tags er faktisk nå understreket.

157
00:07:14,634 --> 00:07:15,550
Så det er ganske bra.

158
00:07:15,550 --> 00:07:18,450
Vi vet nå hvordan å lage tekst
ser litt mer fancy

159
00:07:18,450 --> 00:07:20,360
eller trekke vekt på visse ting.

160
00:07:20,360 --> 00:07:25,530
Et annet par vanlige tags her er
ledd koder, P, og header koder,

161
00:07:25,530 --> 00:07:27,980
som jeg har gjengitt her som HX.

162
00:07:27,980 --> 00:07:32,520
>> Disse P-koder, disse ledd koder,
bryte teksten opp i avsnitt.

163
00:07:32,520 --> 00:07:34,646
Det er ikke nok å bare
trykk Enter og la mellomrom,

164
00:07:34,646 --> 00:07:37,186
fordi en datamaskin er bare kommer
å gjøre det du ber den om

165
00:07:37,186 --> 00:07:39,450
og det ignorerer hvit
plass til det meste.

166
00:07:39,450 --> 00:07:41,636
Så vi kan ikke bare trykke Enter
og forventer vår datamaskin

167
00:07:41,636 --> 00:07:43,760
å tolke at vi ønsker
for å starte et nytt avsnitt.

168
00:07:43,760 --> 00:07:47,670
Vi må veldig eksplisitt si dette
er en paragraph-- dette er another--

169
00:07:47,670 --> 00:07:50,740
ved å kapsle hver i et sett av P-koder.

170
00:07:50,740 --> 00:07:54,560
>> Og vi har også disse opsjonene
for H koder, disse overskriften koder.

171
00:07:54,560 --> 00:07:57,000
Vi har seks forskjellige nivåer
overskrifter, en, to, tre,

172
00:07:57,000 --> 00:08:01,110
fire, fem og seks, som er
progressivt større og større

173
00:08:01,110 --> 00:08:01,710
overskrifter.

174
00:08:01,710 --> 00:08:04,360
Og de får mindre og
mindre og mindre og mindre.

175
00:08:04,360 --> 00:08:07,690
Så vi har et toppnivå header, en andre
nivå header, og så videre, og så videre.

176
00:08:07,690 --> 00:08:10,480
>> La oss ta en titt på kanskje noen
P-koder og noen header koder

177
00:08:10,480 --> 00:08:13,110
i aksjon på en nettside.

178
00:08:13,110 --> 00:08:18,180
Så her i min IDE har jeg en fil som heter
PH dot HTML, PH være avsnitt

179
00:08:18,180 --> 00:08:18,970
og header koder.

180
00:08:18,970 --> 00:08:20,709
Åpne den opp.

181
00:08:20,709 --> 00:08:23,000
Det er mye som skjer her
fordi jeg har satt noen lorem

182
00:08:23,000 --> 00:08:24,660
ipsum, noen bare tilfeldig tekst i her.

183
00:08:24,660 --> 00:08:27,284
Så jeg skal zoome ut litt
fordi det er så mye som skjer.

184
00:08:27,284 --> 00:08:31,980
Men legg merke til at jeg har helt
toppen her har jeg en H1, et nivå én,

185
00:08:31,980 --> 00:08:32,802
header tag.

186
00:08:32,802 --> 00:08:36,010
Da har jeg et avsnitt, som er like
en haug med tilfeldig text-- lorem ipsum--

187
00:08:36,010 --> 00:08:38,720
bare standard standard fylling i teksten.

188
00:08:38,720 --> 00:08:41,970
Så jeg har to avsnittene innsiden av det
nivå en header og deretter ned nedenfor jeg

189
00:08:41,970 --> 00:08:46,850
ha et nivå to header her på linje 24,
et andre nivå header, og en annen to

190
00:08:46,850 --> 00:08:47,840
avsnitt.

191
00:08:47,840 --> 00:08:51,910
Vel hva ser dette ut
hvis jeg kunne se i forhåndsvisning min?

192
00:08:51,910 --> 00:08:53,790
La oss se.

193
00:08:53,790 --> 00:08:55,730
>> Så merker at
første nivå header her

194
00:08:55,730 --> 00:08:58,420
er faktisk ganske mye større
enn det andre nivået spissen.

195
00:08:58,420 --> 00:08:59,940
Så vi brukte H1 tagger.

196
00:08:59,940 --> 00:09:03,820
Og legg merke til at P-koder tillate oss
å bryte ut ting i avsnitt.

197
00:09:03,820 --> 00:09:07,500
Hvis vi hadde blitt kvitt disse P-koder
og faktisk bare sette Går eller retur

198
00:09:07,500 --> 00:09:10,110
i mellom hva vi håpet ville
være de ulike punktene,

199
00:09:10,110 --> 00:09:13,193
de ville alle bare smelle sammen og
det ikke ville ha denne fine avsnitt

200
00:09:13,193 --> 00:09:15,840
separasjon med plass over og under.

201
00:09:15,840 --> 00:09:18,300
Og så det er hva avsnitt
koder og header koder

202
00:09:18,300 --> 00:09:22,440
blir ofte brukt til å gjøre for å trekke
oppmerksomhet til deler av vår nettside

203
00:09:22,440 --> 00:09:23,550
på den måten.

204
00:09:23,550 --> 00:09:27,560
>> Neste opp er noen koder som vi bruker
å bygge lister på vår nettside.

205
00:09:27,560 --> 00:09:30,820
Så vi har uordnet
lists-- ULs-- som er bare

206
00:09:30,820 --> 00:09:34,090
punktlister, bestilt
Listen som er numbered--

207
00:09:34,090 --> 00:09:37,680
OLs-- og innsiden av enten
en av dem må vi ha

208
00:09:37,680 --> 00:09:40,600
sett på hvordan man kan indikere listeelementer, LI.

209
00:09:40,600 --> 00:09:44,370
Og så har vi åpent UL tag
og vi legger elementer inne i den.

210
00:09:44,370 --> 00:09:46,920
Og så når vi er ferdige med
det, kan vi lukke UL tag.

211
00:09:46,920 --> 00:09:49,850
>> Og på samme måte kan vi ha
en ordnet eller nummerert liste

212
00:09:49,850 --> 00:09:51,560
og sette listeelementer innsiden av det.

213
00:09:51,560 --> 00:09:53,350
Så la oss ta en titt
på et par lister

214
00:09:53,350 --> 00:09:57,230
og hva de ville
gjengi som på CS50 IDE.

215
00:09:57,230 --> 00:10:00,640
Så jeg har her i min IDE en
fil som heter lister dot HTML.

216
00:10:00,640 --> 00:10:03,100
La oss ta en titt.

217
00:10:03,100 --> 00:10:08,482
>> Og legg merke til her jeg har en uordnet
liste med fem ting i den.

218
00:10:08,482 --> 00:10:11,440
Og så har jeg en sortert liste, og
Jeg har endret koden litt,

219
00:10:11,440 --> 00:10:11,939
ikke sant?

220
00:10:11,939 --> 00:10:13,152
Jeg har sagt start tilsvarer seks.

221
00:10:13,152 --> 00:10:16,110
Det viser seg med en sortert liste jeg
kan sette startpunktet hvor

222
00:10:16,110 --> 00:10:20,130
Jeg want-- som standard vil det være one--
ved å bare legge denne såkalte attributt

223
00:10:20,130 --> 00:10:21,190
til min OL tag.

224
00:10:21,190 --> 00:10:23,572
Og så denne listen vil
begynne å telle på seks.

225
00:10:23,572 --> 00:10:26,780
Så elementene som nummerert liste
bør være seks, syv, åtte, ni, ti,

226
00:10:26,780 --> 00:10:29,930
fordi det er fem elementer
i listen, i motsetning til en,

227
00:10:29,930 --> 00:10:33,770
to, tre, fire, fem, noe
ville være tilfelle hvis jeg hadde sagt OL

228
00:10:33,770 --> 00:10:36,730
uten å spesifisere starten attributtet.

229
00:10:36,730 --> 00:10:41,594
>> Så vi får bare forhåndsvise dette slik at du kan
få en følelse for hva som skjer her.

230
00:10:41,594 --> 00:10:42,260
Og der vi går.

231
00:10:42,260 --> 00:10:44,610
Det er min liste.

232
00:10:44,610 --> 00:10:47,810
De fem første elementene er
sorterte eller punktlister.

233
00:10:47,810 --> 00:10:51,010
Og de neste fem elementene
er en egen ordnet liste

234
00:10:51,010 --> 00:10:52,980
fra seks.

235
00:10:52,980 --> 00:10:56,247
Så det er hvordan vi kan
bygge lister ved hjelp av HTML.

236
00:10:56,247 --> 00:10:58,080
En annen ting du kanskje
ønsker å gjøre med HTML

237
00:10:58,080 --> 00:11:01,520
er å bygge en tabell over
informasjon rader og kolonner

238
00:11:01,520 --> 00:11:04,560
å presentere informasjon i en
spesielt organisert måte.

239
00:11:04,560 --> 00:11:09,110
For å gjøre dette med HTML vi kan ha en
tabelldefinisjonen begynner åpen brakett

240
00:11:09,110 --> 00:11:10,160
tabell.

241
00:11:10,160 --> 00:11:14,680
Og så innsiden av det bordet vi
kan ha et sett med rader, TR tags

242
00:11:14,680 --> 00:11:15,980
å indikere hver rad.

243
00:11:15,980 --> 00:11:22,510
Og så TD tags gå på innsiden av TR tags
for å angi en kolonne i en rad.

244
00:11:22,510 --> 00:11:24,340
>> Hvorfor heter det TD og ikke TC?

245
00:11:24,340 --> 00:11:25,940
Vel, står TD for tabelldata.

246
00:11:25,940 --> 00:11:27,900
Vanligvis du setter
din informasjon der.

247
00:11:27,900 --> 00:11:29,440
Så det er derfor det er TD og ikke TC.

248
00:11:29,440 --> 00:11:31,140
Det er litt forvirrende.

249
00:11:31,140 --> 00:11:33,720
>> Så du har tabellkoder og
innsiden av tabellkoder

250
00:11:33,720 --> 00:11:35,600
du har et antall rader, TR.

251
00:11:35,600 --> 00:11:40,030
Og inne i hver rad du har
TDS for antall kolonner

252
00:11:40,030 --> 00:11:42,880
at du vil ha
i den aktuelle rad.

253
00:11:42,880 --> 00:11:47,730
La oss ta en titt på en svært
enkel tabell over i CS50 IDE.

254
00:11:47,730 --> 00:11:49,730
>> Så jeg har her en fil
kalt bord dot HTML.

255
00:11:49,730 --> 00:11:53,390
La oss ta en titt på
hva som ser ut som.

256
00:11:53,390 --> 00:11:56,225
Det er mye som skjer her, men
hvis du merker jeg har en tabell åpen.

257
00:11:56,225 --> 00:11:57,850
Jeg begynner definisjonen med bord.

258
00:11:57,850 --> 00:12:02,100
Og så i min første rad jeg tydeligvis
har fire kolonner, en, to, tre,

259
00:12:02,100 --> 00:12:02,660
fire.

260
00:12:02,660 --> 00:12:04,290
Og så er jeg ferdig med den raden.

261
00:12:04,290 --> 00:12:07,750
>> Da starter jeg en annen rad og
gjøre to, fire, seks, åtte.

262
00:12:07,750 --> 00:12:08,850
Fullfør den raden.

263
00:12:08,850 --> 00:12:11,410
Har en annen rad, tre, seks, ni, 12.

264
00:12:11,410 --> 00:12:14,830
Og så en siste rad, fire,
åtte, 12, og selv om det er

265
00:12:14,830 --> 00:12:16,560
litt avskåret her, 16.

266
00:12:16,560 --> 00:12:17,710
>> Jeg er ferdig som rad.

267
00:12:17,710 --> 00:12:18,970
Jeg er ferdig bordet.

268
00:12:18,970 --> 00:12:21,430
Og så er jeg ferdig med min HTML.

269
00:12:21,430 --> 00:12:22,590
Hvordan ser dette ut?

270
00:12:22,590 --> 00:12:26,014

271
00:12:26,014 --> 00:12:27,430
Vel, det er ikke veldig mye å se.

272
00:12:27,430 --> 00:12:31,690
Jeg har helt klart organisert min informasjon
i en noe mer organisert måte.

273
00:12:31,690 --> 00:12:33,755
Men det er ikke super pen her.

274
00:12:33,755 --> 00:12:36,130
Og vi kommer til å forholde seg til
at når vi snakker om CSS.

275
00:12:36,130 --> 00:12:38,930
Vi vil se denne ideen om
hva vi gjør for å gjøre a tabell

276
00:12:38,930 --> 00:12:41,260
kanskje formatere det litt bedre?

277
00:12:41,260 --> 00:12:45,070
Men jeg har fortsatt fire rader,
som hver har fire kolonner,

278
00:12:45,070 --> 00:12:48,890
og egentlig hva dette utgjør er en
veldig enkel fire av fire multiplikasjon

279
00:12:48,890 --> 00:12:49,870
tabell.

280
00:12:49,870 --> 00:12:51,690
>> Bare noen få flere tags vi skal snakke om.

281
00:12:51,690 --> 00:12:54,617
La oss snakke om det
Konseptet med et HTML-skjema.

282
00:12:54,617 --> 00:12:57,450
Så du kan ha sett dette i
sammenheng med å logge inn på en nettside.

283
00:12:57,450 --> 00:12:59,100
Vanligvis du skrive inn brukernavnet ditt.

284
00:12:59,100 --> 00:13:01,510
Du skriver inn passordet,
og du er flink til å gå.

285
00:13:01,510 --> 00:13:04,170
Det ville være begynnelsen på et skjema.

286
00:13:04,170 --> 00:13:05,420
>> Hoppe over div et sekund.

287
00:13:05,420 --> 00:13:07,987
Vi har også innganger hvilke
slags passe innsiden av skjemaer.

288
00:13:07,987 --> 00:13:10,320
Dette er elementer som
du faktisk skriver inn,

289
00:13:10,320 --> 00:13:12,580
eller radioknappene du er
tikker, eller sjekk

290
00:13:12,580 --> 00:13:14,310
bokser som du tikker av.

291
00:13:14,310 --> 00:13:15,770
Så disse gå på innsiden av skjemaer.

292
00:13:15,770 --> 00:13:18,500
Og de utgjør i utgangspunktet
hver rad i form

293
00:13:18,500 --> 00:13:19,887
hvis formen er formatert godt.

294
00:13:19,887 --> 00:13:22,220
Så er det dette begrepet
en div, som ikke egentlig

295
00:13:22,220 --> 00:13:25,060
passe en bestemt kategori i
av tagger som de jeg har

296
00:13:25,060 --> 00:13:26,170
gjort tidligere.

297
00:13:26,170 --> 00:13:29,790
Det bare liksom avgrenser
begynnelsen av en oppkonstruert division--

298
00:13:29,790 --> 00:13:31,670
div-- på siden.

299
00:13:31,670 --> 00:13:33,210
Det er ingen visuell pause.

300
00:13:33,210 --> 00:13:34,800
Det er ingen linje.

301
00:13:34,800 --> 00:13:37,180
Det er ikke satt av som en
separat del automatisk.

302
00:13:37,180 --> 00:13:39,430
Du må style det
på den måten å gjøre det.

303
00:13:39,430 --> 00:13:42,110
>> Den sier bare liksom jeg vil ha en
stykke plass på min nettside,

304
00:13:42,110 --> 00:13:45,190
og jeg bare kommer til å kalle
det denne divisjonen på siden min.

305
00:13:45,190 --> 00:13:47,619
Vi kan sette ting inni
av divs, og faktisk,

306
00:13:47,619 --> 00:13:49,410
når vi hodet over til
IDE i et sekund, vil vi

307
00:13:49,410 --> 00:13:53,760
ser at jeg setter min
danner innsiden av en div.

308
00:13:53,760 --> 00:13:57,050
>> Så jeg har her i min IDE en
fil kalt div skjema dot HTML.

309
00:13:57,050 --> 00:13:59,260
La oss åpne den opp.

310
00:13:59,260 --> 00:14:01,460
Legg merke til at som jeg sa,
div er slags vilkårlig.

311
00:14:01,460 --> 00:14:01,640
Høyre?

312
00:14:01,640 --> 00:14:02,973
Det gjør egentlig ikke betyr noe.

313
00:14:02,973 --> 00:14:05,140
Så jeg har en vilkårlig
første divisjon på siden min.

314
00:14:05,140 --> 00:14:07,848
Og så i stedet for en annen div
senere, starter på linje åtte,

315
00:14:07,848 --> 00:14:08,730
Jeg har denne formen.

316
00:14:08,730 --> 00:14:13,594
Og inne på formen jeg har en
antall innganger, feltene i skjemaet.

317
00:14:13,594 --> 00:14:16,510
Så jeg har et felt som heter A--
som egentlig ikke betyr noe

318
00:14:16,510 --> 00:14:19,350
rett now-- som tilsynelatende
tar tekst, en annen som

319
00:14:19,350 --> 00:14:22,630
tar et passord, en annen som er en Radio
knapp, en annen som er en avmerkingsboks,

320
00:14:22,630 --> 00:14:24,797
og en annen som er en Send-knappen.

321
00:14:24,797 --> 00:14:26,630
Vel, hva betyr dette
alt faktisk ser ut?

322
00:14:26,630 --> 00:14:27,629
Vel, la oss ta en titt.

323
00:14:27,629 --> 00:14:31,010
Vi vil åpne den opp i forhåndsvisning vinduet vårt.

324
00:14:31,010 --> 00:14:33,557
Legg merke til at dette vilkårlig
første division-- det er

325
00:14:33,557 --> 00:14:34,640
ingen visuell separasjon her.

326
00:14:34,640 --> 00:14:37,150
Det gjorde egentlig ikke gjøre noe, ikke sant?

327
00:14:37,150 --> 00:14:38,220
>> Og så har jeg min form.

328
00:14:38,220 --> 00:14:39,890
Og jeg gjorde ikke noen spesiell formatering.

329
00:14:39,890 --> 00:14:42,680
Så formen er bare ett
store raden av informasjon.

330
00:14:42,680 --> 00:14:46,424
Hvis jeg hadde formatert formen min annerledes,
Jeg kan ha det linje for linje for linje.

331
00:14:46,424 --> 00:14:47,590
Men jeg gjorde ikke noe styling.

332
00:14:47,590 --> 00:14:49,256
Igjen, vi snakker ikke om CSS her.

333
00:14:49,256 --> 00:14:51,030
Vi snakker bare om HTML.

334
00:14:51,030 --> 00:14:53,980
>> Vel i min tekstform kan jeg type--
husk at former typen tekst

335
00:14:53,980 --> 00:14:55,480
så jeg kan sette navnet mitt.

336
00:14:55,480 --> 00:14:57,330
Og i passordet mitt jeg
kan skrive passordet mitt.

337
00:14:57,330 --> 00:14:59,740
Og fordi det feltet
er av typen passord,

338
00:14:59,740 --> 00:15:01,470
du vet ikke hva passordet mitt er.

339
00:15:01,470 --> 00:15:02,800
Det er alle punkter.

340
00:15:02,800 --> 00:15:09,140
>> Jeg kan også velge å krysse av en
alternativknappen eller krysse av i en avkrysningsboks.

341
00:15:09,140 --> 00:15:10,420
Eller jeg kunne sende inn skjemaet.

342
00:15:10,420 --> 00:15:11,810
Og jeg gjorde ikke noe,
så når jeg sender min form,

343
00:15:11,810 --> 00:15:13,090
siden oppdateres.

344
00:15:13,090 --> 00:15:16,970
Men jeg kunne kanskje konfigurere min
Send-knappen for å gjøre noe annet.

345
00:15:16,970 --> 00:15:20,410
Og vi får se hva vi kan gjøre med
at i en fremtidig video på PHP.

346
00:15:20,410 --> 00:15:22,520
Men dette bygger en veldig
enkelt skjema som vi

347
00:15:22,520 --> 00:15:27,360
kan bruke til å ha brukere kommuniserer og
sende inn informasjon til vår hjemmeside.

348
00:15:27,360 --> 00:15:29,620
>> En siste kommentar før vi
gå videre til noen andre koder

349
00:15:29,620 --> 00:15:32,040
er å ta en titt på denne
inngang tag en gang til.

350
00:15:32,040 --> 00:15:35,760
Legg merke til at jeg har fremhevet
endene av tag i rødt.

351
00:15:35,760 --> 00:15:39,390
Annenhver tag vi har sett så langt har
hadde en begynnelse og en ende, en åpning

352
00:15:39,390 --> 00:15:41,030
tag og en avsluttende koden.

353
00:15:41,030 --> 00:15:42,520
>> Men en inngang tag ikke.

354
00:15:42,520 --> 00:15:46,860
Det er ingen tekst som går
i mellom inngangs koder.

355
00:15:46,860 --> 00:15:49,160
All informasjonen
vi har tenkt å formidle

356
00:15:49,160 --> 00:15:52,640
er forbundet som en del av
attributter av at innspill.

357
00:15:52,640 --> 00:15:54,690
Merker vi ha innspill navn lik x.

358
00:15:54,690 --> 00:15:55,580
Type er lik y.

359
00:15:55,580 --> 00:15:57,660
Det er egentlig alt
informasjonen vi trenger.

360
00:15:57,660 --> 00:15:59,470
>> Dette kalles en selvlukkende tag.

361
00:15:59,470 --> 00:16:02,470
Det krever ikke en åpning og en
lukke fordi all informasjon

362
00:16:02,470 --> 00:16:04,974
finnes inne i
tag og dets attributter.

363
00:16:04,974 --> 00:16:06,390
Så noen ganger vil du se dette også.

364
00:16:06,390 --> 00:16:10,400
Så bare vær oppmerksom på at hvis du har en
tag som er helt selvforsynt,

365
00:16:10,400 --> 00:16:14,170
den åpner og lukker seg med
den åpne vinkel braketten til venstre

366
00:16:14,170 --> 00:16:17,000
og skråstreken vinkel
braketten til høyre.

367
00:16:17,000 --> 00:16:20,580
Vi får se en annen av de
akkurat nå med bilde koder også.

368
00:16:20,580 --> 00:16:23,300
>> Før vi snakker om bilder, vi
trenger å snakke om hyperkoblinger.

369
00:16:23,300 --> 00:16:26,080
Hvis vi ønsker vår nettside for å være
interaktiv og bevege oss rundt,

370
00:16:26,080 --> 00:16:28,121
det ville være hyggelig å kunne
til å klikke på en av disse

371
00:16:28,121 --> 00:16:30,190
hva har typisk vært en blå link.

372
00:16:30,190 --> 00:16:34,440
Dette er faktisk hvordan vi bygger
en hyperkobling i vår nettside.

373
00:16:34,440 --> 00:16:36,540
Og interessant nok
det er en annen HTML-koden

374
00:16:36,540 --> 00:16:39,000
kalt link, som ikke er en hyperkobling.

375
00:16:39,000 --> 00:16:44,130
En her står for anker, og
det er hvordan vi viser en hyperkobling.

376
00:16:44,130 --> 00:16:49,150
>> A href lik x del gå til
nettside X. Og alt

377
00:16:49,150 --> 00:16:51,580
mellom den åpne A tag
og den nære En kode

378
00:16:51,580 --> 00:16:56,010
er hva som kommer til å være at understreket
blå tekst som ser ut som en link

379
00:16:56,010 --> 00:16:57,590
at vi er kjent med.

380
00:16:57,590 --> 00:17:01,660
Nedenfor at vi har en bildekode, som
er en selvlukkende tag for visning

381
00:17:01,660 --> 00:17:05,599
et bilde som ligger på X. Og
du kan være i stand til å endre

382
00:17:05,599 --> 00:17:08,280
det bildet ved å angi
bredde og høyde

383
00:17:08,280 --> 00:17:11,640
og andre attributter i
at dot dot dot der.

384
00:17:11,640 --> 00:17:14,260
>> Helt nederst her
vi har en veldig interessant

385
00:17:14,260 --> 00:17:16,170
ser tag som ikke
har en avsluttende koden.

386
00:17:16,170 --> 00:17:19,410
Det er utropstegn DOCTYPE HTML.

387
00:17:19,410 --> 00:17:23,300
Så HTML har eksistert siden
begynnelsen av 1990 for å bygge websider,

388
00:17:23,300 --> 00:17:25,859
og det har gått gjennomgått
flere revisjoner siden da.

389
00:17:25,859 --> 00:17:28,550
Senest i 2014
det gjennomgikk en revisjon

390
00:17:28,550 --> 00:17:33,440
kalles HTML5 som nå er gjeldende
slags de facto HTML-standarden.

391
00:17:33,440 --> 00:17:36,730
>> For å vise at vår web
Sidene er skrevet med HTML5,

392
00:17:36,730 --> 00:17:38,160
dette er hvordan vi begynne.

393
00:17:38,160 --> 00:17:40,380
Det kan utelates, men
hva som i utgangspunktet

394
00:17:40,380 --> 00:17:45,930
betyr er at du kan ikke bruke noen av kodene
som er HTML5-koder, de nye kodene.

395
00:17:45,930 --> 00:17:48,591
Så vi alltid begynne
hvis vi bruker HTML5.

396
00:17:48,591 --> 00:17:51,340
Og alle kodene vi har snakket om
tidligere er ikke HTML5-koder.

397
00:17:51,340 --> 00:17:55,470
Men dette skulle tilsi at
HTML5-koder vil være til stede.

398
00:17:55,470 --> 00:17:58,400
Og så har vi utrops
DOCTYPE HTML, som

399
00:17:58,400 --> 00:18:01,280
er helt i begynnelsen av vår
HTML-fil, og deretter etter at punktet

400
00:18:01,280 --> 00:18:04,930
vi faktisk har vår HTML åpen
tagge og gå videre derfra.

401
00:18:04,930 --> 00:18:10,050
>> Den siste er en kommentar tag,
som ser litt annerledes, også.

402
00:18:10,050 --> 00:18:12,810
Det starter med vinkel
brakett utrops dash

403
00:18:12,810 --> 00:18:15,220
dash men ingen avsluttende brakett.

404
00:18:15,220 --> 00:18:20,150
I mellom disse to elementene der
er der du skrive dine kommentarer.

405
00:18:20,150 --> 00:18:28,420
Og la oss ta en titt på bildene
og kommentarer og lenker i CS50 IDE.

406
00:18:28,420 --> 00:18:32,850
>> Så jeg har her en fil som heter image link
dot HTML som jeg kommer til å åpne opp.

407
00:18:32,850 --> 00:18:36,420
Og legg merke til jeg har fått et par
kommentarer her i mine HTML kommentarer.

408
00:18:36,420 --> 00:18:38,990
Så akkurat som i C og andre
programmeringsspråk,

409
00:18:38,990 --> 00:18:43,169
HTML bare ved å være et kodespråk
har muligheten til å ha kommentarer.

410
00:18:43,169 --> 00:18:45,710
Og så jeg tilsynelatende kommer til å
plassere et bilde av Rick Astley

411
00:18:45,710 --> 00:18:49,060
et sted mellom dette div
tag, dette vilkårlig divisjon.

412
00:18:49,060 --> 00:18:51,497
Tilsynelatende at filen er
ligger på Rick dot JPEG, som

413
00:18:51,497 --> 00:18:53,580
hvis vi hodet tilbake over til
filen min treet for en andre,

414
00:18:53,580 --> 00:18:55,490
er en fil som finnes i
gjeldende katalog.

415
00:18:55,490 --> 00:18:56,031
Så det er OK.

416
00:18:56,031 --> 00:18:57,710
Jeg kan referere til den.

417
00:18:57,710 --> 00:18:59,680
>> Da kan jeg ha interne lenker.

418
00:18:59,680 --> 00:19:05,080
Så oppdager on line 11 her
min href er hallo dot HTML.

419
00:19:05,080 --> 00:19:09,050
Slik at bare refererer til hei dot HTML
som eksisterer i den gjeldende katalogen.

420
00:19:09,050 --> 00:19:12,980
Og jeg kan også ha ekstern
forbindelser med bare spesifisere HTTPS

421
00:19:12,980 --> 00:19:16,180
for å vise at jeg ikke snakker
om en fil i min nåværende katalog.

422
00:19:16,180 --> 00:19:19,730
Jeg snakker om en fil som eksisterer
et sted på internett, som jeg har

423
00:19:19,730 --> 00:19:23,370
til å be om hjelp av HTTP-protokollen.

424
00:19:23,370 --> 00:19:25,990
>> Så la oss ta en titt på hva
denne siden kan se ut

425
00:19:25,990 --> 00:19:29,500
og gjør deg klar for et bilde av Rick
Astley å dukke opp på skjermen din.

426
00:19:29,500 --> 00:19:31,490
Så jeg skal forhåndsvise dette.

427
00:19:31,490 --> 00:19:33,800
Det er Rick Astley på
Helt øverst i denne vilkårlig

428
00:19:33,800 --> 00:19:35,008
divisjonen jeg satte den på toppen.

429
00:19:35,008 --> 00:19:36,960
Og deretter ned nedenfor jeg
har mine lenker, ikke sant?

430
00:19:36,960 --> 00:19:39,330
>> Jeg har en link til hei dot HTML.

431
00:19:39,330 --> 00:19:42,860
Og hvis jeg klikker det, får jeg
flyttet over til denne siden

432
00:19:42,860 --> 00:19:47,050
at vi er godt kjent med fra
Helt i begynnelsen av programmet vårt.

433
00:19:47,050 --> 00:19:50,880
Hvis jeg pop som siden åpen igjen, hvis jeg
pop image link åpne en gang til,

434
00:19:50,880 --> 00:19:54,420
Jeg kan også gå eksternt
til CS50 hjemmeside.

435
00:19:54,420 --> 00:19:56,740
Og der vi see-- jeg skal
zoome ut litt her--

436
00:19:56,740 --> 00:20:00,260
vi får se CS50 hjemmeside slags
innebygd i midten av vår side.

437
00:20:00,260 --> 00:20:04,670
Så var jeg i stand til å gjøre en intern
lenker samt en ekstern lenke.

438
00:20:04,670 --> 00:20:07,200
>> Den siste regelen med HTML som
vi skal snakke om her

439
00:20:07,200 --> 00:20:09,510
er at HTML skal være godt utformet.

440
00:20:09,510 --> 00:20:13,020
I C snakket vi mye om
de ulike syntaksen til ting.

441
00:20:13,020 --> 00:20:17,650
I HTML syntaksen virkelig
dreier seg om koder.

442
00:20:17,650 --> 00:20:19,660
Hver tag du åpner må være lukket.

443
00:20:19,660 --> 00:20:22,630
Og faktisk, hver tag du åpner
bør lukkes i omvendt rekkefølge.

444
00:20:22,630 --> 00:20:25,790
>> Så hvis du åpner en fet tag, en kursiv
tag, og deretter en understreking tag

445
00:20:25,790 --> 00:20:28,120
å gjøre alle tre til en
bestemt sett av tekst,

446
00:20:28,120 --> 00:20:30,070
du bør lukke dem i omvendt rekkefølge.

447
00:20:30,070 --> 00:20:32,270
Så hvis du åpnet fet,
kursiv, understreking, du

448
00:20:32,270 --> 00:20:35,240
ønsker å lukke understreking, kursiv, fet.

449
00:20:35,240 --> 00:20:39,990
Denne typen innkapsling er hva
holder HTML fin og organisert.

450
00:20:39,990 --> 00:20:44,370
>> I motsetning til C, men syntaksfeil vil ikke
faktisk krøpling HTML muligens.

451
00:20:44,370 --> 00:20:48,730
HTML kanskje ikke godt
dannet, men vil fortsatt fungere.

452
00:20:48,730 --> 00:20:50,589
Og så disse feilene
kan sortere på lysbildet ved.

453
00:20:50,589 --> 00:20:52,130
Det er opp til deg å virkelig være årvåken.

454
00:20:52,130 --> 00:20:54,760
Noen ganger vil de mislykkes, men
noen ganger kan du komme unna med det.

455
00:20:54,760 --> 00:20:56,509
>> Det kan være en virkelig
vanskelig oppgave, men

456
00:20:56,509 --> 00:21:00,660
å holde styr på når du åpnet
en tag, når du lukket den,

457
00:21:00,660 --> 00:21:04,110
spesielt som HTML
filene blir større og større.

458
00:21:04,110 --> 00:21:05,490
Du vil ha litt hjelp.

459
00:21:05,490 --> 00:21:07,560
Og det er online
validator verktøy som du

460
00:21:07,560 --> 00:21:11,474
kan bruke til å ta en titt på nettsiden din
side og se om det er godt formet HTML.

461
00:21:11,474 --> 00:21:13,390
Og du bør definitivt
ta en titt på de

462
00:21:13,390 --> 00:21:16,620
og begynne å bruke dem som du
begynne å gjøre noe arbeid med HTML,

463
00:21:16,620 --> 00:21:20,800
skrive HTML, bare så du får
noen gode vaner om organisering

464
00:21:20,800 --> 00:21:24,377
HTML på en god måte og
god stil og gjør at

465
00:21:24,377 --> 00:21:27,210
at du ikke gjør noe som
kunne skape en syntaksfeil som

466
00:21:27,210 --> 00:21:30,270
ville føre deg litt
et problem nedover veien.

467
00:21:30,270 --> 00:21:31,190
>> Jeg er Doug Lloyd.

468
00:21:31,190 --> 00:21:33,450
Dette er CS50.

469
00:21:33,450 --> 00:21:34,859