1
00:00:00,000 --> 00:00:03,486
>> [MÜZİK OYUN]

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

3
00:00:10,460 --> 00:00:14,250
>> David J MALAN Bu CS50 ve
Bu haftanın 7 başlangıcıdır.

4
00:00:14,250 --> 00:00:15,060
Yani tekrar hoş geldiniz.

5
00:00:15,060 --> 00:00:17,540
Ve bunu Hatırlayacağınız
probleminde, dört set

6
00:00:17,540 --> 00:00:21,510
Bir çöpçü avı biraz oldu
bazı muhteşem ödüller sayede için

7
00:00:21,510 --> 00:00:24,219
Eğer fotoğrafları kurtarmak sonra
hem burada hem de New Haven personel,

8
00:00:24,219 --> 00:00:27,468
Eğer gibi birçok bulmak için meydan vardı
Eğer geldiğince bu bilgisayar bilim adamları.

9
00:00:27,468 --> 00:00:29,550
Ve biz bir bütün var
gönderimler demet.

10
00:00:29,550 --> 00:00:31,930
Birkaç paylaşmak istiyorum düşündüm
Bugün burada sizlerle.

11
00:00:31,930 --> 00:00:35,100
>> Ve biz çevrimiçi tüm bunları yayınlayacağız.

12
00:00:35,100 --> 00:00:39,310
Ama özellikle ben istedim
kuyunun biri ki-- dikkatinizi çekmek,

13
00:00:39,310 --> 00:00:42,670
Sam onları epeyce oldu
Genellikle böyle poz.

14
00:00:42,670 --> 00:00:45,750
Ama itibarıyla anlaşılmaktadır
Bu sabah, kazanan

15
00:00:45,750 --> 00:00:51,170
Belirli bir kimse ile Ken seçildi
Personelin 24 kamera ile çekilen

16
00:00:51,170 --> 00:00:54,600
içine çekerken daha fazla veya birkaç
resimlerde birden personel oluşturmaktadır.

17
00:00:54,600 --> 00:00:58,300
Resimdeki sonraki Ken
New Haven Mary.

18
00:00:58,300 --> 00:01:01,300
>> Şimdi, Ken olsa da, döner
Bir köşe davanın bit

19
00:01:01,300 --> 00:01:02,880
Bu henüz önce oldu değil.

20
00:01:02,880 --> 00:01:05,713
O meydana gelmedi çıkıyor
Bana problem ince baskı koymak

21
00:01:05,713 --> 00:01:09,710
Personel olduğunu söylüyor dört set
Muhteşem ödüller için uygun olmayan

22
00:01:09,710 --> 00:01:13,130
Ken, elbette, tek bir çünkü
Bizim personel fotoğrafçılar.

23
00:01:13,130 --> 00:01:16,820
Şimdi, bunu dedi, o
başlangıçta söylemek bana yazdı

24
00:01:16,820 --> 00:01:19,180
Online bu fotoğrafları göndermek etmeyiniz.

25
00:01:19,180 --> 00:01:21,630
Ben büyük ölçüde düşünüyorum
fotoğrafların çoğu, çünkü

26
00:01:21,630 --> 00:01:24,499
Bu fotoğrafçı bakmak aldı
Böyle küçük bir şey.

27
00:01:24,499 --> 00:01:25,040
Ve benzerleri.

28
00:01:25,040 --> 00:01:28,990
>> Ama Ken sana güvence istiyorum
O çok iyi bir fotoğrafçı olduğunu,

29
00:01:28,990 --> 00:01:33,190
O, o bir profesyonel alır
bulanık olmayan fotoğraflar,

30
00:01:33,190 --> 00:01:37,270
odak daha olduğunu ve o
kendi personelinin epeyce sürdü.

31
00:01:37,270 --> 00:01:40,370
Ama daha çok, sadece daha kabul
Biz yapacağını düşündüğüm ken,

32
00:01:40,370 --> 00:01:43,390
listesinde geçmesi olduğunu
gönderilen gerçek öğrenciler.

33
00:01:43,390 --> 00:01:48,640
Ve o Lance çıkıyor
Bu sabah itibariyle 15 fotoğraf

34
00:01:48,640 --> 00:01:50,030
Bizim galibi oldu.

35
00:01:50,030 --> 00:01:55,730
>> Ve, Lance Colton ile resimdeki
kendimle Skaz, ve Sam ile birlikte.

36
00:01:55,730 --> 00:02:00,230
Ama sonra çıkıyor itibariyle
11:46, biraz önce yani,

37
00:02:00,230 --> 00:02:04,380
Benim e-posta geri döndüm ve bulundu
Henüz bir daha teslim olduğunu

38
00:02:04,380 --> 00:02:08,300
Bonnie adında bir öğrenci tarafından
kimin e-posta sadece bu dedi.

39
00:02:08,300 --> 00:02:10,800
Yalan gitmiyorum, ben
Ders sırasında bunu.

40
00:02:10,800 --> 00:02:17,620
Ve sonra sadece takmak için ilerledi
14 fotoğraf, Lance en 15 utangaç biri.

41
00:02:17,620 --> 00:02:22,690
>> Ama Bonnie fotoğrafları, o döner
dışarı birden personeli, Sam vardı

42
00:02:22,690 --> 00:02:25,960
Aralarında, bu yüzden biz ne düşündüğünü
yapardı Bunların her ikisi de kabul olduğunu.

43
00:02:25,960 --> 00:02:29,240
Böylece Dropbox almaya ek olarak
Uzay o katılan herkes

44
00:02:29,240 --> 00:02:33,900
aldığı, bu iki bölüm de olacak
Onlar için güzel bir yiyecek ve içecek öğle yemeği almak

45
00:02:33,900 --> 00:02:36,100
ve bölüm
önümüzdeki hafta arkadaşlarınla.

46
00:02:36,100 --> 00:02:38,970
Ve böylece bizden duyacaksınız,
Bu konuda Lance ve Bonnie.

47
00:02:38,970 --> 00:02:40,002
Onlara Çok büyük tebrikler.

48
00:02:40,002 --> 00:02:42,210
Şimdi, o sizin kim olur
Öğle yemeği gibi daha genel

49
00:02:42,210 --> 00:02:45,320
Cambridge o CS50 öğle biliyorum
ve New Haven, bu Cuma.

50
00:02:45,320 --> 00:02:48,510
CS50 web sitesini çizgi RSVP gidin.

51
00:02:48,510 --> 00:02:49,800
Ve şimdi seminerler bir kelime.

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

53
00:02:50,730 --> 00:02:52,490
Yani biz yaklaşıyor konum
dönem noktası

54
00:02:52,490 --> 00:02:55,200
Başlamadan nerede
Nihai projeler hakkında düşünme.

55
00:02:55,200 --> 00:02:59,309
Ve aslında, sadece biraz, olacak
Ön teklifler nedeniyle olabilir sözde.

56
00:02:59,309 --> 00:03:01,850
Yani ön teklifler içindir
olması oldukça düşük darbe ve gerçekten

57
00:03:01,850 --> 00:03:04,109
sadece bir fırsat
Eğer kısa bir not oluşturmak için

58
00:03:04,109 --> 00:03:06,900
öğretme adam iletmek için
Onu ya da onu size ne düşündüğünüzü

59
00:03:06,900 --> 00:03:09,140
final proje için yapmak isteyebilirsiniz.

60
00:03:09,140 --> 00:03:11,730
>> Şimdi, çok sayıda öğrenci sonuna kadar
yapıyor, web tabanlı projeler son.

61
00:03:11,730 --> 00:03:13,800
Ve tabii ki, biz sadece konum
Bu şimdi geçen hafta

62
00:03:13,800 --> 00:03:15,890
ve web programlama içine dalış ötesinde.

63
00:03:15,890 --> 00:03:18,200
Yani eğer endişe etmeyin
kesinlikle hiçbir fikrim nasıl var

64
00:03:18,200 --> 00:03:21,594
Eğer fikir inşa edeceğini
Eğer kafanızda olabilir.

65
00:03:21,594 --> 00:03:24,510
Bu gerçekten sadece bir zorlama işlevi
düşündüğünü ve konuşurken almak

66
00:03:24,510 --> 00:03:25,650
bu konuda TF ile.

67
00:03:25,650 --> 00:03:28,810
Ama bu size yardımcı, ve
sonuçta nihai projeler,

68
00:03:28,810 --> 00:03:31,750
CS50 bir gelenek olduğunu biliyor
seminerleri sunan.

69
00:03:31,750 --> 00:03:36,084
>> Ve bu eller üzerinde, isteğe bağlıdır
veya fırsatların dayalı ders

70
00:03:36,084 --> 00:03:39,000
olan konular hakkında daha fazla bilgi edinmek için
Tabii en küçük bir yardımcı

71
00:03:39,000 --> 00:03:43,310
izlence, ama yine de harika
materyal final projelerini sürücü.

72
00:03:43,310 --> 00:03:46,840
Ve böylece bu var listesi
Burada New Haven CS50 personel

73
00:03:46,840 --> 00:03:48,600
için ile geldi
iOS hakkında bu yıl

74
00:03:48,600 --> 00:03:50,730
programlama, Android
programlama, oyun geliştirme,

75
00:03:50,730 --> 00:03:54,480
Daha fazla araçlar ve demet
ve diller ve teknikleri.

76
00:03:54,480 --> 00:03:56,780
>> Yani CS50 web sitesinde bir göz atın.

77
00:03:56,780 --> 00:04:00,110
Ve bu arada, siz isterseniz
Bunlardan herhangi gösterdiğiniz ilgi kaydolun

78
00:04:00,110 --> 00:04:02,510
CS50 en eğik çizgi kaydına gidin.

79
00:04:02,510 --> 00:04:05,770
Ve biz o şekilde takip edecek
günler ve uçuş saatleri ve yerleri

80
00:04:05,770 --> 00:04:09,090
ve everything-- çoğu şeyi olacak
olmak akış ve talep üzerine de mevcuttur

81
00:04:09,090 --> 00:04:11,750
Aslında bunu yapamazsınız eğer sonra.

82
00:04:11,750 --> 00:04:15,800
Bu yüzden daha fazla uzatmadan, biz
GET ile son kez kapalı bıraktı.

83
00:04:15,800 --> 00:04:19,610
>> Ve bu oldu mesajı gibi oldu
Sanal zarf içinde, hatırlama,

84
00:04:19,610 --> 00:04:23,960
biz yönlendirici router dan geçti
Bir web tarayıcısında bir web arasındaki yönlendirici

85
00:04:23,960 --> 00:04:24,487
Sunucu.

86
00:04:24,487 --> 00:04:26,695
Ve bu mesaj baktı
Böyle küçük bir şey.

87
00:04:26,695 --> 00:04:29,700
Bu daha gizemli mesaj olduğunu
Zarfın içinde aslında

88
00:04:29,700 --> 00:04:34,440
kimin kağıt parçasına yazılı
İlk satır, kelimenin tam anlamıyla eğik çizgi olsun diyor.

89
00:04:34,440 --> 00:04:37,830
>> Ve sadece bir sağlamlık denetimi olarak,
çizgi ne ifade mi?

90
00:04:37,830 --> 00:04:40,455
Çizgi ne zaman ne anlama geliyor
Bir web sitesi talebinde?

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

92
00:04:43,070 --> 00:04:44,250
Sen her zaman isteyin.

93
00:04:44,250 --> 00:04:47,333
Çoğu zaman herhangi bir web sitesini ziyaret ettiğinizde,
aslında bir dosya adı yazmayın.

94
00:04:47,333 --> 00:04:50,960
Muhtemelen sadece Facebook.com gitmek
, gmail.com veya benzeri girin.

95
00:04:50,960 --> 00:04:52,260
Ve çizgi neyi temsil ediyor?

96
00:04:52,260 --> 00:04:53,506
Hangi dosya?

97
00:04:53,506 --> 00:04:54,630
Özellikle Ya sayfa?

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

99
00:04:59,642 --> 00:05:00,720
>> Endeks, evet.

100
00:05:00,720 --> 00:05:01,810
Varsayılan sayfasında Yani.

101
00:05:01,810 --> 00:05:04,810
Bir dosyayı belirtmek yoksa yüzden
Biz görmeye başlarsınız olarak adlandırın

102
00:05:04,810 --> 00:05:07,750
aslında sadece istekte ediyoruz
Bana Facebook varsayılan sayfayı vermek

103
00:05:07,750 --> 00:05:10,800
ya bana gelen kutunuzu verebilir veya vermek
Bana haber varsayılan sayfası

104
00:05:10,800 --> 00:05:12,510
CNN web sitesi veya benzeri üzerinde.

105
00:05:12,510 --> 00:05:15,220
Ve bir sunucu daha sonra yanıt
şey ile mesaj

106
00:05:15,220 --> 00:05:18,420
Bu gibi ben, evet diyerek
HTTP 1.1 sürümünü konuşuyoruz.

107
00:05:18,420 --> 00:05:21,130
>> Bir durum olduğunu 200,
biz nadiren insanlarda kod

108
00:05:21,130 --> 00:05:22,790
iyi çünkü hiç görmek.

109
00:05:22,790 --> 00:05:26,640
Tamam, isteği anlamına gelir, çünkü
Alınan ve düzgün bir şekilde gerçekleştirilmektedir.

110
00:05:26,640 --> 00:05:28,960
Ve içerik türü
görünüşe karşılık olarak

111
00:05:28,960 --> 00:05:31,170
sık sık, her zaman olmamakla birlikte, metindir.

112
00:05:31,170 --> 00:05:32,580
Ve özel olarak ise, HTML.

113
00:05:32,580 --> 00:05:34,760
Ve bu aslında
nerede bugün bakıyorum.

114
00:05:34,760 --> 00:05:37,140
>> Yani aslında, ben gidiyorum
önde ve bir tarayıcı açın.

115
00:05:37,140 --> 00:05:40,410
Ben Chrome'u kullanmak için gidiyorum, sen kullanabilirsiniz
hafta içinde herhangi bir tarayıcıyı en gelmek.

116
00:05:40,410 --> 00:05:42,410
Biz genellikle Chrome'u tavsiye
özellikle çünkü

117
00:05:42,410 --> 00:05:43,750
yazılım geliştiriciler için iyi.

118
00:05:43,750 --> 00:05:46,070
Yerleşik bir sürü var
kolaylaştırmak araçları

119
00:05:46,070 --> 00:05:49,800
HTML ve CSS sadece geliştirmek için,
bugün bahsediyoruz başlayacağız şeyler,

120
00:05:49,800 --> 00:05:51,530
ama aynı zamanda diğer dillerde de.

121
00:05:51,530 --> 00:05:55,530
>> Ve ben devam edin ve Şeye gitmek için gidiyorum
Ben tık veya sağ Denetim gidiyorum

122
00:05:55,530 --> 00:05:57,210
Bir web sayfasında herhangi bir yere tıklayın.

123
00:05:57,210 --> 00:05:59,070
Ve ben Elemanı kontrol edin gitmek için gidiyorum.

124
00:05:59,070 --> 00:06:03,850
Ve ben çimdik gidiyorum benim
Burada ekran biraz.

125
00:06:03,850 --> 00:06:05,790
Beni altına bu geçelim.

126
00:06:05,790 --> 00:06:08,140
Peki bu ne denir olduğunu
Chrome'un Müfettiş.

127
00:06:08,140 --> 00:06:11,010
Yani bu bir hata ayıklama gibi
aracı Chrome yerleşik.

128
00:06:11,010 --> 00:06:13,520
>> Hepiniz zaten bu var
Chrome'u kullanıyorsanız oldum.

129
00:06:13,520 --> 00:06:17,169
Ve bu ne olup bittiğini görmek için izin verir
Bazı web sayfasının başlık altında üzerinde.

130
00:06:17,169 --> 00:06:19,210
Yani aslında bir alalım
aşağıdaki gibi şuna bak.

131
00:06:19,210 --> 00:06:21,251
Bu şekilde fazla özelliklere sahiptir
ve bugün umurumda.

132
00:06:21,251 --> 00:06:22,760
Ama burada üzerinde bu sekmeleri var.

133
00:06:22,760 --> 00:06:25,890
Elementler, ağ, kaynaklar,
zaman çizelgesi ve diğer bazı şeyler.

134
00:06:25,890 --> 00:06:27,800
Ben tıklayınız gidiyorum
Bir an için Ağ.

135
00:06:27,800 --> 00:06:30,500
>> Ve bu biraz bunaltıcı
Burada ilk bakışta.

136
00:06:30,500 --> 00:06:34,190
Ama ne yapacağım let
Bana bunun biraz basitleştirmek.

137
00:06:34,190 --> 00:06:37,560
Ben açmak için gidiyorum
Kırmızı olduğunu böylece ışık kayıt.

138
00:06:37,560 --> 00:06:39,140
Ve ben günlüğü korumak söylemek için gidiyorum.

139
00:06:39,140 --> 00:06:41,015
Ve bu sadece biraz
şey anladım

140
00:06:41,015 --> 00:06:44,120
zamanla bu kurtarmak için gidiyor
tarayıcıda olur her şey.

141
00:06:44,120 --> 00:06:50,030
Ve şimdi ben gidiyorum
http://facebook.com için.

142
00:06:50,030 --> 00:06:52,690
>> Aslında, en www yapalım
iyi ölçmek için, eğik çizgi.

143
00:06:52,690 --> 00:06:53,643
Girin.

144
00:06:53,643 --> 00:06:56,180
Yani bir URL birçok
Eğer ziyaret olabilir.

145
00:06:56,180 --> 00:06:58,830
Ve şimdi Facebook'un web
Sayfanın üstündeki çıkageldi.

146
00:06:58,830 --> 00:07:02,350
Ve sonra bir sürü
şeyler dibinde uçtu.

147
00:07:02,350 --> 00:07:04,830
Ve aslında, bu çıkıyor
Eğer Facebook.com ziyaret ettiğinizde,

148
00:07:04,830 --> 00:07:09,320
Sadece, tek HTTP isteği yapmıyoruz
o Facebook.com gidiş çıkıyor

149
00:07:09,320 --> 00:07:14,320
bu zarfların 41 gönderir
Kendi isteği olsun, her biri

150
00:07:14,320 --> 00:07:18,360
ekranın arkasında olsa belirtildiği gibi
Burada, ekranın altındaki,

151
00:07:18,360 --> 00:07:24,040
o, gerçekten, belirtir benim
Tarayıcı 41 isteklerini yaptı.

152
00:07:24,040 --> 00:07:29,689
>> Ve toplam, o 861 transfer
kilobayt ve nedense aldı

153
00:07:29,689 --> 00:07:31,730
çok sekiz saniye
bunların hepsi indirmek için.

154
00:07:31,730 --> 00:07:33,790
Yani aslında biraz garip
Facebook'un site bu alacağını

155
00:07:33,790 --> 00:07:35,600
Uzun, ancak bu, bu durumda olsun.

156
00:07:35,600 --> 00:07:39,520
Şimdi, bütün bu gerçekten umurumda değil
En üstteki istek haricinde hakkında.

157
00:07:39,520 --> 00:07:46,440
Yani burada bu bir gidelim
ve bana sadece bir an için uzaklaştırma edelim.

158
00:07:46,440 --> 00:07:47,754
>> Ve bana bu yakınlaştırmak edelim.

159
00:07:47,754 --> 00:07:50,670
Ben bile solda yaptık Peki
Buraya oluyor çok şey var

160
00:07:50,670 --> 00:07:53,360
Ben vurguladık olduğunu
Facebook.com ve daha sonra

161
00:07:53,360 --> 00:07:56,540
Ben aşağı kaydırma ediyorum fark
aşağı kaydırma aşağı kaydırma,

162
00:07:56,540 --> 00:07:58,330
başlıkları istemek için.

163
00:07:58,330 --> 00:08:01,720
Ve Chrome gösteriyor görürsünüz
Beni esas iç içerikleri

164
00:08:01,720 --> 00:08:02,810
isteğe I yaptı.

165
00:08:02,810 --> 00:08:06,130
Oldukça aynı biçimlendirme değil
yol, ama olsun dendiği var fark,

166
00:08:06,130 --> 00:08:09,481
, konağın söz var fark
Facebook.com, yol veya eğik,

167
00:08:09,481 --> 00:08:10,730
hangi ı istenen dosyadır.

168
00:08:10,730 --> 00:08:12,930
>> Ve sonra ben kaydırma eğer
yedeklemek, biz aslında edeceğiz

169
00:08:12,930 --> 00:08:17,270
bkz Facebook döndü şey bu
Bana bu başlıkların hepsi bu.

170
00:08:17,270 --> 00:08:21,040
Bu sanal zarf içinde çok
Gerçekten anahtar değer çiftleri bir yeri vardır.

171
00:08:21,040 --> 00:08:23,130
Bir kelime, bir kolon ve ardından bir değer.

172
00:08:23,130 --> 00:08:25,050
Bir kelime, bir kolon ve bir değer.

173
00:08:25,050 --> 00:08:26,160
Bunlar denilen başlıklar bulunmaktadır.

174
00:08:26,160 --> 00:08:31,860
Ve yol daha ayrıntılı burada daha var
biz aslında şu an umurumda.

175
00:08:31,860 --> 00:08:33,750
>> Ama bu ikinci
Orada sonuncusu,

176
00:08:33,750 --> 00:08:38,809
fark facebook.com sunucusuna ki
Gerçekten burada bahsedilen bazı metin HTML geliyor.

177
00:08:38,809 --> 00:08:41,409
Yani tüm bu demek ki
Eğer bir web isteği o zaman

178
00:08:41,409 --> 00:08:44,300
Bir bir tarayıcıdan sayfa
Sunucu, sunucu yanıt

179
00:08:44,300 --> 00:08:47,630
kendi bir zarf ile
bunların içinde metindir.

180
00:08:47,630 --> 00:08:49,020
Diğer bir deyişle, HTML.

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

182
00:08:50,590 --> 00:08:53,200
Başka hangi dildir
Bugün tanıtmak

183
00:08:53,200 --> 00:08:57,740
İnsanlar ya da bilgisayarların oluşturmak olduğunu
sırayla web sayfalarını uygulamak.

184
00:08:57,740 --> 00:08:59,580
>> Özellikle, en bu bakalım.

185
00:08:59,580 --> 00:09:03,277
Ben şimdi geri dönmek için gidiyorum
Facebook'un web sitesine.

186
00:09:03,277 --> 00:09:05,360
Ve ben gidiyorum sadece
kontrol tıklayın veya sağ tıklayıp

187
00:09:05,360 --> 00:09:07,634
ve Görünüm Page Kaynak tıklayın.

188
00:09:07,634 --> 00:09:10,550
Ve Chrome'u kullandığınızda bile,
IE Bu, Firefox bunu yapabilirsiniz yapabiliriz,

189
00:09:10,550 --> 00:09:14,060
Safari bile menü olsa, bunu yapabilirsiniz
seçenekler biraz farklı görünebilir.

190
00:09:14,060 --> 00:09:18,990
Ve bu HTML olduğunu Mark ve
Facebook da şirket yazdım.

191
00:09:18,990 --> 00:09:24,640
>> Ve topluca bu dil burada
mavi ve beyaz sayfayı uygular

192
00:09:24,640 --> 00:09:26,370
biz bir an önce gördüm.

193
00:09:26,370 --> 00:09:28,030
Şimdi, bu biraz ezici.

194
00:09:28,030 --> 00:09:31,400
Biz sol üst kısmında yukarıya bakarsanız Ama biz konum
Bazı desenleri görmek için başlayacağım.

195
00:09:31,400 --> 00:09:34,140
Bir çok şey var gibi görünüyor
Bu açık açılı braket

196
00:09:34,140 --> 00:09:35,970
ve daha sonra bu kelime HTML var.

197
00:09:35,970 --> 00:09:38,330
İşte başka bir açık var
açılı ayraç ve başkanı.

198
00:09:38,330 --> 00:09:41,560
>> Biz aşağı kaydırma burada olduğunu
ve aşağı ve aşağı, ben

199
00:09:41,560 --> 00:09:43,820
go ahead ve denemek için gidiyoruz
bir şey aramak için.

200
00:09:43,820 --> 00:09:48,510
Orada yol üzerinde sağ tarafta
Burada açık braket organıdır.

201
00:09:48,510 --> 00:09:50,800
Ve son olarak hatırlayacaksınız
Biz önerilen zaman

202
00:09:50,800 --> 00:09:53,364
En basit bir web sayfası olduğunu
İnsan yazmak olabilir

203
00:09:53,364 --> 00:09:55,030
Böyle küçük bir şey görünebilir.

204
00:09:55,030 --> 00:09:58,430
Açık HTML etiketi açık kafa
etiket, açık başlık etiketi,

205
00:09:58,430 --> 00:10:03,230
Daha sonra kapalı başlık, kapalı kafa, açık
body etiketi, bazı metin, vücudu kapalı

206
00:10:03,230 --> 00:10:04,720
Kapalı HTML.

207
00:10:04,720 --> 00:10:06,290
>> Ama sadece bir an için burada bir duraklama.

208
00:10:06,290 --> 00:10:09,030
Bu kod, sen ettik bile
önce yazılı hiç

209
00:10:09,030 --> 00:10:11,864
ama yine de oldukça anlamıyorum
Neler oldukça iyi görünüyor.

210
00:10:11,864 --> 00:10:12,821
Doğru, çok temiz.

211
00:10:12,821 --> 00:10:14,120
Çok biçimsel güzel.

212
00:10:14,120 --> 00:10:16,190
Girinti ve beyaz alan bir sürü.

213
00:10:16,190 --> 00:10:18,020
Facebook'un değil.

214
00:10:18,020 --> 00:10:23,190
Peki neden Facebook kadar çok olduğunu
HTML yazma benden daha kötü?

215
00:10:23,190 --> 00:10:24,310
Görünüşe göre.

216
00:10:24,310 --> 00:10:26,899
>> Doğru, bu gibi bir
stil için beş üzerinden.

217
00:10:26,899 --> 00:10:29,315
Zorlayıcı bir nedeni var
Onlar için bu köşeleri kesmek için.

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

219
00:10:31,069 --> 00:10:33,860
Pekâlâ, bu yüzden istemiyorum
daha kolay okumak için yapmak.

220
00:10:33,860 --> 00:10:36,940
Yani bir anlamda, onlar
Bunu obfuscating, gerisini çabalıyorlar

221
00:10:36,940 --> 00:10:40,260
En azından estetik yani
o Myspace için zor olduğunu

222
00:10:40,260 --> 00:10:42,705
gidip rip onların
anasayfa ve bunun için HTML.

223
00:10:42,705 --> 00:10:45,080
Bu programlarla çıkıyor
Chrome da dahil olmak üzere olsa da,

224
00:10:45,080 --> 00:10:47,020
süper kolayca temizleyebilirsiniz.

225
00:10:47,020 --> 00:10:49,420
Bu yüzden gerekçe olarak değil tamamen bu.

226
00:10:49,420 --> 00:10:51,290
Başka ne nedeni olabilir.

227
00:10:51,290 --> 00:10:51,790
Evet.

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

229
00:10:54,680 --> 00:10:55,890
Evet, beyaz boşluk maliyetleri verileri.

230
00:10:55,890 --> 00:10:56,598
Ne demek istiyorsun?

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

232
00:11:02,250 --> 00:11:02,979
Evet, kesinlikle.

233
00:11:02,979 --> 00:11:06,020
Sekme tuşunu çok ya vurursanız
space bar, sonuçlarını düşünün.

234
00:11:06,020 --> 00:11:10,060
Yani klavyede her tuşu bir olduğunu
[Duyulamaz] bir bayt olarak temsil etti.

235
00:11:10,060 --> 00:11:14,560
>> Yani varsayalım o İşaretle veya devs herhangi
bu gün sadece bir kez ara çubuğuna vurur

236
00:11:14,560 --> 00:11:17,899
Bu HTML sayfası olduğunu
Facebook'un ana temsil eder.

237
00:11:17,899 --> 00:11:19,690
Ve Facebook bir yeri vardır
Kullanıcıların bu gün.

238
00:11:19,690 --> 00:11:24,030
Yani varsayalım o Facebook'un anasayfa
Bugün bir milyar kişi tarafından ziyaret edilmektedir.

239
00:11:24,030 --> 00:11:27,020
Ve Facebook birileri vardır
sadece bir kez boşluk tuşuna basın.

240
00:11:27,020 --> 00:11:29,890
>> Bu nedenle ek bir bayt
Bir milyar istekleri,

241
00:11:29,890 --> 00:11:32,790
ne kadar daha fazla veri Facebook olduğunu
internet üzerinden aktarılması

242
00:11:32,790 --> 00:11:37,160
Birisi vurdu çünkü
onun klavyede boşluk?

243
00:11:37,160 --> 00:11:41,660
Bir milyar bayt veya bir gigabayt
Veri Facebook sunucularından gönderiliyor

244
00:11:41,660 --> 00:11:43,626
çevresindeki insanlara
sebepsiz dünya.

245
00:11:43,626 --> 00:11:44,750
Şimdi, bu sadece bir boşluk var.

246
00:11:44,750 --> 00:11:48,866
>> Biz aslında bu temiz düşünün
şey yukarı ve girintili ve ekledi

247
00:11:48,866 --> 00:11:50,990
beyaz boşluk bir sürü ve
Sekme karakterleri ve boşluk

248
00:11:50,990 --> 00:11:53,656
Eğer harcama gigabayt sonuna kadar,
değilse terra byte alanı daha fazla.

249
00:11:53,656 --> 00:11:56,640
Ve çok süper yaygın
web geliştirme gerçek dünyası

250
00:11:56,640 --> 00:11:58,950
kodunuzu minify etmektir.

251
00:11:58,950 --> 00:12:01,280
Ve biz sonunda göreceğiz
Bunu nasıl.

252
00:12:01,280 --> 00:12:04,630
>> Ama bugün, biz kod yazmaya başlayacağız
Bu bize insanlar tarafından aslında okunabilir.

253
00:12:04,630 --> 00:12:10,120
Eğer geri gitmek eğer, olsa da, çıkıyor
Chrome'da bu aracı, Eleman inceleyin

254
00:12:10,120 --> 00:12:12,030
Daha önce, biz Ağ sekmesinde idi.

255
00:12:12,030 --> 00:12:15,430
Bu giderseniz çıkıyor
gerçekte görünenden elemanları sekmesi,

256
00:12:15,430 --> 00:12:19,230
Chrome'un oldukça yazdırılır
Aynı HTML sürümü.

257
00:12:19,230 --> 00:12:20,640
Yani biz bunu deobfuscated ettik.

258
00:12:20,640 --> 00:12:22,472
Yani bir bilgisayar için hiçbir maç bu.

259
00:12:22,472 --> 00:12:24,430
Ve şimdi gerçekten can
etrafında tıklayın ve başlayın

260
00:12:24,430 --> 00:12:27,630
Bir web sayfası hiyerarşiyi görmek için.

261
00:12:27,630 --> 00:12:28,780
Yani aslında bu yapalım.

262
00:12:28,780 --> 00:12:32,120
Devam edin ve yukarı açacağım
Benim Mac metin düzenleme adında bir program.

263
00:12:32,120 --> 00:12:35,490
Ve bu sadece olduğunu hatırlamak
süper basit bir metin programı.

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

265
00:12:37,490 --> 00:12:39,820
Ve ben kelimesi kelimesine gidiyorum
aşağıdakileri yazın.

266
00:12:39,820 --> 00:12:44,650
Doc tipi HTML, açık dirsek
HTML, dirsek HTML kapalı

267
00:12:44,650 --> 00:12:49,000
Biz burada sayfanın kafası
Burada sayfanın baş ucu,

268
00:12:49,000 --> 00:12:52,310
Bir başlık, merhaba dünya gibi olacak.

269
00:12:52,310 --> 00:12:56,660
>> Ve sonra buraya, ihtiyacımız
Web sayfasının gövde.

270
00:12:56,660 --> 00:12:58,050
Kapalı gövde.

271
00:12:58,050 --> 00:13:00,700
Ve sonra burada, merhaba dünya.

272
00:13:00,700 --> 00:13:01,270
Pekala.

273
00:13:01,270 --> 00:13:03,350
Yani biz bir süper hızlı web sayfası yazdık.

274
00:13:03,350 --> 00:13:06,675
Ben olarak kaydetmek için gidiyorum
benim masaüstünde hello.html.

275
00:13:06,675 --> 00:13:09,050
Benim Mac, şikayet edecek
olduğunu düşünerek, bir dakika bekleyin,

276
00:13:09,050 --> 00:13:11,091
Bu bir metin dosyası, do
Bunu .txt aramak istediğiniz?

277
00:13:11,091 --> 00:13:13,300
Ama hayır, ben nokta HTML kullanmak istiyorum.

278
00:13:13,300 --> 00:13:16,140
>> Ben Ve eğer güzel ne
Sadece bu dosyayı çift tıklayın,

279
00:13:16,140 --> 00:13:18,600
hello.html, burada benim web sayfası.

280
00:13:18,600 --> 00:13:22,564
Ne yazık ki, ben
Dünyada tek kişi

281
00:13:22,564 --> 00:13:23,980
kim şu anda bu sayfayı ziyaret edebilirsiniz.

282
00:13:23,980 --> 00:13:26,734
Nerede görünüşte yaşıyor diye mi?

283
00:13:26,734 --> 00:13:27,650
Benim Mac üzerinde, değil mi?

284
00:13:27,650 --> 00:13:28,470
Hangi işe yaramaz.

285
00:13:28,470 --> 00:13:30,390
Bu odada kimse gibi
internette dursun

286
00:13:30,390 --> 00:13:31,598
Aslında bu sayfayı ziyaret edebilirsiniz.

287
00:13:31,598 --> 00:13:33,820
Yani bugün, gerek
Başka bir unsuru tanıtmak.

288
00:13:33,820 --> 00:13:36,720
>> Ve bunu yapmak için, ben gidiyorum
go ahead ve bulut 9 kadar açık.

289
00:13:36,720 --> 00:13:40,090
Yani bulut 9 ders a ise
bulut tabanlı service-- CS50

290
00:13:40,090 --> 00:13:44,890
IDE-- Bu bizim çalışma alanlarının hepsi var
yerde internet üzerinde çalışan.

291
00:13:44,890 --> 00:13:48,330
Ve bu bizim dosyaların hepsi demektir
Zaten kamuya erişilebilir.

292
00:13:48,330 --> 00:13:49,830
O yüzden go ahead ve bu yapalım.

293
00:13:49,830 --> 00:13:53,670
Ben devam edeceğim ve
yeni bir dosya NCS50IDE oluşturun.

294
00:13:53,670 --> 00:13:58,819
Daha önce olduğu gibi kaydetmek için gidiyorum
ve hello.html olarak kaydetmek tıklayın.

295
00:13:58,819 --> 00:14:01,860
Ve şimdi sadece zaman kazanmak için, ben gidiyorum
Bu kodu yapıştırın go ahead ve kopyalamak

296
00:14:01,860 --> 00:14:03,470
yerine yeniden yazın.

297
00:14:03,470 --> 00:14:04,550
Ve kaydedin.

298
00:14:04,550 --> 00:14:07,550
Ve şimdi ben var
Dosya hello.html çağırdı.

299
00:14:07,550 --> 00:14:09,710
Ama nasıl aslında ben bunu
bir web sayfası olarak açmak?

300
00:14:09,710 --> 00:14:14,120
Peki, CS50 yerleşik çıkıyor
IDE clang gibi sadece bir derleyici değildir

301
00:14:14,120 --> 00:14:16,670
ve GDB gibi bir debugger ve
diğer programlar salkımları,

302
00:14:16,670 --> 00:14:21,140
tam teşekküllü aslında var
CS50 IDE içinde çalışan web sunucusu.

303
00:14:21,140 --> 00:14:23,900
>> Hepiniz, demek ki,
kendi web sunucusu var.

304
00:14:23,900 --> 00:14:26,850
Ve bir web sunucusu sadece bir parça
kimin amacı hayatta yazılım

305
00:14:26,850 --> 00:14:28,220
web sayfalarını hizmet etmektir.

306
00:14:28,220 --> 00:14:32,490
Tarayıcılardan istekleri dinlemek için ve
Biraz sanal zarf ile cevap

307
00:14:32,490 --> 00:14:35,290
iç tarafında olduğu
Ben yazdım içerik.

308
00:14:35,290 --> 00:14:38,372
Yani bu web sunucusu
aslında ücretsiz ve açık kaynak.

309
00:14:38,372 --> 00:14:40,830
Nerede açık kaynak sadece anlamına gelir
başkası sahip yazılım

310
00:14:40,830 --> 00:14:43,480
Yazılı hepimiz olabilir ki
Aslında görmek ve hatta indirebilir ve

311
00:14:43,480 --> 00:14:44,780
kaynak kodunu değiştirmek.

312
00:14:44,780 --> 00:14:46,150
Ve Apache denir.

313
00:14:46,150 --> 00:14:51,450
>> Ve biz biraz daha kolay yaptık
Apache 50 çağırarak CS50IDE kullanmak.

314
00:14:51,450 --> 00:14:53,780
Aslında can Böylece
aşağıdaki anlıyorum.

315
00:14:53,780 --> 00:14:56,560
Apache 50 başlangıç ​​söylemek için gidiyorum.

316
00:14:56,560 --> 00:14:58,910
Ve sonra ben sadece nokta söylemek için gidiyorum.

317
00:14:58,910 --> 00:15:01,080
Ve biz bazı biraz bakın
diyerek gizli mesaj

318
00:15:01,080 --> 00:15:04,640
Apache belge [ayarı? grup?]
ev, ubuntu, yani ne olursa olsun,

319
00:15:04,640 --> 00:15:05,770
Çalışma alanını kesiyorsun.

320
00:15:05,770 --> 00:15:08,280
Başlangıç ​​Web sunucusu
Başarıyla Apache 2.

321
00:15:08,280 --> 00:15:11,330
>> Çok uzun lafın kısası, ben
Sadece bir düğmeye itti

322
00:15:11,330 --> 00:15:18,000
ve şimdi bu bir web sunucusuna açık
TCP bağlantı noktası internette dinleme

323
00:15:18,000 --> 00:15:20,587
Belirli bir adreste 80.

324
00:15:20,587 --> 00:15:22,420
Ve burada diyor ve
Bu dayansın değişecek

325
00:15:22,420 --> 00:15:26,550
Kullanıcı adınız ve diğer faktörlere,
Ben bu tıklarsanız ama şimdi fark

326
00:15:26,550 --> 00:15:30,211
IDE50 nokta jharvard ve benzeri ve
bu yüzden fark tüm bu zaman o

327
00:15:30,211 --> 00:15:31,960
Son birkaç için
hafta, aklınıza gelebilecek

328
00:15:31,960 --> 00:15:35,200
Kendi adınızı fark
Sağ üst tarafta gömülü olduğu

329
00:15:35,200 --> 00:15:37,130
CS50IDE köşesi.

330
00:15:37,130 --> 00:15:41,050
>> Ve aslında olmuştur bu
adresi zaman hangi can at

331
00:15:41,050 --> 00:15:43,574
web üzerinden tüm dosyaları ziyaret edin.

332
00:15:43,574 --> 00:15:45,990
Şimdiye kadar, bu önemi henüz,
C, çünkü genelde

333
00:15:45,990 --> 00:15:48,073
Bir çalışan şeyler istiyorum
Terminal, değil web üzerinde.

334
00:15:48,073 --> 00:15:50,800
Ama bugün, başlangıç
web tabanlı kod yazma

335
00:15:50,800 --> 00:15:53,350
Biz istiyoruz olduğunu
Kamu URL'ler erişilebilir.

336
00:15:53,350 --> 00:15:56,100
Peki ben gidiyorum
yapmak bu URL'yi tıklamak.

337
00:15:56,100 --> 00:16:00,880
>> Ve ben oldukça bkz fark
çirkin endeksi, bir dizin listesi,

338
00:16:00,880 --> 00:16:04,090
ama ne dosya muhtemelen sizin de dışarı atlar?

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

340
00:16:05,210 --> 00:16:07,870
Ben kurtardı, çünkü bu
Benim çalışma alanında dosyayı.

341
00:16:07,870 --> 00:16:12,310
Ve ben Apache web sunucusu söyledim neler
David'in çalışma dizininde bakmak olduğunu.

342
00:16:12,310 --> 00:16:15,300
Ve kimseyi
Dünya bu dosyaları görmek.

343
00:16:15,300 --> 00:16:19,050
>> Ve gerçekten, ben şimdi eğer
hello.html tıklayın

344
00:16:19,050 --> 00:16:22,180
Ben tam da bu sekmede bu dosya içinde görüyoruz.

345
00:16:22,180 --> 00:16:26,430
Şimdi bulut 9'un yapıyor, fark
bizim için biraz yardımcı bir şey.

346
00:16:26,430 --> 00:16:29,480
CS50 IDE içinde, orada olduğunu fark
aniden bir adres çubuğu.

347
00:16:29,480 --> 00:16:33,690
Biz olmalarına rağmen nedeni budur
CS50IDE ziyaret Chrome'u kullanarak,

348
00:16:33,690 --> 00:16:37,940
CS50IDE içinde kendi olduğu
Şu anda bir web tarayıcısı sürümü.

349
00:16:37,940 --> 00:16:40,820
Ve böylece yerine
gibi şeyler karmaşık,

350
00:16:40,820 --> 00:16:42,955
Ben devam edeceğim
ve sadece bu URL'yi kopyalayın.

351
00:16:42,955 --> 00:16:45,330
Ben önde ve sadece gitmek için gidiyorum
Kendi Chrome penceresini açın.

352
00:16:45,330 --> 00:16:47,800
Yani burada hiçbir sihirli, hiçbir CS50IDE var.

353
00:16:47,800 --> 00:16:51,800
Ben sadece tam anlamıyla yapıştırmak için gidiyorum
Benim J Harvard URL ve Enter tuşuna basın.

354
00:16:51,800 --> 00:16:54,750
Ve işte şimdi ben ve
teoride herkes

355
00:16:54,750 --> 00:16:57,700
internet, ben yapılandırılmış ettik
uygun izinleri,

356
00:16:57,700 --> 00:16:58,720
Bu dosyayı ziyaret edebilirsiniz.

357
00:16:58,720 --> 00:17:03,230
Ve şimdi dedim eğer
hello.html, işte orada

358
00:17:03,230 --> 00:17:06,366
Benim inanılmaz underwhelming web sayfası.

359
00:17:06,366 --> 00:17:07,740
Yani hızlı bir sağlamlık denetimi yapalım.

360
00:17:07,740 --> 00:17:09,710
Bütün bunlar nedeniyle
kavramsal kadar kümesidir.

361
00:17:09,710 --> 00:17:13,180
Ve biz gerçekten aslında ettik
nasıl HTML başına yazmayı öğretti.

362
00:17:13,180 --> 00:17:16,084
Herhangi bir sorunuz bugüne kadar
Sadece oldu ne?

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

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

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

366
00:17:24,290 --> 00:17:25,800
CS50 bu web sayfaları kendi mu?

367
00:17:25,800 --> 00:17:26,460
Ne anlamda?

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

369
00:17:28,947 --> 00:17:29,530
İyi soru.

370
00:17:29,530 --> 00:17:32,429
Yani CS50 en CS50.io. sahibi

371
00:17:32,429 --> 00:17:33,970
Biz gerçekten bu etki alanı adını aldım.

372
00:17:33,970 --> 00:17:37,240
Ve çocuklar doğası gereği
CS50IDE giriş,

373
00:17:37,240 --> 00:17:39,270
Eğer tüm alt etki denen olsun.

374
00:17:39,270 --> 00:17:46,840
>> Böylece malan IDE50-veya IDE50-Rob.CS50.io,
Bu içinde benzersiz bir adres var

375
00:17:46,840 --> 00:17:47,730
Bizim alan adı.

376
00:17:47,730 --> 00:17:50,850
Tabii amacıyla Yani
Kendi benzersiz adresi var.

377
00:17:50,850 --> 00:17:55,150
Ama biz tarafından şeyler basitleştirilmiş ettik
Üst düzey etki alanını satın alma CS50 nokta

378
00:17:55,150 --> 00:17:58,050
I / O ve daha sonra herkes bir
Bunun içinde, tabiri caizse.

379
00:17:58,050 --> 00:17:59,890
Ve biz bu geri geleceğiz
Muhtemelen birkaç hafta içinde,

380
00:17:59,890 --> 00:18:01,930
Özellikle son projede
Size zaman zaman bazı

381
00:18:01,930 --> 00:18:03,596
kendi etki alanı adlarını almak isteyebilirsiniz.

382
00:18:03,596 --> 00:18:06,270
Nispeten aslında
basit.

383
00:18:06,270 --> 00:18:06,770
Pekala.

384
00:18:06,770 --> 00:18:07,880
Peki şimdi yapalım.

385
00:18:07,880 --> 00:18:11,910
Ben geri gidiyorum
CS50IDE, nerede dosyayı sağ şimdi,

386
00:18:11,910 --> 00:18:14,710
hello.html, tüm bu ilginç değildir.

387
00:18:14,710 --> 00:18:17,130
Ben bir şey yapmak istiyorum
Bundan biraz daha güzel.

388
00:18:17,130 --> 00:18:19,440
Yani böyle bir şey yapmak için gidiyorum.

389
00:18:19,440 --> 00:18:21,510
Açık paragraphs.html Let me.

390
00:18:21,510 --> 00:18:23,560
Yani bu önceden yazdığım bir dosyadır.

391
00:18:23,560 --> 00:18:26,480
Bunun en üstünde, gibi
Her zaman, biz yorumlarınız.

392
00:18:26,480 --> 00:18:28,730
Ama HTML, yorum
biraz farklı görünüyor.

393
00:18:28,730 --> 00:18:33,270
Hat, üç ve hat 14 üzerinde,
Yorum başlatmak için sözdizimini görmek

394
00:18:33,270 --> 00:18:34,020
ve bir yorum sonlandırın.

395
00:18:34,020 --> 00:18:36,820
>> Ama hiçbiri şeyler de
işlevsel konularda arasında.

396
00:18:36,820 --> 00:18:40,250
Bu sadece bir not var
Burada neler oluyor insan.

397
00:18:40,250 --> 00:18:43,040
Ve sadece hızlı aklı olarak
Ben aşağı kaydırma olmadığını kontrol edin,

398
00:18:43,040 --> 00:18:46,820
bariz Ne yeni
biz sunduk etiketi?

399
00:18:46,820 --> 00:18:52,130
Uzakta gördüğümüz böylece etiketleri açık
braket HTML, head, title ve body.

400
00:18:52,130 --> 00:18:54,400
Ama şimdi belli ki yeni ne var?

401
00:18:54,400 --> 00:18:55,200
>> Evet, s.

402
00:18:55,200 --> 00:18:57,320
P etiketi veya paragraf etiketi.

403
00:18:57,320 --> 00:19:01,182
Ve sonra ben sadece bazı varsayılan ödünç
Latince metin benim paragrafları teşkil etmek.

404
00:19:01,182 --> 00:19:03,390
Ben ne istediğini, çünkü
göstermek nasıl olabilir olduğunu

405
00:19:03,390 --> 00:19:05,859
HTML metin paragraf temsil etmektedir.

406
00:19:05,859 --> 00:19:08,400
Ve daha neler neler ortaya çıkıyor
zaten burada var olduğunu

407
00:19:08,400 --> 00:19:09,657
Bir desen geliştirme.

408
00:19:09,657 --> 00:19:10,990
Ve beni go ahead ve bu yapalım.

409
00:19:10,990 --> 00:19:12,760
Beni ilk Apache kapatın edelim.

410
00:19:12,760 --> 00:19:17,340
Ve ben kendisini başlatmak için bunu söylemek için gidiyorum
Yine bugünün kaynağın yedi içinde

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

412
00:19:18,420 --> 00:19:20,100
Böylece her şeyi erişebilirsiniz.

413
00:19:20,100 --> 00:19:22,230
>> Ve şimdi, ben geri giderseniz
Bu dizin listesi,

414
00:19:22,230 --> 00:19:24,846
Ben bugün her dosyasına bakın dikkat edin.

415
00:19:24,846 --> 00:19:26,720
Ve göreceksiniz
sonraki sorun seti, yaparız

416
00:19:26,720 --> 00:19:28,594
Size talimat vermek
tam bu iş için.

417
00:19:28,594 --> 00:19:35,210
Ben paragraphs.html açarsanız, bu olabilir
hem de bir programlama dili gibi bakmak

418
00:19:35,210 --> 00:19:36,970
Size konuşmak veya Latince okumaz eğer.

419
00:19:36,970 --> 00:19:40,525
Ama bu sadece üç paragraf olduğunu
Metnin bu HTML kadar işaretlenir.

420
00:19:40,525 --> 00:19:43,100
>> Ve paragraf fark
Aralarındaki sonları.

421
00:19:43,100 --> 00:19:46,400
, Çıkıyor, çünkü
ve hatta sizin bile

422
00:19:46,400 --> 00:19:49,210
Bunu yapmak için eğimli olabilir,
gerçek dünyada oysa

423
00:19:49,210 --> 00:19:51,370
Eğer çizgiyi koymak istiyorsanız
şeyler arasında sonları,

424
00:19:51,370 --> 00:19:55,680
Eğer olabilir oldukça basit
Bunu yapmak ve Kaydet çarptı.

425
00:19:55,680 --> 00:19:59,460
Ve şimdi, burada yeniden eğer, haber
her şeyin sadece birlikte bulanıklaştırır

426
00:19:59,460 --> 00:20:01,100
Metnin sadece bir blob.

427
00:20:01,100 --> 00:20:03,570
HTML aptal dil türüdür çünkü.

428
00:20:03,570 --> 00:20:07,230
>> Bu tür kullanılmak üzere tasarlanmıştır
bir yol tarayıcı olacak sadece

429
00:20:07,230 --> 00:20:09,920
açıkça yapmanız bunu söylemek ne.

430
00:20:09,920 --> 00:20:12,890
Eğer söylemezsen Yani
Bana yeni bir paragraf verin

431
00:20:12,890 --> 00:20:14,569
Yeni bir paragrafa bakın gitmiyorsun.

432
00:20:14,569 --> 00:20:16,360
Ve aslında ne
Tarayıcı yapacak

433
00:20:16,360 --> 00:20:20,020
Enter hit bile olduğunu
tekrar tekrar diyelim

434
00:20:20,020 --> 00:20:23,190
ve yine bu metin yolu hareketli
Daha sonra ekranda aşağı tasarruf

435
00:20:23,190 --> 00:20:26,610
ve ardından tarayıcı gidiyor, yeniden
Bu boşluk, tüm çökmeye

436
00:20:26,610 --> 00:20:29,021
Sadece tek bir görünür boşluk içine.

437
00:20:29,021 --> 00:20:29,520
Pekala.

438
00:20:29,520 --> 00:20:30,869
Yani paragraf etiketi.

439
00:20:30,869 --> 00:20:32,910
Ve böylece desen ne
Burada geliştiriyor?

440
00:20:32,910 --> 00:20:37,450
Eh, bu durumda gibi görünüyor
HTML tüm etiket başlayan hakkında

441
00:20:37,450 --> 00:20:38,460
ve bir etiket biten.

442
00:20:38,460 --> 00:20:39,300
Ve bir etiket nedir?

443
00:20:39,300 --> 00:20:41,160
Eh, bu sözdizimi sadece bir yığın var.

444
00:20:41,160 --> 00:20:44,400
Açık aparatı, bir anahtar kelime,
Kapalı aparatı, bir etikettir.

445
00:20:44,400 --> 00:20:45,510
Ya da etiketi başlar.

446
00:20:45,510 --> 00:20:48,590
Ve sonra olduğunuzda
Kendinizi ifade yapılır,

447
00:20:48,590 --> 00:20:52,300
gibi paragrafın ile bitti,
Eğer aksini konuşmak bunu.

448
00:20:52,300 --> 00:20:55,480
Ama tam tersi oldukça geriye değil.

449
00:20:55,480 --> 00:21:00,630
>> Sadece aynı etiket en önek
Böyle bir eğik çizgi ile isim.

450
00:21:00,630 --> 00:21:01,130
Pekala.

451
00:21:01,130 --> 00:21:02,570
Yani tüm bu heyecan verici değil.

452
00:21:02,570 --> 00:21:05,270
Ve aslında, biz yapmıyoruz
Web tüm bu daha ilginç.

453
00:21:05,270 --> 00:21:07,630
Ne yapmak istiyorsanız
Daha büyük ve cesur şeyler?

454
00:21:07,630 --> 00:21:11,780
Yani burada bir örnek çıkıyor
headings.html olarak, nerede bedenimde,

455
00:21:11,780 --> 00:21:17,280
Ben, bir H1 etiketi, H2, H3 var
dört, beş, veya altı, hepsi

456
00:21:17,280 --> 00:21:18,310
Oldukça gizemli görünüyor.

457
00:21:18,310 --> 00:21:21,010
Ama bu açmak gidersem
örnek, hadi bakalım.

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

459
00:21:22,490 --> 00:21:27,030
>> Varsayılan olarak tarayıcılar verebilir Yani metin
o büyük ve farklı boyutlarda kalın değil.

460
00:21:27,030 --> 00:21:28,070
H1 büyük.

461
00:21:28,070 --> 00:21:31,240
H6 sonra daha küçük ve bir
arasındaki her şey.

462
00:21:31,240 --> 00:21:34,170
Yani hala ilginç ama var
gerçekten biliyorum web.

463
00:21:34,170 --> 00:21:36,870
Ne istiyorum ben var
bir liste gibi bir şey. .

464
00:21:36,870 --> 00:21:40,190
Yani burada bir madde işaretli liste var
Harvard'ın evlerin üç.

465
00:21:40,190 --> 00:21:41,600
>> Eğer bunu hakkında nasıl gitti?

466
00:21:41,600 --> 00:21:45,410
Eh, list.html bir göz atın.

467
00:21:45,410 --> 00:21:47,870
Ve burada, biz bakın
Funkiness biraz

468
00:21:47,870 --> 00:21:49,630
ama en Neler düşünelim.

469
00:21:49,630 --> 00:21:56,182
Yani sadece gördüm ne dayanarak,
UL sırasız liste duruyor.

470
00:21:56,182 --> 00:21:57,640
Sırasız liste sadece işaretli demektir.

471
00:21:57,640 --> 00:21:58,431
Hiçbir sayı var.

472
00:21:58,431 --> 00:22:01,850
Orada da bir şey bir adlandırılan
etiketi bir OL listeyi emretti.

473
00:22:01,850 --> 00:22:05,350
Sonra LI, liste öğesi demek hepsi bu.

474
00:22:05,350 --> 00:22:07,790
>> Ve bu yüzden otomatik
Senin için her şeyi sayılar.

475
00:22:07,790 --> 00:22:11,270
Ama benim girinti yine tüm
beyaz boşluk sadece benim hatırım için.

476
00:22:11,270 --> 00:22:13,050
Tarayıcınız değil
aslında bakım olacak.

477
00:22:13,050 --> 00:22:16,670
Yani olsa bile yapamadın
Bu, sadece temiz olması için yapmak

478
00:22:16,670 --> 00:22:19,880
Olsa eşitlemek olmamalı
tarayıcı hala olacak

479
00:22:19,880 --> 00:22:22,130
sadece iyi anlamak mümkün.

480
00:22:22,130 --> 00:22:24,590
Ben reload vuruyorum benim
Tarayıcı, ben reload tıklayarak ediyorum

481
00:22:24,590 --> 00:22:26,760
ve herhangi bir değişiklik oluyor
Hala tarayıcı nedeniyle

482
00:22:26,760 --> 00:22:29,550
Yapmam gereken bunu söylemek tam olarak ne yapıyor.

483
00:22:29,550 --> 00:22:30,050
>> Pekala.

484
00:22:30,050 --> 00:22:31,340
Yani bu sadece metindir.

485
00:22:31,340 --> 00:22:33,730
Şimdi daha ilginç bir şey yapalım.

486
00:22:33,730 --> 00:22:36,660
Ben devam edeceğim ve
Bu HTML ödünç.

487
00:22:36,660 --> 00:22:40,910
Ben devam edeceğim ve
Burada yeni bir dosya oluşturun.

488
00:22:40,910 --> 00:22:43,370
Ve biz bu rick.html arayacağım.

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

490
00:22:46,190 --> 00:22:48,916
Biz orantısız var
Kullanılmış bir şey

491
00:22:48,916 --> 00:22:51,290
Bu bir rick rulo olarak adlandırılan
sınıf bu yıl, bilmiyorum,

492
00:22:51,290 --> 00:22:53,880
sadece organik olanları.

493
00:22:53,880 --> 00:22:55,397
>> Ve şimdi kontrolden çıktı var.

494
00:22:55,397 --> 00:22:56,730
Yani sadece onunla gitmek için gidiyorum.

495
00:22:56,730 --> 00:22:59,700
Ve ben Google'a gidersem
Görüntüler ve Rick Astley.

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

497
00:23:02,450 --> 00:23:06,170
Yaptığımız neden bilmiyorsanız
Bu, sadece Wikipedia'da okumak.

498
00:23:06,170 --> 00:23:11,520
Eğer linke tıkladığınız her zaman,
Birisi bir yerde gülüyor oldu.

499
00:23:11,520 --> 00:23:14,860
Ve beni ahead-- oraya gidelim
Biz en bu görüntüyü izin gidin.

500
00:23:14,860 --> 00:23:16,750
>> Yani burada biz var
Google Görseller görüntü.

501
00:23:16,750 --> 00:23:19,390
Ve Şimdi bu olduğunu varsayalım
Makul her yerde internette.

502
00:23:19,390 --> 00:23:22,570
Bu yüzden benim için sorun yok varsaymak gidiyorum
Aslında benim web sayfasına koymak için.

503
00:23:22,570 --> 00:23:24,820
Ben devam edeceğim
ve görüntü URL'yi kopyalayın.

504
00:23:24,820 --> 00:23:28,600
Ve şimdi ben Cloud geri giderseniz
9, en burada ne yapabilirim görelim.

505
00:23:28,600 --> 00:23:30,630
Yani burada sadece bir web sayfası.

506
00:23:30,630 --> 00:23:39,020
Bu, haha ​​Rick Astley olduğunu
Ben şimdi geri dönmek için gidiyorum

507
00:23:39,020 --> 00:23:43,510
Benim tarayıcı, yeniden ve ilginç.

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

509
00:23:44,530 --> 00:23:46,050
Bu yüzden bana ne oldu görelim.

510
00:23:46,050 --> 00:23:49,114
Aslında, ben gidiyorum
Ben bunu yapmadım gibi davranamam.

511
00:23:49,114 --> 00:23:50,280
[Duyulamaz] buraya koydular.

512
00:23:50,280 --> 00:23:52,520
Biz bir an geri o geleceğiz.

513
00:23:52,520 --> 00:23:54,200
Yani burada rick.html var.

514
00:23:54,200 --> 00:23:56,070
Böylece Rick Astley değil.

515
00:23:56,070 --> 00:23:59,680
Çıkıyor Yani biz
Aslında burada onu ekleyin.

516
00:23:59,680 --> 00:24:00,830
Bu Rick Astley olduğunu.

517
00:24:00,830 --> 00:24:06,680
Bana kimin bir görüntü vermek demek için gidiyorum
Kaynak sadece kopyalanan URL, hangi

518
00:24:06,680 --> 00:24:09,110
görünüşte mutlu olduğunu
doğum günü şey ya da diğer.

519
00:24:09,110 --> 00:24:13,280
>> Ve şimdi ben gidiyorum
Böyle etiketi kapatın.

520
00:24:13,280 --> 00:24:15,170
Yani bu süper uzun sarma.

521
00:24:15,170 --> 00:24:17,740
Ama ben fark ettik
Açık braket görüntü yapılır,

522
00:24:17,740 --> 00:24:20,270
Bu bir niteliği ile kaynak.

523
00:24:20,270 --> 00:24:21,530
Ve bu gerçekten uzun bir URL.

524
00:24:21,530 --> 00:24:23,720
Ve en sonunda, bu fark.

525
00:24:23,720 --> 00:24:29,530
Neden yaptım çizgi açılı ayraç
yerine, her etiketi gibi,

526
00:24:29,530 --> 00:24:33,590
Açık dirsek sahip
IMG, dirsek kapalı?

527
00:24:33,590 --> 00:24:37,040
Sadece bile eğer bir tahmin almak
hiçbir benzerlik olursa olsun var

528
00:24:37,040 --> 00:24:40,410
HTML ile daha önce.

529
00:24:40,410 --> 00:24:42,710
>> Yani o kapatır nasıl
Komut, ama neden

530
00:24:42,710 --> 00:24:45,850
Gerçekten sezgisel yapmaz
duygusu biraz daha bir şeyler yapmak

531
00:24:45,850 --> 00:24:48,820
yakın görüntü gibi ayrıntılı?

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

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

534
00:24:52,000 --> 00:24:55,620
Sadece semantik, hiçbir anlamı yoktur
Bir görüntüyü başlayan ve biten bir görüntü,

535
00:24:55,620 --> 00:24:56,870
o da orada ya da değil.

536
00:24:56,870 --> 00:25:00,960
Yani bir boşluk bırakmamaya mantıklı değil
Bir resmin içinde başka bir şey için.

537
00:25:00,960 --> 00:25:02,010
Bunu sadece bunu yapamam.

538
00:25:02,010 --> 00:25:03,720
Ve böylece sözdizimi
genellikle sadece olurdu

539
00:25:03,720 --> 00:25:07,910
içeride eğik yapmak
Açık etiketi veya başlangıç ​​etiketinin

540
00:25:07,910 --> 00:25:09,020
ve ardından Kaydet çarptı.

541
00:25:09,020 --> 00:25:13,350
>> Yani eğer ben şimdi, bu dosyayı yeniden
Burada iyi bir web sayfası pişirme var.

542
00:25:13,350 --> 00:25:15,100
Ve biz kesinlikle olabilir
Gerçekten insanlar rahatsız

543
00:25:15,100 --> 00:25:17,010
Bunun yerine gömerek
YouTube bağlantısı gibi.

544
00:25:17,010 --> 00:25:19,350
Ve aslında, her zaman
Hiç YouTube'a gittin

545
00:25:19,350 --> 00:25:22,190
ve yanlışlıkla aslında bana izin
rick kendimi burada yuvarlayın.

546
00:25:22,190 --> 00:25:25,770
Yani Rick rulo.

547
00:25:25,770 --> 00:25:29,592
Yani rick Buraya gitmek için gidiyorum roll--.

548
00:25:29,592 --> 00:25:31,900
>> [MÜZİK OYUN]

549
00:25:31,900 --> 00:25:33,730
>> Tamam, bir kişi sevdim.

550
00:25:33,730 --> 00:25:37,270
Peki, bütün bu zaman fark eğer
Tabii, seni Paylaş bağlantısını tıklayın

551
00:25:37,270 --> 00:25:41,390
URL'yi olsun aslında can
Bir e-posta veya adli görüntüde embed

552
00:25:41,390 --> 00:25:43,730
veya bir soruna ayarlamak veya bir slayt.

553
00:25:43,730 --> 00:25:49,055
Ve şimdi, ben yerine embed üzerine tıklarsanız,
dikkat edin bu sefer, bu malzeme

554
00:25:49,055 --> 00:25:49,680
olmuştur.

555
00:25:49,680 --> 00:25:50,910
Devam edin ve bu kopyalamak için gidiyorum.

556
00:25:50,910 --> 00:25:54,000
>> Ve sadece bu yüzden biz, daha iyi görebiliyorum
Benim metin düzenleyiciye yapıştırın olacak.

557
00:25:54,000 --> 00:25:55,860
Bu fark nedir
YouTube söylüyorum edilmiştir.

558
00:25:55,860 --> 00:25:57,693
Bir her zaman ziyaret
YouTube video, eğer

559
00:25:57,693 --> 00:26:00,410
embed video istiyorum senin
web sayfası, sadece bu kapmak.

560
00:26:00,410 --> 00:26:03,350
Yani bu başka bir
HTML etiketi bir iframe denir.

561
00:26:03,350 --> 00:26:04,590
Ya da hat çerçevesi içinde bir.

562
00:26:04,590 --> 00:26:08,680
Yani çok biraz daha bakar
tüm diğerlerinden daha karmaşık.

563
00:26:08,680 --> 00:26:11,950
Yani resmin çıkıyor
etiket ve görünüşe iframe etiketi

564
00:26:11,950 --> 00:26:13,370
denilen nitelikler nelerdir alır.

565
00:26:13,370 --> 00:26:15,710
>> Ve bu başka bir şeydir
HTML sözdizimi parçası.

566
00:26:15,710 --> 00:26:19,240
Etiket en ilaveten
isim, açık dirsek etiket adı,

567
00:26:19,240 --> 00:26:23,780
etiketin davranışını kontrol edebilirsiniz
niteliğin bir sürü alarak

568
00:26:23,780 --> 00:26:24,860
değerine eşittir.

569
00:26:24,860 --> 00:26:26,290
Özellik değerine eşittir.

570
00:26:26,290 --> 00:26:28,100
Ve böylece, örneğin,
YouTube bize anlatıyor

571
00:26:28,100 --> 00:26:31,990
Bu videonun genişliğini istiyorsanız
420 piksel ve yüksekliği olmak

572
00:26:31,990 --> 00:26:35,470
315 piksel olması, işte bu
nasıl HTML bunu ifade eder.

573
00:26:35,470 --> 00:26:38,480
>> Videonun kaynağı oluyor
uzun YouTube URL olmak

574
00:26:38,480 --> 00:26:40,830
ve daha sonra diğer bazı şeyler
, çerçeve sınır sıfır gibi

575
00:26:40,830 --> 00:26:43,500
böylece muhtemelen var demektir
şey çevresinde hiçbir sınır.

576
00:26:43,500 --> 00:26:45,450
Muhtemelen tam ekran İzin
kullanıcı demektir

577
00:26:45,450 --> 00:26:47,840
Bir düğmeyi tıklatın ve
Aslında tam ekran video.

578
00:26:47,840 --> 00:26:52,870
Gerçekten olmak istiyorum Yani eğer
Rick nokta HTML burada etkileyici,

579
00:26:52,870 --> 00:26:58,490
resim etiketi kullanmak yerine, let
bana bunu silmek yerine bu yapıştırın.

580
00:26:58,490 --> 00:27:00,810
Ve şimdi yeniden yükleyin.

581
00:27:00,810 --> 00:27:02,500
Ve şimdi burada biz tekrar gitmek.

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

583
00:27:04,979 --> 00:27:06,020
Pekâlâ, bu kadar yeter.

584
00:27:06,020 --> 00:27:08,970
Pekala ben çalışacağız, böylece
Sert tekrar yapmak için değil.

585
00:27:08,970 --> 00:27:11,400
Yani burada paketler bazıları nelerdir?

586
00:27:11,400 --> 00:27:15,130
Bu web sayfalarında Yani HTML gibi çirkin
vardır, aslında oldukça basittir.

587
00:27:15,130 --> 00:27:16,467
Bir programlama dili değildir.

588
00:27:16,467 --> 00:27:17,550
Bu işlevler yok.

589
00:27:17,550 --> 00:27:18,410
Bu döngüler yok.

590
00:27:18,410 --> 00:27:19,535
Bu koşullara sahip değil.

591
00:27:19,535 --> 00:27:22,900
Sahip olduğu tüm onlarca olduğunu
Farklı etiketler, her biri

592
00:27:22,900 --> 00:27:24,620
sıfır veya daha fazla özelliklere sahiptir.

593
00:27:24,620 --> 00:27:27,320
Ve aslında, eğlenceli hakkında ne
HTML dalmak başladığınız

594
00:27:27,320 --> 00:27:29,560
Çok kendini öğretilebilir olmasıdır.

595
00:27:29,560 --> 00:27:32,880
>> Tek gereken bir anlayıştır
HTML genel çerçevesi.

596
00:27:32,880 --> 00:27:36,510
Bir etiket nedir, bir nitelik nedir,
aslında bir web sayfası yapılandırmak nasıl

597
00:27:36,510 --> 00:27:37,250
aşağıdaki gibi.

598
00:27:37,250 --> 00:27:40,720
Ve her şey gerçekten sonuç
bir online referans ararken

599
00:27:40,720 --> 00:27:43,080
ya da bazı nasıl Googling
tekniği ya da gördüğümüz gibi,

600
00:27:43,080 --> 00:27:45,371
Facebook'un kaynağında bakarak
Kod, bir web sitesine bakarak

601
00:27:45,371 --> 00:27:48,710
Eğer ona sevdiğim kaynak kodu var ve
anlamak ne var geliştiriciler

602
00:27:48,710 --> 00:27:50,550
Aslında bir şeyler ortaya koydu.

603
00:27:50,550 --> 00:27:52,180
>> Bu yüzden de görüntüleri yapabilirsiniz.

604
00:27:52,180 --> 00:27:53,994
Ve aslında, biz bir an önce yaptım.

605
00:27:53,994 --> 00:27:55,410
Beni go ahead ve size sadece göstereyim.

606
00:27:55,410 --> 00:27:56,770
İşte bazı örnek kod var.

607
00:27:56,770 --> 00:27:58,380
Hiç huysuz kedi görmek istiyorsanız.

608
00:27:58,380 --> 00:28:00,620
Yani can fark
Burada bir resim etiketi var.

609
00:28:00,620 --> 00:28:02,090
Ve ben bunun üzerinde bir yorum var.

610
00:28:02,090 --> 00:28:04,490
Ben alternatif var
erişilebilirlik için metin.

611
00:28:04,490 --> 00:28:07,250
Bir ekran kullanılarak yüzden kimse
görme nedenlerle okuyucusu

612
00:28:07,250 --> 00:28:10,172
aslında o olabilir onların
Ekran okuyucu huysuz kedi söylüyorlar.

613
00:28:10,172 --> 00:28:11,880
Eğer yapamam, çünkü
görüntüyü görmek, onlar

614
00:28:11,880 --> 00:28:14,504
En azından onların bilgisayar olabilir
o sözlü onlara ne.

615
00:28:14,504 --> 00:28:18,020
Ve o dosyanın kaynak cat.jpeg olduğunu.

616
00:28:18,020 --> 00:28:22,472
Yani aslında, ben gerçekten istedim
Ben ne olabileceğini, zeki olsun done--

617
00:28:22,472 --> 00:28:25,680
Ben bu yüzden, Rick Astley gitmek için söz veriyorum
Bunun yerine bir kedi için google gidiyorum.

618
00:28:25,680 --> 00:28:28,290
Ve ben Google Images giderseniz
Burada, biz kabul edeceğiz

619
00:28:28,290 --> 00:28:30,040
bu benim kedi bir resmi vardır.

620
00:28:30,040 --> 00:28:35,070
>> Ben kontrol tıkladım olduğunu varsayalım
veya sağa yanlışlıkla, bu tıklanan

621
00:28:35,070 --> 00:28:35,630
ürpertici.

622
00:28:35,630 --> 00:28:40,320
Ve cat.jpeg ben gidiyorum
Benim masaüstünde kaydedin.

623
00:28:40,320 --> 00:28:44,700
Şimdi beni bulut 9 geri dönelim.

624
00:28:44,700 --> 00:28:48,150
O burada yapabilirsiniz edin
Yerel dosya yüklemek için gidin.

625
00:28:48,150 --> 00:28:51,530
Ve ben bu kapmak eğer
Dosya, cat.jpeg, haber

626
00:28:51,530 --> 00:28:54,674
Ben sürükleyebilirsiniz olduğunu ve
bulut 9 içine bırakın

627
00:28:54,674 --> 00:28:56,090
ve burada bana bağırma olacak.

628
00:28:56,090 --> 00:28:59,000
>> Biz zaten ettik çünkü
Sana bir cat.jpeg dosyası verilmiş,

629
00:28:59,000 --> 00:29:01,430
ama süper kolay
Eğer ettik bir fotoğraf kapmak

630
00:29:01,430 --> 00:29:03,220
Facebook alınan
fiske ya da bu gibi ya da

631
00:29:03,220 --> 00:29:05,678
aslında sürükleyin ve bırakın
Daha sonra bulut 9 içine ve bunu yapmak

632
00:29:05,678 --> 00:29:07,970
Kendi kişisel parçası
Web sitesi veya sorun

633
00:29:07,970 --> 00:29:10,442
yakında göreceğimiz gibi yedi veya sekiz ayarlayın.

634
00:29:10,442 --> 00:29:12,150
Ve sonra sizi
Nihayet o kediyi ziyaret

635
00:29:12,150 --> 00:29:16,610
Ben aynı kediyi indirilen varsayarak,
Bu ki- haber çok güzel oldu.

636
00:29:16,610 --> 00:29:19,160
>> Ne görürdünüz olduğunu
Burada bu yüzü gibi bir şey.

637
00:29:19,160 --> 00:29:21,810
Dosyaları böylece sen
Bir web sayfası içinde başvuru

638
00:29:21,810 --> 00:29:26,050
ya kendi yerel olabilir
diğer bazı sunucu üzerinde hesap veya uzak

639
00:29:26,050 --> 00:29:29,670
Rick'le durumunda olduğu gibi
Biraz önce Astley fotoğraf.

640
00:29:29,670 --> 00:29:32,990
Peki ne else--
Başka burada yapabiliriz?

641
00:29:32,990 --> 00:29:34,890
Öyleyse aşağıdaki bir göz atalım.

642
00:29:34,890 --> 00:29:36,160
Tür ne serin biliyor musun?

643
00:29:36,160 --> 00:29:39,330
>> Bu, şimdiye kadar hale olmuştur
Çok statik web sayfaları.

644
00:29:39,330 --> 00:29:41,830
Ben şöyle şeyler baharat istiyorum.

645
00:29:41,830 --> 00:29:44,344
Ben kendi arama motoru yapmak istiyorum.

646
00:29:44,344 --> 00:29:47,010
Yani diyelim, bir arama motoru yapmak için
go ahead ve bunu yaparken başlayın.

647
00:29:47,010 --> 00:29:52,570
Devam edin ve oluşturmak için gidiyorum
Yeni bir dosya search.html denir.

648
00:29:52,570 --> 00:29:54,890
Ve biz çevrimiçi sürümlerini prefabed var.

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

650
00:29:56,027 --> 00:29:57,610
Terminal penceresine yapıştırın vermeyin.

651
00:29:57,610 --> 00:29:58,744
Online Prefabrik sürümleri.

652
00:29:58,744 --> 00:30:00,160
Ve ben şöyle başlamak için gidiyorum.

653
00:30:00,160 --> 00:30:04,490
Yani burada başlangıcı
Bir dosya search.html çağırdı.

654
00:30:04,490 --> 00:30:07,510
Ben kaydetmek için gidiyorum
Bugünün kaynak dizini.

655
00:30:07,510 --> 00:30:09,079
Ben bu ara arayacağım.

656
00:30:09,079 --> 00:30:10,370
Aslında, biz daha iyi yapacağız.

657
00:30:10,370 --> 00:30:13,600
CS50 Arama ve aslında marka o.

658
00:30:13,600 --> 00:30:17,500
Ve şimdi, ben söylemek için gidiyorum
H1 CS50 Arama gibi bir şey.

659
00:30:17,500 --> 00:30:20,930
Ve sonra buraya, H2 yakında.

660
00:30:20,930 --> 00:30:23,230
Ve sadece H1 tekrarlamak ve
H2 Ne sırasıyla demek?

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

662
00:30:26,750 --> 00:30:30,320
>> Evet, çok büyük ve kalın ve
kadar büyük, ama yine de cesur değil.

663
00:30:30,320 --> 00:30:37,375
Yani bu kaydedip buraya giderseniz,
dosya search.html görelim.

664
00:30:37,375 --> 00:30:42,560
Pekala, ve bu bir
[inaudible] haklıydın-- olduğunu.

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

666
00:30:46,980 --> 00:30:49,110
Yanında olmak.

667
00:30:49,110 --> 00:30:49,945
David karıştı.

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

669
00:30:52,610 --> 00:30:54,080
Oh, doğru var.

670
00:30:54,080 --> 00:30:54,860
David aptalın teki.

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

672
00:30:55,420 --> 00:30:56,660
Yani orada öyle.

673
00:30:56,660 --> 00:30:58,350
Yani CS50 arama yakında.

674
00:30:58,350 --> 00:31:00,370
Yani şimdi, sentez edelim
Geçen hafta ne yaptığını.

675
00:31:00,370 --> 00:31:03,400
>> Konuştuğumuz Nerede
HTTP alt düzey mekaniği.

676
00:31:03,400 --> 00:31:05,780
Ve bu yeni fikirler
HTML, hangi adildir

677
00:31:05,780 --> 00:31:08,890
Bu biçimlendirme dili nerede
tam olarak ne yapacağını bir tarayıcı söyle

678
00:31:08,890 --> 00:31:10,740
ve kendi arama motoru uygulamak.

679
00:31:10,740 --> 00:31:12,520
Bunun yerine sadece
yakında söyleyerek, ben

680
00:31:12,520 --> 00:31:14,810
tanıtmak için gidiyor
bir şey form etiketi denir.

681
00:31:14,810 --> 00:31:19,610
Ve bu formda, ben gidiyorum
Bir giriş alanı gibi bir şey var.

682
00:31:19,610 --> 00:31:22,450
>> Ve bu girişin adı
alan, bunu diyeceğim S.

683
00:31:22,450 --> 00:31:26,240
Ve bu giriş alanının türü
Ben söylemek için gidiyorum sadece "metin" olduğunu.

684
00:31:26,240 --> 00:31:29,130
Bir metin alanı ve biz olacak
bkz sadece bir metin kutusudur.

685
00:31:29,130 --> 00:31:32,830
Ve böylece var burada algılamaz
Bu noktada bunun içinde her şey.

686
00:31:32,830 --> 00:31:35,320
Ve bu yüzden sadece gidiyorum
Bununla etiketi kapatmak için

687
00:31:35,320 --> 00:31:38,099
ileri etiketi kendisi sağ çizgi.

688
00:31:38,099 --> 00:31:39,890
Ve sonra ben gidiyorum
bir başka girişi var.

689
00:31:39,890 --> 00:31:43,480
Giriş tipi göndermek eşittir.

690
00:31:43,480 --> 00:31:45,320
Ve sonra ben gidiyorum
de bu bir kapatın.

691
00:31:45,320 --> 00:31:46,840
>> Ve şimdi ben buraya gitmek için gidiyorum.

692
00:31:46,840 --> 00:31:49,520
Ve zaten biz görmek
çok çirkin de olsa, ben ettik

693
00:31:49,520 --> 00:31:52,460
başlangıcı var
Burada kendi arama sayfası.

694
00:31:52,460 --> 00:31:55,150
Aslında bana çalışalım
biraz bu kadar temiz.

695
00:31:55,150 --> 00:31:57,330
Üzerinde çıkıyor
Burada girişi, ben olabilir

696
00:31:57,330 --> 00:31:59,910
Yer tutucu olarak adlandırılan başka bir nitelik.

697
00:31:59,910 --> 00:32:05,165
Ve ben anahtar kelimeler gibi bir şey görebilirsiniz,
ya da daha spesifik olarak, q sorgulamak.

698
00:32:05,165 --> 00:32:07,820
>> Ve şimdi, ben, fark
gri metin bu tür

699
00:32:07,820 --> 00:32:10,440
edilene kaybolur
yakında yazmaya başlayın olarak,

700
00:32:10,440 --> 00:32:12,930
ama muhtemelen bir şey
Diğer web sayfalarında gördüm.

701
00:32:12,930 --> 00:32:14,650
Ben gerçekten Gönder düğmesini sevmiyorum.

702
00:32:14,650 --> 00:32:18,320
Yani aslında vereceğim
Düğmesine arama değerini gönderin.

703
00:32:18,320 --> 00:32:21,680
Ben yeniden Ve eğer şimdi, fark
Benim düğme arama adlandırılır olur.

704
00:32:21,680 --> 00:32:24,140
Sen Gerçekten bilmiyorum, bilmek
Burada logosu gibi.

705
00:32:24,140 --> 00:32:27,140
Yani Google Yazı jeneratör.

706
00:32:27,140 --> 00:32:28,820
>> Ben daha bu kadar baharat istiyorum.

707
00:32:28,820 --> 00:32:30,660
Yani CS50 arama.

708
00:32:30,660 --> 00:32:31,870
Bana kendi logosunu oluşturmak edelim.

709
00:32:31,870 --> 00:32:33,080
Bu güzel görünüyor.

710
00:32:33,080 --> 00:32:36,945
Yani şimdi bana bu hadi as-- tasarruf sağlar.

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

712
00:32:40,710 --> 00:32:43,120
O nereye gidiyor?

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

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

715
00:32:44,160 --> 00:32:44,980
Kaçırdım.

716
00:32:44,980 --> 00:32:47,740
Farklı kaydet.

717
00:32:47,740 --> 00:32:49,470
Aptal tarayıcılar.

718
00:32:49,470 --> 00:32:51,700
Stand by, biz gidiyoruz
Bu kez ve herkes için sabitleyin.

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

720
00:32:57,650 --> 00:32:58,590
Oraya gidiyoruz.

721
00:32:58,590 --> 00:32:59,090
Pekala.

722
00:32:59,090 --> 00:32:59,600
Özür dilerim.

723
00:32:59,600 --> 00:33:00,750
İzin günü.

724
00:33:00,750 --> 00:33:02,310
Şimdi bu korkak.

725
00:33:02,310 --> 00:33:03,160
Tam ekran çıkın.

726
00:33:03,160 --> 00:33:04,150
Pekala.

727
00:33:04,150 --> 00:33:06,870
>> Şimdi, normal gibi
kişi olarak kaydetmek.

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

729
00:33:08,810 --> 00:33:13,194
Şimdi CS50IDE ve gitmek için gidiyorum
Ben sadece logoyu kapmak için gidiyorum,

730
00:33:13,194 --> 00:33:15,360
Ben içine sürüklemek için gidiyorum
benim kaynak yedi dizin,

731
00:33:15,360 --> 00:33:17,002
dosya zaten ben bu konuda iyiyim, var.

732
00:33:17,002 --> 00:33:19,210
Yani ben bunu geçersiz kılmak için gidiyorum
Ben zaten vardı çünkü.

733
00:33:19,210 --> 00:33:20,630
Ve şimdi nasıl bu kurtulmak mı?

734
00:33:20,630 --> 00:33:24,670
>> Burada go ahead ve yapalım
görüntü kaynağı logo.gif eşittir.

735
00:33:24,670 --> 00:33:25,490
Bu kapatın.

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

737
00:33:26,050 --> 00:33:30,560
Ve şimdi benim arama geri giderseniz
sayfa, şimdi oldukça iyi görünüyor.

738
00:33:30,560 --> 00:33:33,610
Pekala, öyle değil vardır bu yüzden
Oldukça kullanışlı bir şey yapmadım.

739
00:33:33,610 --> 00:33:37,000
Aslında, bana arama deneyeyim
ve bir kedi için ne olacağını görmek.

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

741
00:33:38,890 --> 00:33:39,420
Kahretsin.

742
00:33:39,420 --> 00:33:41,400
Bu sadece görünüşte, çalışmıyor.

743
00:33:41,400 --> 00:33:43,760
Yani önemli parçası nedir
Burada eksik?

744
00:33:43,760 --> 00:33:49,100
>> Doğru, herhangi bir HTML bilmiyorsanız bile,
Ben telefon formu işaretleme başladım

745
00:33:49,100 --> 00:33:54,130
ve ben, girdileri nasıl bunu söyledim
Bana bir metin kutusu vermek ve bir düğmeye tıklayın

746
00:33:54,130 --> 00:33:55,730
görünüşte ne parça eksik?

747
00:33:55,730 --> 00:33:58,975
Biz aslında almak istediğinizi varsayalım
düzgün çalıştığından bu şey.

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

749
00:34:02,420 --> 00:34:05,360
Ne yapmamız gerekiyor?

750
00:34:05,360 --> 00:34:08,860
Biz arka uç uygulamak için bir ihtiyaç var
veritabanı veya arama motoru kendisi,

751
00:34:08,860 --> 00:34:11,210
ve bu almaya gidiyor
açıkçası zaman sürü.

752
00:34:11,210 --> 00:34:13,380
>> Bu yüzden son kez ne yaptığımı hatırlamıyorum.

753
00:34:13,380 --> 00:34:18,230
Yani Google'da bir şey ararsanız
ve önceden, kapalı

754
00:34:18,230 --> 00:34:20,355
hatırlama, anında arama.

755
00:34:20,355 --> 00:34:22,230
Bu yüzden bana bu kapatmak izin
Böylece bu aslında

756
00:34:22,230 --> 00:34:26,650
Eski bir okul tarayıcısı gibi davranır,
Şimdi kediler gibi bir şey aramak eğer,

757
00:34:26,650 --> 00:34:28,190
URL neye benzediğini hatırlıyorum.

758
00:34:28,190 --> 00:34:29,449
Oldukça şifreli değil.

759
00:34:29,449 --> 00:34:33,000
Ama orada gömülü,
hatırlama, eğik çizgi aramasıdır.

760
00:34:33,000 --> 00:34:35,100
Soru işareti q kedileri eşittir.

761
00:34:35,100 --> 00:34:37,760
>> Ve bu bana vermek gibi görünüyor
Arama sonuçlarında bir sürü.

762
00:34:37,760 --> 00:34:39,134
Yani ben yapacağım biliyor musun?

763
00:34:39,134 --> 00:34:41,650
Ben ödünç gidiyorum
Bir dakika için Google.

764
00:34:41,650 --> 00:34:43,670
Ben üzerinden gitmek için gidiyorum
Burada ve söylemek için gidiyorum

765
00:34:43,670 --> 00:34:47,850
Bu işlem oluşturan veya
Hedef, bu nedenle, konuşmak için

766
00:34:47,850 --> 00:34:49,330
kelimenin tam anlamıyla Google olmalıdır.

767
00:34:49,330 --> 00:34:52,590
Ve yöntem istediğim
Kullanım almak olacak.

768
00:34:52,590 --> 00:34:53,560
>> Yani eylem nedir?

769
00:34:53,560 --> 00:34:55,760
Eylem esrarlı, adlı
ama bu sadece gelir

770
00:34:55,760 --> 00:34:58,120
kim idare edecek
Bu formun eylemi?

771
00:34:58,120 --> 00:35:00,820
Ben Ara, tıkladığınızda
Sonuç gitmeli?

772
00:35:00,820 --> 00:35:05,300
Ve şimdi benim forma geri giderseniz
Burada ve benim web sayfasını yeniden

773
00:35:05,300 --> 00:35:09,000
ve şimdi bir şey aramak
köpek gibi, şimdi fark

774
00:35:09,000 --> 00:35:10,850
Ben Google hayata yeniden gelmiş.

775
00:35:10,850 --> 00:35:11,350
Sağ?

776
00:35:11,350 --> 00:35:14,141
>> Ben bir şey aramak istiyorsanız
Başka, değil sadece köpekler için çalışıyor,

777
00:35:14,141 --> 00:35:16,400
aynı zamanda kediler için çalışıyor.

778
00:35:16,400 --> 00:35:21,930
Ayrıca CS50 için çalışır.

779
00:35:21,930 --> 00:35:24,310
Ve tamam, bu sadece bir
whelming altında, öyle değil mi?

780
00:35:24,310 --> 00:35:25,920
Pekala, ama aslında çalışıyor.

781
00:35:25,920 --> 00:35:27,360
Yani aslında neler oluyor?

782
00:35:27,360 --> 00:35:31,340
Yani kullanarak, benim tarayıcı öğretti ettik
HTML, kullanıcı girişi almak

783
00:35:31,340 --> 00:35:35,810
ve aslında bu girişi göndermek
uzak bir sunucuya HTTP kullanarak.

784
00:35:35,810 --> 00:35:39,120
>> Ve benim tarayıcıda çünkü
HTTP, aslında anlar

785
00:35:39,120 --> 00:35:43,500
Ne ki URL'yi oluşturmak
Ben, benim tarayıcıda üzerinde sonuna kadar

786
00:35:43,500 --> 00:35:45,660
ne fark
ne zaman köpek için aradı.

787
00:35:45,660 --> 00:35:49,270
Ben Ara 'yı ise, fark
Ben istendiği gibi URL değişiklikleri

788
00:35:49,270 --> 00:35:52,770
Sorgu köpek eşittir google.com/search~~V için.

789
00:35:52,770 --> 00:35:56,020
Ve bu formda nedeni var
yöntem olsun, çünkü bilir,

790
00:35:56,020 --> 00:35:59,560
sadece orada o URL'ye bunu eklemek için.

791
00:35:59,560 --> 00:36:01,730
>> Şimdi, bu web sayfaları hala çirkin.

792
00:36:01,730 --> 00:36:04,890
Yani bir başka tanıştırayım
sözdizimi parçası bugün eğer.

793
00:36:04,890 --> 00:36:07,640
Ve bu bilinen bir şeydir
Basamaklı stil sayfaları gibi.

794
00:36:07,640 --> 00:36:10,720
Bu yüzden bana bir göz atalım
Burada bu örnek ve görmek

795
00:36:10,720 --> 00:36:12,380
Biz Neler sonucuna eğer.

796
00:36:12,380 --> 00:36:14,520
Bu CSS0.html olduğunu.

797
00:36:14,520 --> 00:36:16,532
Ve bu nerede şeyler
Biraz çirkin olsun.

798
00:36:16,532 --> 00:36:18,490
Maalesef Çünkü
web dünyasında,

799
00:36:18,490 --> 00:36:20,920
HTML tek başına her şeyi yapamaz.

800
00:36:20,920 --> 00:36:22,920
Ve böylece isterseniz
, web sayfası stilize

801
00:36:22,920 --> 00:36:28,370
aslında üzerinde durulması gereken
farklı bir şekilde estetik.

802
00:36:28,370 --> 00:36:33,090
Yani burada, benim web vücuda sahip
hangi iç sayfa büyük bir div olduğunu.

803
00:36:33,090 --> 00:36:34,700
Ve bir div sadece bölünme anlamına gelir.

804
00:36:34,700 --> 00:36:38,060
Yani bir paragraf ama gibi
Aynı semantiği yok

805
00:36:38,060 --> 00:36:39,180
Metnin bir paragraf.

806
00:36:39,180 --> 00:36:40,940
>> Bu sadece anlamına gelir
Tarayıcı, buraya gelir

807
00:36:40,940 --> 00:36:45,210
Benim web büyük bir dikdörtgen bölge
sayfa, ben özel idare etmek istiyorum.

808
00:36:45,210 --> 00:36:47,420
Bu div başladığı Şimdi nerede, çizgi 21'dir.

809
00:36:47,420 --> 00:36:48,770
Ve sadece bir tahmin almak.

810
00:36:48,770 --> 00:36:53,080
On line 21 etkisi nedir
Sayfanın içeriğini kalanı?

811
00:36:53,080 --> 00:36:55,640

812
00:36:55,640 --> 00:36:56,311
Bunu Merkezleme.

813
00:36:56,311 --> 00:36:56,810
Bu kadar.

814
00:36:56,810 --> 00:36:58,830
Yani biz bir yol ve görmedim
Aslında metni merkezleme.

815
00:36:58,830 --> 00:37:00,996
>> Aslında, benim arama motoru,
Gerçek Google farklı olarak,

816
00:37:00,996 --> 00:37:03,040
Tüm sola üzerinde haklı.

817
00:37:03,040 --> 00:37:07,430
Ve şimdi hat 21, hey, diyorum
Tarayıcı, sayfanın bir bölümü oluşturun.

818
00:37:07,430 --> 00:37:09,450
Sadece bana büyük, görünmez dikdörtgen ver.

819
00:37:09,450 --> 00:37:11,490
Ben istiyorum nasıl
Web sayfası hakkında düşünüyorum.

820
00:37:11,490 --> 00:37:13,870
Aşağıda ve daha sonra stilize.

821
00:37:13,870 --> 00:37:16,900
Bu tırnak içinde,
Şimdi, ikinci bir dildir

822
00:37:16,900 --> 00:37:19,969
Bugün tanıttı
denilen basamaklı stil sayfaları.

823
00:37:19,969 --> 00:37:22,010
Neyse ki, çok değil,
Bir programlama dili,

824
00:37:22,010 --> 00:37:26,470
bu yüzden çok kendi sözdizimi sınırlı oluyor ama
aynı zamanda çok işlevselliği sınırlı

825
00:37:26,470 --> 00:37:30,670
HTML oysa tüm hakkında
Bir web sayfasının verileri işaretleme

826
00:37:30,670 --> 00:37:32,130
ve bir web sayfasının yapısı.

827
00:37:32,130 --> 00:37:35,320
CSS hakkında genellikle
Geçen mil, estetik,

828
00:37:35,320 --> 00:37:40,160
boyutunu ve rengini ve alma
Bir web sayfasında tam olarak doğru yerleştirme.

829
00:37:40,160 --> 00:37:43,000
Gerçekten de, bu oluşturulmaktadır
anahtar değer çiftleri ile.

830
00:37:43,000 --> 00:37:46,290
>> Bu, metin gibi bir özellik
Bir iki nokta üst üste, hizalama,

831
00:37:46,290 --> 00:37:49,720
Bunun değeri ardından
Bu durumda merkezi özelliği.

832
00:37:49,720 --> 00:37:51,910
Ve şimdi fark
yuva bunları yapabilirsiniz.

833
00:37:51,910 --> 00:37:56,780
Ben her şeyi isteseydim
Ben merkezli olmak vurguladık

834
00:37:56,780 --> 00:38:00,270
Bu yüzden ben satır 21 ve
İlgili hat 31.

835
00:38:00,270 --> 00:38:04,820
Ama şimdi varsayalım John söylemek istiyorum
Harvard benim ana sayfasına hoş geldiniz.

836
00:38:04,820 --> 00:38:06,530
>> Telif sembolü John Harvard.

837
00:38:06,530 --> 00:38:09,180
Ve ben ilk istediğinizi varsayalım
Bu satırları oldukça büyük olması.

838
00:38:09,180 --> 00:38:10,450
36 piksel.

839
00:38:10,450 --> 00:38:11,530
Yani iyi bir boyutu var.

840
00:38:11,530 --> 00:38:13,240
Ve ben cesur olmak ağırlığını istedi.

841
00:38:13,240 --> 00:38:15,450
Ama sonra bunun altında,
Ben küçük metin istiyorum.

842
00:38:15,450 --> 00:38:19,980
Ve bunun altında, ben istiyorum
hatta küçük metin.

843
00:38:19,980 --> 00:38:20,480
Özür dilerim.

844
00:38:20,480 --> 00:38:24,490

845
00:38:24,490 --> 00:38:26,940
Bugün kapalı bir gün gibi hissediyor.

846
00:38:26,940 --> 00:38:29,840
>> Yani şimdi, ben bu ifade ne yapıyorum?

847
00:38:29,840 --> 00:38:34,580
Burada hat 22 üzerinde gömülü olduğunu
div veya iç içe div, eğer sen.

848
00:38:34,580 --> 00:38:36,190
Çok kendi stil etiketi vardır.

849
00:38:36,190 --> 00:38:38,160
Ben 36 bir yazı tipi boyutunu belirtin.

850
00:38:38,160 --> 00:38:40,460
Ben cesur bir yazı ağırlığı belirtin.

851
00:38:40,460 --> 00:38:43,360
Burada aşağı, ben sadece 24 piksel belirtin.

852
00:38:43,360 --> 00:38:45,960
Ve nihayet, hat 28, ben 12 belirtin.

853
00:38:45,960 --> 00:38:49,070
Yani sadece hızlı aklı kontrol olarak
ve bir insan okuma olarak bu,

854
00:38:49,070 --> 00:38:52,545
Ekranda hangi kelimeler
aslında cesur olacak?

855
00:38:52,545 --> 00:38:56,100

856
00:38:56,100 --> 00:38:58,760
Hangi çizgiler aslında kalın?

857
00:38:58,760 --> 00:38:59,570
>> Sadece John Harvard.

858
00:38:59,570 --> 00:39:00,070
Sağ?

859
00:39:00,070 --> 00:39:05,940
Hat 22 hey diyor gibi çünkü
Tarayıcı, burada sayfanın bir bölümü var.

860
00:39:05,940 --> 00:39:07,920
O yazı tipi boyutu 36 noktaya olun.

861
00:39:07,920 --> 00:39:09,460
Yazı ağırlığı kalın olun.

862
00:39:09,460 --> 00:39:11,920
En kısa sürede ulaşırken
İlgili bitiş etiketi

863
00:39:11,920 --> 00:39:15,340
veya hat 24 kapalı etiketi,
Bu araçlar, hey tarayıcı,

864
00:39:15,340 --> 00:39:17,640
Eğer yapıyorsun ne olursa olsun yapıyor durdurmak.

865
00:39:17,640 --> 00:39:21,020
Ve haber olsa da, açık olması
hat 22 bu özelliklerin hepsi var

866
00:39:21,020 --> 00:39:24,430
tarzı gibi, sizi
hat 24 etiketi kapatın

867
00:39:24,430 --> 00:39:25,940
Yalnızca etiketinin adını anma.

868
00:39:25,940 --> 00:39:29,990
>> Sen kelime stili tekrarlamak değil ya
Bu tırnak içinde bulunuyor şey.

869
00:39:29,990 --> 00:39:32,860
Ve şimdi bu bak eğer öyleyse
Benim tarayıcıda, en atalım

870
00:39:32,860 --> 00:39:38,060
Bir sonuca bak. Bırak gideyim
Önümüzdeki CSS 0 bu dosyaya.

871
00:39:38,060 --> 00:39:41,814
Ve bu, oldukça düz hala
ama oldukça ilginç oluyor.

872
00:39:41,814 --> 00:39:43,980
Ama orada çıkıyor
Burada yapabileceğiniz başka şeyler,

873
00:39:43,980 --> 00:39:46,490
ve verme riski
Tamamen iğrenç bu,

874
00:39:46,490 --> 00:39:48,630
burada fark benim
benim web sayfasının gövde,

875
00:39:48,630 --> 00:39:53,930
Ben komik bir şey yapabilirim
bg veya arka plan rengi gibi.

876
00:39:53,930 --> 00:39:56,670
>> Ve hızlı, en sevdiğiniz renk nedir?

877
00:39:56,670 --> 00:39:57,720
Yeşil duydum.

878
00:39:57,720 --> 00:39:58,750
Pekala.

879
00:39:58,750 --> 00:40:02,920
Yani şimdi, ben şimdi reload vurursan,
Biz yeşil bir web sayfası var.

880
00:40:02,920 --> 00:40:04,710
Pekala, o kadar da kötü değil.

881
00:40:04,710 --> 00:40:08,350
Ve şimdi, ben bu yapmak istiyorsanız gerçekten
Serin, benim metnin renk yapabilirsiniz

882
00:40:08,350 --> 00:40:09,360
Hatta kırmızı.

883
00:40:09,360 --> 00:40:10,870
Yani bu neye benzediğini görelim.

884
00:40:10,870 --> 00:40:12,230
Şimdi oldukça iyi görünüyor.

885
00:40:12,230 --> 00:40:15,460
Ve burada, eğer gerçekten
biriyle uğraşmak istiyorum

886
00:40:15,460 --> 00:40:17,487
veya olmak istiyorsanız
insanlardan biri kim

887
00:40:17,487 --> 00:40:20,570
Bir web ziyaret sizi kandırmak için çalışır
sayfa, Google kandırdın çünkü

888
00:40:20,570 --> 00:40:27,610
düşünce içine bir sürü var
Anahtar kelimeler bakalım da-- bölgesinin yeniden.

889
00:40:27,610 --> 00:40:29,020

890
00:40:29,020 --> 00:40:30,680
Nereye gitti?

891
00:40:30,680 --> 00:40:31,530
Ve bizi oraya olmuyor.

892
00:40:31,530 --> 00:40:32,030
Pekala.

893
00:40:32,030 --> 00:40:34,905
Ben bir kenara olarak söylüyorum Yani, biz olacak
Bir kaç hafta içinde bu şeyler hakkında konuşmak

894
00:40:34,905 --> 00:40:36,740
biz hakkında konuşmak zaman
Güvenlik, eğer gerçekten

895
00:40:36,740 --> 00:40:38,852
ve embed bütün demet
Bir web sayfasında anahtar kelimeler,

896
00:40:38,852 --> 00:40:41,810
onlar görünmez olsanız bile
Google gibi insan, kimse, elbette,

897
00:40:41,810 --> 00:40:43,250
Hala aslında bu bulabilirsiniz.

898
00:40:43,250 --> 00:40:45,820
Pekâlâ, ne güzel
oldukça hızlı bir şekilde çirkin.

899
00:40:45,820 --> 00:40:48,420
>> Ve aslında, hepsi değil
Kendi web aksine bu kadar

900
00:40:48,420 --> 00:40:51,480
Bir lisans, sayfa olan
Ben bulmak için etrafında googling başladı

901
00:40:51,480 --> 00:40:53,690
Eski web sitelerinin geçmiş sürümleri.

902
00:40:53,690 --> 00:40:54,500
Bu çok kötü oldu.

903
00:40:54,500 --> 00:40:56,650
Aslında buldunuz
Sadece sınıfta önce bir.

904
00:40:56,650 --> 00:40:58,620
Ama orada kötüsü var.

905
00:40:58,620 --> 00:41:01,534
Bu görünüşte oldu benim
1996 yılında ana sayfa.

906
00:41:01,534 --> 00:41:04,200
Anlaşılan o olduğunu düşünmüş
İnsanlara kendi adını sormak için uygun

907
00:41:04,200 --> 00:41:05,991
ellerinden geldiğince önce
Aslında benim web sayfasına bakın.

908
00:41:05,991 --> 00:41:09,380

909
00:41:09,380 --> 00:41:11,920
>> Ve sonra onları gösterdi
Muhtemelen aptalca bir şey.

910
00:41:11,920 --> 00:41:13,450
Ben bir dahaki sefere daha kazıp edeceğiz.

911
00:41:13,450 --> 00:41:16,220
Ama şimdi, haydi
tasarımın biraz düşünün.

912
00:41:16,220 --> 00:41:17,444
Biz stil hakkında konuştuk.

913
00:41:17,444 --> 00:41:19,735
Ve bu sayfayı bugüne kadar ve
Ben yazdım her şeyi

914
00:41:19,735 --> 00:41:21,890
biçimsel oldukça temiz.

915
00:41:21,890 --> 00:41:23,320
Ama tasarım hakkında ne olacak?

916
00:41:23,320 --> 00:41:25,990
Eh, fazlalık bir çok şey var
Burada yapıyorum ne.

917
00:41:25,990 --> 00:41:28,156
>> Ben kelime söz ettik
yerlerde birkaç renk.

918
00:41:28,156 --> 00:41:31,630
Ben bir kaç yazı tipi boyutunu söz ettik
yerlerde birkaç yerler ve cesur.

919
00:41:31,630 --> 00:41:34,870
Ve temelde, ben co değilim
iki dil karışarak.

920
00:41:34,870 --> 00:41:38,100
Ben etiketleri ile HTML var benim
nitelikleri ve sonra aniden,

921
00:41:38,100 --> 00:41:40,100
tırnak arasında, ben
ikinci dil Bugün

922
00:41:40,100 --> 00:41:43,830
Yine, sadece bu denir CSS,
Anahtar değer çiftleri veya bu özellikler

923
00:41:43,830 --> 00:41:45,280
iki nokta üst üste ile ayrılmış.

924
00:41:45,280 --> 00:41:47,700
>> O kadar çıkıyor
gibi C nerede

925
00:41:47,700 --> 00:41:50,550
dışarı faktör başlayabilirsiniz
başlık dosyaları içine bazı kod,

926
00:41:50,550 --> 00:41:53,520
bu yüzden HTML aynı şeyi yapabilirsiniz.

927
00:41:53,520 --> 00:41:56,030
Aşağıdaki gibi Ve bu doğru bir adımdır.

928
00:41:56,030 --> 00:42:02,230
Bu sürüm, CSS1.html olduğuna dikkat edin
aynı web sayfasını yapısal.

929
00:42:02,230 --> 00:42:05,250
Yani bir sürü var
divs, ama bu kez ben oldum

930
00:42:05,250 --> 00:42:07,220
sargı kurtulmak kazanılmış
sizin de göreceğiniz gibi div.

931
00:42:07,220 --> 00:42:12,390
>> Ve ben bu üç divs verdik
üst, orta ve alt, benzersiz kimlikler.

932
00:42:12,390 --> 00:42:14,760
Bunun nedeni tarafından güzel,
Bu bölünmeleri veren

933
00:42:14,760 --> 00:42:18,715
Sayfanın benzersiz tanımlayıcılar,
Ben başka bir yerde bunları başvuruda bulunabilir.

934
00:42:18,715 --> 00:42:19,215
Nerede?

935
00:42:19,215 --> 00:42:21,070
Peki, beni yukarı edelim.

936
00:42:21,070 --> 00:42:24,070
Ve bugüne kadar, her zaman biz baktım
Bir web sayfasının başında, ne

937
00:42:24,070 --> 00:42:28,560
Biz yaşadım sadece etiket
Bir web sayfasının başkanı?

938
00:42:28,560 --> 00:42:29,740
Biraz daha yüksek sesle.

939
00:42:29,740 --> 00:42:30,799
Sadece başlık bugüne kadar.

940
00:42:30,799 --> 00:42:32,590
Ama orada çıkıyor
birkaç diğer şeyler

941
00:42:32,590 --> 00:42:35,840
Eğer orada birini koyabilirsiniz
hangi bir stil etiketi denir.

942
00:42:35,840 --> 00:42:37,850
Yani bir an önce, biz baktı
Bir stil özniteliği.

943
00:42:37,850 --> 00:42:39,150
Bir stil etiketi var ortaya çıktı.

944
00:42:39,150 --> 00:42:41,200
Bu içinde aittir
Bir web sayfasının başkanı.

945
00:42:41,200 --> 00:42:42,840
Ve şimdi ne yapıyorum dikkat edin.

946
00:42:42,840 --> 00:42:46,540
Ben bu içinde var
stil etiketi aşağıdaki.

947
00:42:46,540 --> 00:42:51,190
Ben tam anlamıyla hat 20 söz ediyorum
Ben stilize istediğiniz etiket adı.

948
00:42:51,190 --> 00:42:53,489
>> Sonra açık küme ayracı var
ve küme ayracı kapattı.

949
00:42:53,489 --> 00:42:56,030
, C ruhu içinde çok benzer ama
Yine, bu bir işlev değil,

950
00:42:56,030 --> 00:42:57,796
Bu burada sadece bir sözdizimsel bir detay.

951
00:42:57,796 --> 00:43:00,170
Ve sonra tabii ki, ben söylüyorum
Tarayıcı, hey tarayıcı,

952
00:43:00,170 --> 00:43:05,210
Sayfanın tüm vücudunu yapmak
merkezi bir metin hizalama var.

953
00:43:05,210 --> 00:43:06,930
Ve sonra bu aşağıdaki söylüyor.

954
00:43:06,930 --> 00:43:12,600
Hey tarayıcı, bir HTML görürseniz
sayfa unsur veya etiket o

955
00:43:12,600 --> 00:43:17,040
üst, özel bir tanımlayıcıya sahiptir
yani karma sembolü burada sadece anlamına gelir

956
00:43:17,040 --> 00:43:21,010
üst benzersiz bir fikir, go ahead
ve yazı tipi boyutunu yapmak 36

957
00:43:21,010 --> 00:43:22,490
ve yazı ağırlığı kalın.

958
00:43:22,490 --> 00:43:26,840
>> Hey tarayıcı, kimin bir eleman
Kimlik 24 piksel yapmak, orta olduğunu.

959
00:43:26,840 --> 00:43:31,070
Ve hey tarayıcı, görürseniz bir
alt fikri, bu 12 piksel yapın.

960
00:43:31,070 --> 00:43:33,540
Sonunda etkisi
Tam Sam.

961
00:43:33,540 --> 00:43:36,500
CSS 1 giderseniz,
sayfa aynı görünüyor.

962
00:43:36,500 --> 00:43:39,810
Ama biz doğru bir adım uzaktasınız
biraz daha iyi bir tasarım.

963
00:43:39,810 --> 00:43:44,850
Bana şimdi BB2'ye buraya geri dönelim
ve yaptığım başka ne olduğunu görmek.

964
00:43:44,850 --> 00:43:48,030
>> Şimdi sayfa gerçekten çok temiz.

965
00:43:48,030 --> 00:43:50,730
Aslında, tüm sığabilecek
Burada bir sayfada içindekiler.

966
00:43:50,730 --> 00:43:54,270
Ama ne yeni etiket I var
Açıkçası, tanıttı?

967
00:43:54,270 --> 00:43:54,770
Bağlantı.

968
00:43:54,770 --> 00:43:57,853
Ve bu, bir etiket için en iyi isim değil
bu anlamda bir bağlantı değil çünkü

969
00:43:57,853 --> 00:44:00,780
bunu biliyorum, ama bu demektir ki
diğer bazı dosyasında bir bağlantı.

970
00:44:00,780 --> 00:44:02,890
Bu keskin C dahil benzeri tür

971
00:44:02,890 --> 00:44:06,280
>> Bu HTML yoludur
tarayıcıyı hey demek,

972
00:44:06,280 --> 00:44:10,240
içeriğini gidip
Dosya css2.css denir.

973
00:44:10,240 --> 00:44:12,880
Ilişki, benim için,
Bir stil sayfası olmasıdır.

974
00:44:12,880 --> 00:44:17,980
Ve gerçekten de, bu ne bir
Basamaklı stil sayfaları vasıtası S kullanıcısının.

975
00:44:17,980 --> 00:44:20,350
Bu bir stil olduğunu.

976
00:44:20,350 --> 00:44:23,120
Bu içeren sadece metin dosyası var
mülkiyet bir sürü.

977
00:44:23,120 --> 00:44:25,940
Bu stilleri bir sürü var
Bir sayfaya uygulamak istediğiniz.

978
00:44:25,940 --> 00:44:28,860
>> Ve böylece bu görünüşte
İkinci dosyaya atıfta.

979
00:44:28,860 --> 00:44:32,970
Ve bunu, CSS2.css açarsanız,
Tüm Yaptığım fark

980
00:44:32,970 --> 00:44:35,900
kopyalayıp yapıştırın olduğunu ve tüm
Bu dosyanın içine bu.

981
00:44:35,900 --> 00:44:38,220
Ve şimdi, hiç ettik bile
daha önce bu şeyler kodlu,

982
00:44:38,220 --> 00:44:40,700
Sadece birlikte düşünün
atasözü mühendislik şapka

983
00:44:40,700 --> 00:44:44,220
on, neden bu olduğunu
Muhtemelen daha iyi tasarım?

984
00:44:44,220 --> 00:44:48,910
Bu CSS özelliklerini dışarı Faktoring,
Kendi dosyasının içine koyarak.

985
00:44:48,910 --> 00:44:51,330
Olsa bile biz bu münhal
Sorun gibi beş dakika önce

986
00:44:51,330 --> 00:44:52,600
ilk versiyonu.

987
00:44:52,600 --> 00:44:55,730
>> Biz gelişmiş ettik
sayfa üslup,

988
00:44:55,730 --> 00:44:57,520
Bu sadece daha iyi
bir anlamda tasarım.

989
00:44:57,520 --> 00:44:58,990
Neden düşünüyorsun?

990
00:44:58,990 --> 00:45:01,510
Evet.

991
00:45:01,510 --> 00:45:02,260
Daha esnek nasıl?

992
00:45:02,260 --> 00:45:05,040

993
00:45:05,040 --> 00:45:05,540
Evet.

994
00:45:05,540 --> 00:45:07,373
Gitmek istediğiniz Yani eğer
sırt ve bir şeyleri değiştirmek,

995
00:45:07,373 --> 00:45:09,540
Şimdi, bir yere sahip
nereye şeyleri değiştirebilirsiniz.

996
00:45:09,540 --> 00:45:11,622
Ve aslında, bir şey
gibi sorun, yedi set

997
00:45:11,622 --> 00:45:13,690
Biz hayata edeceğiz nerede
hisse senedi alım satım sitesi,

998
00:45:13,690 --> 00:45:15,523
bir sahip olacak
sayfaları sürü.

999
00:45:15,523 --> 00:45:17,620
Ve gerçekten olurdu
can sıkıcı karar verirseniz, hm,

1000
00:45:17,620 --> 00:45:21,630
Ben gerçekten istiyorum, 24 piksel sevmiyorum
o 28 piksel veya biraz daha büyük olması.

1001
00:45:21,630 --> 00:45:23,550
Ve sonra bir yapmak zorunda
bul ve değiştir küresel

1002
00:45:23,550 --> 00:45:27,560
ya web sitenizin tüm dosyaları açmak
sadece aslında bir değeri değiştirmek için.

1003
00:45:27,560 --> 00:45:31,290
Bu stilleri faktoring
tek bir merkezi yerine,

1004
00:45:31,290 --> 00:45:34,720
Eğer şimdi bir metin dosyasını açabilir
herhangi bir program, CS50IDE olarak,

1005
00:45:34,720 --> 00:45:36,479
, bunu değiştirmek kaydetmek ve bitti.

1006
00:45:36,479 --> 00:45:38,270
Sen o yayılır ettik
Her yerde değişir.

1007
00:45:38,270 --> 00:45:42,450
Ve bu aynı olurdu
Bir nokta h dosyasında yanı.

1008
00:45:42,450 --> 00:45:46,697
Yani herhangi bir soru bu nedenle
kadar bu sözdizimi?

1009
00:45:46,697 --> 00:45:48,530
Pekala, biz ettik
Her şeyi o görünüyor yapılır

1010
00:45:48,530 --> 00:45:51,170
Aslında dışında köprüler uygulamak.

1011
00:45:51,170 --> 00:45:52,740
Ve bu yüzden devam edin ve bu yapalım.

1012
00:45:52,740 --> 00:45:54,830
Bana devam edelim ve
Burada yeni bir dosya oluşturun.

1013
00:45:54,830 --> 00:45:59,970
Ben onu aramak için gidiyorum
link.html, bugünün kod koymak.

1014
00:45:59,970 --> 00:46:03,000
>> Ve ben açık yapacağım
braket doc tipi html.

1015
00:46:03,000 --> 00:46:05,970
Bir kenara, bu şey olarak
top, bu doc ​​türü bildirimi,

1016
00:46:05,970 --> 00:46:08,420
Garip olan tek kişi o
ünlem işareti ile.

1017
00:46:08,420 --> 00:46:12,100
Sadece orada yapmak zorunda ve
HTML sürümü 5 kullanıyorsunuz demektir.

1018
00:46:12,100 --> 00:46:14,460
Eski sürümleri
dil daha uzun vardı

1019
00:46:14,460 --> 00:46:16,400
Eğer gerekli dizeleri oraya koymak.

1020
00:46:16,400 --> 00:46:18,620
Yani burada bağlantı denilen bir örnektir.

1021
00:46:18,620 --> 00:46:20,950
>> Burada benim web sayfası bir vücut gerekiyor.

1022
00:46:20,950 --> 00:46:29,770
Ve burada, a href eşittir
en HTTP://www.disney.com diyelim

1023
00:46:29,770 --> 00:46:35,420
ve benim en sevdiğim web sitesi, biz söyleyeceğim.

1024
00:46:35,420 --> 00:46:38,550
Pekâlâ, bu yüzden çok
zararsız, kullanıcı dostu sayfa.

1025
00:46:38,550 --> 00:46:42,950
Şimdi benim dizine giderseniz
Burada listeleme ve link.html açmak,

1026
00:46:42,950 --> 00:46:44,780
Biz hiper metin var.

1027
00:46:44,780 --> 00:46:47,410
>> Ve gerçekten de, bu nerede
HTTP H geliyor.

1028
00:46:47,410 --> 00:46:51,580
Üstmetin transfer protokolü
Metin aktarma hakkında

1029
00:46:51,580 --> 00:46:53,840
diğer kaynaklara köprüler vardır.

1030
00:46:53,840 --> 00:46:58,210
Ve gerçekten de, burada, tanıdık
Retro eğer, mavi link tıklandığında eğer,

1031
00:46:58,210 --> 00:47:02,607
Aslında Disney.com beni götürecek.

1032
00:47:02,607 --> 00:47:03,940
Şimdi, oh, o yakında geliyor.

1033
00:47:03,940 --> 00:47:08,970
Pekala, şimdi ne bazı
Bu yansımalarının?

1034
00:47:08,970 --> 00:47:11,610
>> Ve açıkçası, dünyanın başlar
biraz daha tanımak için

1035
00:47:11,610 --> 00:47:15,090
ve aynı zamanda küçük bir korkutucu
aynı zamanda biraz daha

1036
00:47:15,090 --> 00:47:17,840
Başlamadan kez savunulabilir öz
Bunları anlamak için.

1037
00:47:17,840 --> 00:47:21,610
Oran, bazılarınız, eğer gidersen Çünkü
Gmail spam klasörüne yoluyla ya da

1038
00:47:21,610 --> 00:47:23,990
Gelen kutunuzda, muhtemelen ettik
E-posta çeşit kazanılmış

1039
00:47:23,990 --> 00:47:26,980
Bunu değiştirmek isteyen var senin
Parola belki ya da belki doğrulamak

1040
00:47:26,980 --> 00:47:28,910
PayPal kimlik veya etajer.

1041
00:47:28,910 --> 00:47:34,510
>> Ve aslında, almış olabilir
Burada tıklama gibi bir şeyler söylüyor

1042
00:47:34,510 --> 00:47:42,260
PayPal şifrenizi sıfırlamak için.

1043
00:47:42,260 --> 00:47:44,130
Ve şimdi, eğer fark
Bu Disney.com değildir

1044
00:47:44,130 --> 00:47:51,600
gibi ama badplace.com ve
, yeniden unutmayın burada metin

1045
00:47:51,600 --> 00:47:53,710
olursa olsun bir şey söyleyebiliriz.

1046
00:47:53,710 --> 00:47:55,260
Ve aslında, bu sadece kelime.

1047
00:47:55,260 --> 00:48:04,610
Neden ben aslında süper kötü niyetli olmayın
ve http://www.paypal.com söylüyorlar.

1048
00:48:04,610 --> 00:48:14,090
>> Senin PayPal sıfırlamak Tıklayın
şifrenizi ve şimdi yeniden yükleyin.

1049
00:48:14,090 --> 00:48:16,220
Bu hak, oldukça meşru görünüyor?

1050
00:48:16,220 --> 00:48:20,470
Ben tıklayınız olmaz, yani
sadece bu diyor bir email gönder.

1051
00:48:20,470 --> 00:48:22,450
Ama burada ikilemi dikkat edin.

1052
00:48:22,450 --> 00:48:26,880
Bu www.paypal.com diyor
ve aslında, bir dakika bekleyin,

1053
00:48:26,880 --> 00:48:29,210
biz istediğini biliyorum
güvenlik s.

1054
00:48:29,210 --> 00:48:35,450
Yani şimdi, www.paypal.com HTTPS gidin,
ama daha önce hiç yapmadım eğer,

1055
00:48:35,450 --> 00:48:38,182
alışkanlığı içine alabilirim
Burada küçük bağlantıları üzerinde uçan.

1056
00:48:38,182 --> 00:48:39,890
Ve görmek zor
Orada ekranda

1057
00:48:39,890 --> 00:48:41,340
ve burada tüm bu daha kolay olur.

1058
00:48:41,340 --> 00:48:43,615
Ama yol aşağı burada
minicik köşe

1059
00:48:43,615 --> 00:48:45,740
aslında tarayıcı yok
Gittiğimiz söylüyoruz

1060
00:48:45,740 --> 00:48:48,850
yerine paypal.com bir badplace.com için.

1061
00:48:48,850 --> 00:48:51,620
Şimdi, nereye varmaya çalışıyorsun?

1062
00:48:51,620 --> 00:48:54,859
Bugün yaptık tüm örnekler,
biz sabit kodlanmış ve manuel yazdığınız.

1063
00:48:54,859 --> 00:48:56,900
Web inanılmaz bir
ilginç sizi zor

1064
00:48:56,900 --> 00:48:59,844
Bu içeriğin, böylece web sayfaları kod
statik ve asla değişiyor.

1065
00:48:59,844 --> 00:49:01,760
Tabii ki, bizim tüm
favori web siteleri bugün,

1066
00:49:01,760 --> 00:49:04,470
Gmail veya Twitter ya da olsun
Facebook ya da diğer herhangi bir sayı

1067
00:49:04,470 --> 00:49:05,290
dinamiktir.

1068
00:49:05,290 --> 00:49:07,340
Onlar değişiyor ediyoruz
Kullanıcı girişine yanıt

1069
00:49:07,340 --> 00:49:08,840
Sadece Google arama sonuçlarında gibi.

1070
00:49:08,840 --> 00:49:12,415
>> Ve böylece Çarşamba günü, ne do
Biz HTML ve CSS giriş bırakın

1071
00:49:12,415 --> 00:49:14,290
Aldığımız ve arkamızda
Şimdi biz hafife

1072
00:49:14,290 --> 00:49:16,640
Bunu biliyoruz ve tanıtmak
yeni bir programlama dili

1073
00:49:16,640 --> 00:49:19,050
gibi denir PHP,
C, bize verecek

1074
00:49:19,050 --> 00:49:22,450
aslında programları oluşturmak için güç
kendileri bu çıktıyı üretir.

1075
00:49:22,450 --> 00:49:25,900
Bu durumda, biz kullanarak olacak
PHP dinamik web üretmek için

1076
00:49:25,900 --> 00:49:27,340
Bu yeni dili kullanarak sayfaları.

1077
00:49:27,340 --> 00:49:28,989
Çarşamba günü bu konuda Böylece daha fazla.

1078
00:49:28,989 --> 00:49:29,530
Sonra görüşürüz.

1079
00:49:29,530 --> 00:49:33,130

1080
00:49:33,130 --> 00:49:37,380
>> [MÜZİK OYUN]

1081
00:49:37,380 --> 00:52:38,864