DAVID J. MALAN: Pekala.
Biz geri döndü.
Yani, bu son oturumun amacı birkaç kavramları tanıtmaktır
ama aynı zamanda herkese bir şans verin tür parmaklarınızı germek için
ve gerçekten bir şeyler yapmak Biraz hands-on.
amaç değil açmak için Hepimizi web geliştiricileri içine
herhangi bir yolla ama gerçekten sadece tarafından bazı bir tat vermek için
Ne temel yapıları web programlama ve web bugün gider
gelişimi, yani seyleri statik tarafı
hiçbir mantığı, hiçbir programlama dil, sadece statik içerik.
Ve bu bize bir fırsat verecektir aslında bir web sunucusu ne olduğunu görmek için,
bir HTML dosyası nedir, ne görmek bkz HTTP aslında hizmet veren olmasıdır.
Ama biz, herhangi bir retrospektif dalış önce cloud computing ile ilgili sorular
güvenlik veya aralarında bir şey yoksa?
>> Yok hayır?
Pekala, haydi Her ihtimale karşı, bunu
kaydolma işlemi bir şey birkaç dakika sürer.
Biz arka planda bunu bildireceğiz.
eğer yapabilirsen, devam edin, Bu URL burada-- c9.io. için
Bu bir üçüncü taraf olduğunu service-- bir hizmet olarak platform, sen will-- eğer
sizi davet edecek Bir hesaba kaydolmak için,
ve her biriniz vermek için gidiyor Sözde bulutta bir hesap
Başkasının altyapı, Bir şirket Cloud9 çağırdı.
Ama hakkında güzel ne Bu size vermesidir
Bir bir yaklaşım Gerçek gerçek dünya geliştirme
çevre, gerçi içinde bulut ve bir web tarayıcısında,
ve biz aslında için kullanacağız Bugün biraz deneme.
Ve sonra devam edin ve sadece gezinmek kayıt işlemi için yol
Eğer yapabilirsen.
Bu yüzden sınıfta bu kullanmak için ne Ben, tüm öğrencilerimizin öğretmek
Kampüste ve şimdi kapalı, hem de ne tarihsel yerini oluyor
Aksi takdirde indirilebilir yazılım oldu.
Peki ne erişim sağlamasını edildi Bu sanal makinelerin biridir,
esas olarak, daha önce tarif edilen.
Yani bu şirket Cloud9 muhtemelen Nitekim üçüncü party-- kiraladığı
Bu durumda, bir bütün Google-- sanal makinelerin demet
onlar bir şekilde içine doğramak olduğunu Bireysel sunucuların yanılsama
Her birimiz o üzerinde tam kontrol sahiptir.
Bunu söylemek oldukça doğru değil Onlar sanal makineler olduğunu,
olsa da, çünkü neyi Cloud9 aslında kullanır
biraz daha yeni bir teknoloji konteynerleflme denir.
Ve bana bu resmi kapmak izin Burada bu resmi boyamak için.
>> Bir kap halinde, olduğu resmi çağırmak
çakmak önce, biraz dan bir sanal makineye daha ağırlık.
Aslında, son oysa zaman biz orada hakkında konuştuk
Bir işletim olma sistemi ve hipervizör
ve daha sonra konuk işletim sistemi, konuk işletim sistemi, konuk işletim
üstünde sistem, senin fiziksel donanım,
Bu daha yeni fark teknoloji konteynerizasyon,
hepsi bir şekilde paylaşmak olduğunu Aynı işletim sistemi.
Ama yine de oluşturmak herkesin yanılsama
kendi özel olan yönetici hakları ve dosyalar
sunucuda.
Ama az bir yazılım var Sen ve donanım arasında.
sonucu olarak, bir teori, daha yüksek bir performans,
Kullanmakta olduğunuz için ya da daha az kaynak israf
sözde sanallaştırma katmanda.
Yani bu denir doğası gereği konteynerleflme
Docker olarak adlandırılan teknoloji yoluyla, hangi çok kendi içine geliyor.
Ve bu bir şey olduğunu Şirketinizde mühendisleri
çeşit çeşit konuşmaya başlayabilir yaklaşık yakında değil zaten varsa,
hayır kesinlikle orada olsa nedeni herhangi bandwagons atlamak için.
>> söyledi Yani, ne muhtemelen şimdi bakın
Bu gibi biraz görünüyor bir ekran.
TAMAM.
değilse ve sadece beni arayın.
Ve yani-- eğer değilse üzerine geleceğiz.
Devam edin ve bu büyük tıklayınız artı bir çalışma alanı oluşturmak için,
ve bunun gibi bir ekran görürsünüz.
Sen çalışma alanını çağırabilirsiniz Şimdilik istediğiniz herhangi bir isim.
Ve aslında sadece basitlik için, Iyi bazılarınız ve- gitmek
Zaten çalışma alanları var.
,, Iş zaman-- ne diyoruz istediğiniz ne olursa olsun Harvard, Perşembe,.
Sen bir açıklama gerekmez.
Sen, özel bırakabilirsiniz sürece Zaten çalışma alanlarının bir grup var.
Eğer kamu yapmak zorunda iseniz, bugünün amaçlar için iyidir.
Burada da, Upsells biridir.
Sen bir özel çalışma alanı almak varsayılan. Ama sen, daha fazlasını isterseniz
Daha fazla ödemek zorunda.
Aksi halde kuvvet iş genel yapmak.
Ama bu çünkü onlar da iyi, açık kaynak toplulukları bu hedef
İnsanları teşvik etmek Aslında işbirliği.
>> Ve önemli olan son şey, Eğer bir isim seçtikten sonra olsa da, bir
ve özel veya kamu seçtikten sonra, HTML5, büyük turuncu simgesini
Soldan ikinci ve sonra Çalışma alanı Oluştur'u tıklatın.
Ve muhtemelen olacak , Ya da öylesine bir dakikanızı ayırın
ama o zaman bir gerekir çevre, sana bir kez
anımsatan görünüyor, bunu Ben şimdi burada ekranda ne var.
Ama, yine de, bir dakika sürebilir ya da daha fazla bu ekrana almak için
Eğer tıkladıktan sonra Çalışma Alanı oluşturun.
Beni isterseniz ama sadece beni bayrak bir şey ya da tavsiye bakmak için.
Pekala.
Yani şimdi bu arka plan gidiyorum.
Eğer görünüyor eğer beni arayın Herhangi bir teknik sorunlar var.
Ama, yine de, bir sürebilir Bu açmak için biraz.
Ve en go ahead ve bahsedelim neler aslında bir web sayfası yapmak anlamına gelir,
Ne HTML nedir ve nasıl tüm bu Biz başlıyoruz şimdi birbirine
Aslında teknolojinin bazı kullanın.
Bu yüzden elimden çıkıyor Burada benim küçük Mac gitmek,
denilen basit bir programı açmak TextEdit veya Windows I could
Notepad.exe denilen açık bir şey.
Ve ben sadece basit bir şey yapabileceğini bu-- "Merhaba, dünya." gibi
Ve sonra da bu kurtarabilecek hello.txt Yani hiçbir büyü.
Bu web ile ilgisi yok programlama, HTML ile ilgisi.
Sadece basit bir metin dosyası oluşturma.
Ama bir web çıkıyor sayfa kelimenin tam anlamıyla sadece budur.
Basit bir metin dosyası içeren metin var Eğer klavyeden yazdığınız diye,
ancak, tipik olarak ama her zaman değil .txt ama .html veya .htm değil biter.
Ve sen sadece yok dosyadaki kelimeleri yazın.
Aslında denilen şeyler kullanmak zorunda etiketler ya da daha genel olarak, bir şey
işaretleme dili aradı.
>> Bu yüzden çok hızlı bir şekilde yazın gidiyorum ve sonra aşağıdaki açıklar.
Ben ilk gidiyorum Diyor ki bu yazın
Hey, tarayıcı, buraya gelir bir web sayfası HTML ile yazılmış.
Ve bu iki şey bir arada, hey, demek tarayıcı, aşağıdaki aslında HTML.
Hey, tarayıcı, buraya gelir Baş ya da benim sayfanın üst.
üst Hey, tarayıcı, iç Benim sayfa, merhaba ", bir başlık koymak
dünya. "
Hey, tarayıcı, sonra kafa benim sayfa, burada benim sayfanın vücudu geliyor.
Ve, hey, tarayıcı, vücut benim sayfası da "merhaba dünya." demeliyim
Yani belirgin ayrıntılar burada nelerdir?
Bu genellikle ne olduğunu doc-türü bildirimi denilen,
ve açıkçası, biraz var Bu ilk bakışta ezberlemek zor.
Sadece biraz kopyala-yapıştır bunu.
Bu resmi bir yoldur hey, söyleyerek, tarayıcı,
HTML sürüm 5 kullanıyorum hangi Biraz son zamanlarda çıktı.
Bazı o büyülü sözler var tasarım kötü bir duygusu ile insanlar
koymak için karar Dosyanın çok üst.
öyle olsa bile Biraz gizemli, hepsi bu
Burada, hey, tarayıcı means-- HTML sürüm 5 ile birlikte gelir.
>> Bu geri kalanı bizimle olmuştur Bir süredir, tarihsel olarak,
ancak gelişen olmuştur, ve bu kadar muhtemelen biraz daha basit elde edilmiştir.
Birkaç özelliklerini fark Ben vurguladık ne.
açılı bu şeyler var Sol dirsek brackets--
ve sağ ayraç.
Ve burada simetri dikkat edin.
Ve simetri, ben gibi, demek ben Burada bu başlangıç ​​etiketi veya açık etiketine sahip
eğer sen, buraya bir var yakın etiketi veya var bir bitiş etiketi
Sadece ölçüde bu olduğu gibi farklı kelimenin başında çizgi
HTML.
Ve aklınıza gelebilecek Bu raslantı olduğu gibi
hey, daha önce öneren tarayıcı, burada bazı HTML geliyor.
Ve tersine, hey, tarayıcı, o o HTML-- başlangıç ​​ve bitiş için.
>> Burada arada hey, tarayıcı, Benim sayfanın baş geliyor.
Hey, tarayıcı, o kafa bu kadar.
Hey, tarayıcı, burada Benim sayfanın gövde.
Hey, tarayıcı, bu vücut için bu kadar.
Ve içindeki bu bazı Şimdilik keyfi metin.
Ve kafamın içinde, bu arada, bazı keyfi ancak etiketli bir
böylece, başlık diyor metni konuşmaya sayfamın "merhaba dünya." olacaktır
Şimdi, üzere hemen yapabilirsiniz Bu tarayıcılar varsayalım
daha ziyade, web sayfaları var, Sadece-- ya da Sadece iki baş ve vücudu parts--.
Ve baş sadece genellikle Menü çubuğunun gibi, şeyler
gerçekten sadece çok üstünde.
Ve vücut sayfa cesaret olduğunu, O büyük dikdörtgenin içinde her şey
Bu ekranı doldurur.
Bu yüzden go ahead ve bunu yapmak için gidiyorum.
Ben önde gidecek ve Kaydet 'i tıklatın, Kaydet Dosya.
Ve ben kurtarmak için gidiyorum Bu hello.html olarak,
ve ben sadece gidiyorum benim masaüstünde koydu.
Ve ben gidiyorum önde ve Kaydet'i tıklatın.
Ve benim Mac notice-- en azından bana bağırıyor.
Bunu yapmak istediğinizden emin misiniz?
Ve evet, HTML kullanmak, söylemek için gidiyorum.
Ben bu durumda daha iyi biliyorum.
Ve şimdi benim masaüstü gidiyorum nerede aniden bu dosya var.
Ve bunu çift tıklayın gidiyorum.
Ve tarafından, fark edeceksiniz Varsayılan Chrome açtı.
çünkü o budur Varsayılan tarayıcı.
Ve bu sadece "merhaba dünya" diyor.
Ama, merhaba "diyor iki yerde dünya ".
Üst sol dikkat edin.
Bu kaçırmak oldukça zor.
Bu büyük ve kalın olduğunu.
Ve burada başka o görünüyor , "Merhaba dünya" demek?
>> İZLEYİCİ: sekmesi.
>> DAVID J. MALAN: Evet, sekme kendisi.
Yani başkanı söyledi sayfa her şey iyi-- olduğunu
ve aslında bu başlık.
Sadece burada sekmesinde var.
Ve ben bu sekmeyi indirebiliriz dışarı karıştırmayın şekilde değil.
Bu, artık sadece tek bir sekme ve gerçekten biz "Merhaba dünya" bakın
buraya ve "merhaba dünya" burada.
Yani oldukça basit.
Ama aynı zamanda oldukça basit.
Ve, aslında, yakınlaştırılmış.
Ben sadece yazı tipi boyutunu değiştirmek için erişilebilirlik için büyütün.
Ama şimdi bir şey yapalım biraz daha ilginç.
>> Ben whoops, izin go-- gidiyorum benim metin dosyasına geri almak.
Ben geri dönüyorum benim metin dosyası, ve ben gidiyorum
Bunu değiştirmek ve söylemek "Merhaba, Disney World."
Kayıt etmek.
Ve geri dönmek benim tarayıcı ve yükle 'yi tıklatın.
Ve şimdi, tabii ki, onu "Disney World" diyor.
Ve ben yapay yakınlaştırmak için gidiyorum sadece bu yüzden o daha rahat görebilirsiniz.
Yani şimdi, ne yazık ki, ben tür istiyorum aşağıdaki amaçlara aslında, bu bir Mac özellik.
Ben Disney World'e tıklayın istediğiniz ve disney.com gibi bir yere gitmek,
ama bu işe yaramazsa.
Yani web temel ilkelerinden biridir köprüler, başka bir yere gitmek bağlantılar.
Peki bunu nasıl yapacağım?
Eh, ben sadece söyleyebiliriz, "Merhaba, http://www.disney.com."
Bunu kaydet.
Yükle.
Ama bu da, tıklanabilir değil.
Ve olsa bile, burada güzel ne Bu, henüz işlevsel değildir
o görünüyor olmasıdır tarayıcı tam anlamıyla sadece yapar
ne yapmam için bunu söylemek.
Yani sadece bu gibi bir URL yazarsanız, Sadece bana URL'yi göstermek için gidiyor.
Ben etiketleri veya biçimlendirme kullanmanız gerekir dil aslında anlatmak için
tarayıcı daha yapmak.
Yani önde gidiyorum ve Bir an için bu silin.
Ve ben, hey, söyleyeceğim tarayıcı, burada bir çapa başlatmak,
bir bağlantı tabiri caizse.
Ve hiper referans, hedef Bu çapa, bu URL olmalıdır.
Ve benim tırnak dikkat edin.
Ben de tek tırnak kullanabilirsiniz, ama tutarlı olmak zorunda,
ve ben genellikle sadece kullanmak çift ​​tırnak basit tutmak için.
Ben etiketi kapatmak için gidiyorum dikkat edin.
Ve sonra burada ben gidiyorum "Disney World." Demek
Ve şimdi biraz symmetry-- ihtiyacım açık aparatı, / a, dirsek kapattı.
>> Peki ne girmiştik?
Biz zaten bir kaç etiketi yaşadım.
HTML, Baş, Başlık, Vücut, tüm etiketler vardır, tabiri caizse,
açık ve kapalı meslektaşları ile.
Ama haber, bu tür bir temelde farklı.
Bu diyeceğiz ne HTML bir özellik.
Ve bir özelliktir Sadece bir anahtar-değer çifti.
Bu sık görülen bir şey olduğunu Bilgisayarın fen dersinden anahtar-değer çifti.
Bu ticaretin aracın tür.
Bir anahtar ve bir değer.
Bir kelime ve daha sonra bazı diğer kelime ya da kelimeler.
Bu durumda, anahtar, HREF ve değer konusunda tam URL.
Ve ne bir özellik yok öyle Bir etiketin davranışını etkiler.
Bu durumda, etki için gereken çapa etiketinin davranışı,
Biz çapa gerekiyor çünkü yere Bu linki.
Ve bu işi nasıl niteliğin arada.
>> Bu yüzden devam edeceğim ve şimdi dosyayı kaydedin.
geri tarayıcı ve yeniden yükleme gidin.
Ve, işte, şimdi var meşru bir web sayfası başlangıçlar.
Süper basit, ama gelirseniz üzerinde sol alt köşesinde bu-- haber,
süper-küçük.
Ama www.disney.com görüyorum.
Ve ben, gerçekten bu bunu tıklarsanız uzak disney.com beni whisks.
Şimdi, ilginç bir şey burada olmadığıdır
En pazarlanabilir URL'yi best--, ama Bu dosya yok çünkü bu iyi
World Wide Web üzerinde mevcuttur.
Görünüşe göre bir yerel dosya olarak var Benim Kullanıcılar directory-- / jharvard--
John Harvard-- / masaüstü için.
Ama bir URL'ye sahiptir.
Sadece yerel olur.
Ne yazık ki, içinizden hiçbiri ziyaret edebilirsiniz Bu, bu URL'yi yazarsanız, çünkü
Eğer, tarayıcınızı söylüyorum duyarım Bir dosya adı verilen hello.html arayın
Sabit diskinizde.
Ve, tabii ki, olduğunuz sürece manuel boyunca takip,
orada var gitmiyor.
>> Yani bu iyi.
Biz hala, sonuçta, bir yol gerekir web içine bu dosyayı almak için,
ama en birkaç ayrı alay edelim güvenlik etkileri ne sadece
gördüm ve daha önceki geri kravat Bu sabah tartışma.
Bu çıkıyor, bir eğer tarayıcı tam anlamıyla sadece yapar
Yapmam için bunu söylemek ve göründüğü gibi bir çapa etiketi durum için
değeri tarafından etkilenir Bu özellik olarak adlandırılan href
ancak bu görüntüler Metin, bu gibi görünüyor
Ben URL'yi koymak olabilir ima etmek her iki yerde de ve daha sonra yeniden
ve şimdi URL'yi görmek ve URL'ye gidin.
Uyarı, ben alt-sola üzerine gelirseniz, Ben gerçekten disney.com hala gidiyorum.
>> Hiç oldum eğer öyleyse phished-- P-H-I-S-H-E-D--
Bu sahte e-postalar biriyle PayPal banka gibi gelen,
muhtemelen içindeki bağlantıları gotten Bunu okuyorsanız e-posta
Eğer onaylamak gitmek için buraya tıklayın söyler şifrenizi veya doğum tarihinizi teyit
ya da sosyal ya da bir şey sosyal Seni mühendislik ifşa etmek
bilgi.
Eh, ben tür sürebilir Ben yapamadım, bu avantaj?
Ben bir şey söyleyebiliriz gibi, www.paypal.com.
Ve yerine Disney.com, ben badguy.com gibi, gidebiliriz.
Yükle.
Ve dupe ne kadar kolay olduğunu, Özellikle teknik olmayan bir okuyucu
ya da gelişigüzel bir okuma tıklayın daha okuyucu
Ben Durdur-- tıklarsanız böyle bir bağlantı, Aslında badguy.com gitmek istemiyorum.
Aslında orada ne olduğunu bilmiyoruz.
Yani paypal.com, haber, bir o gidiyor ne diyor,
ama tabii ki, ben aşağı bakacak olursak süper-düşük, o biraz bulanık
ama badguy.com diyor.
Bu sadece şu anda söylemek var ben yanlış yere gidiyorum.
Ve daha önce söylediğim zaman o bankalar Gerçekten teşvik veya tren olmamalı
tıklayarak bağlantılar içine kullanıcıları, bu Bunun sadece bir tezahürüdür.
Ve bu kadar basit.
Bir düşman eğer şimdi Eğer böyle bir şey yapmak
ve bir kullanıcıyı kandırmak için denemek sizin sitenizi ziyaret içine.
Ama şimdi, biz devam edeceğiz şeyler, güzel ve temiz.
Biz önde gidiyoruz ve bu değişiklikleri geri sarma.
Sayfayı yeniden yükleyin.
Ve geri disney.com gidin.
>> Biz alay edemez Bakalım Bu birbirinden biraz daha.
"Merhaba, Disney World." Yani
Ben buraya söylemek için gidiyorum.
Belki biraz yer açmak için gidiyorum.
"Size kaldınız umuyoruz!"
Kayıt etmek.
Yükle.
O değil rea-- değil Ben, doğru amaçlanan ne oldu?
Ben metin tedavi yaşıyorum Yani, Bir kelime işlemci gibi dosya,
Burada ne olacağını umut mı?
Evet, orada gibi hissediyorum Burada bir satır sonu olmalı,
bu yüzden bir şekilde buggy hissediyor.
Ama bu, aslında kasıtlı olduğunu , Tıpkı daha önce çünkü
Tarayıcınızın yalnızca gidiyor yapmanız bunu söylemek ne.
Ben satırları kırmak için söylemedim.
Hatta, aşağı taşımak için söyledim ettik Benim yaptığım gibi olsa da, sezgisel, hissediyorum.
Yani biz ihtiyacımız çıkıyor Biraz daha biçimlendirme,
ve ben şu şekilde bu sorunu gidermek için gidiyorum.
Merhaba öncelikle bu Önsöz için gidiyorum Bir paragraf etiketi denir ne.
Ve sonra ben önde gidiyorum ve bu diğer cümleyi sarın
Başka bir paragraf etiketi, olsa bile süper-kısa paragraflar konum.
Şimdi kurtarmaya gidiyorum.
Yükle.
Ve şimdi biz buna sahip uzay ve biz bir çeşit
semantik var iki ayrı paragraf.
>> Hepsi güzel ve iyi, ama it would Bu sayfayı bir resim eklemek için güzel,
bu yüzden aramaya gidiyorum Google Görseller'de Mickey Mouse.
Ve sadece eğlence için, ben Bu resmi kapmak için gidiyor.
Şimdi önde gidiyorum ve Bu resmin URL'sini kapmak,
Farklı var olsa yolları Bunu yapmak için.
Şimdilik, sadece URL'yi kopyalayın gidiyorum.
Ben metin içine geri dönmek için gidiyorum Dosya ve ben, burada söylemek için gidiyorum
img src = alıntı unquote Bu URL, süper uzun.
Bir ve daha sonra kavramı görüntü biraz farklıdır.
başlangıç ​​hiçbir kavramı gerçekten var Bir görüntü ve bir resim biten,
Bir başlangıç ​​gibi bir bitiş etiketi etiketlemek.
Bu yüzden biraz garip hissediyor Beni anlam Bunu yapmak için
bir yakın görüntü etiketi var.
Bu yanlış değil.
Bu mükemmel Doğru ve teşvik ediyor,
ama steno gösterimde var.
Ben aynı anda tür can açmak ve aynı etiketi kapatın
ve bu tarayıcı mutlu edecek.
Yani biraz var şeyler için daha özlü
kavramsal gerçekten yapmak başlangıç ​​ve bitiş mantıklı.
Onlar sadece orada, ya da değiller.
>> Yani bu tasarruf ve geri dönmek için gidiyorum Benim "merhaba dünya" sayfa ve yeniden yükleme için.
Ve bu, biraz kontrolden çıktı bu görüntü aslında, çünkü
Büyük bir küçük, ama bu sorun değil.
Ben bir programda yeniden boyutlandırmak olabilir.
Ya da biliyorum.
Sadece ben, göstermek için Aslında söyleyeceğini
Bu şeyin genişliği gerektiğini o sadece 200 piksel, 200 nokta olacak.
Beni go ahead ve kaydetmek izin ve sayfa şimdi yeniden ve
biraz daha makul görünüyor.
Ama desen dikkat edin.
Eh, biraz öğretti ettik tüm Bir anlamda HTML, en az
kavramsal, tüm HTML çünkü Bu, açık etiketleri, etiketler kapalı tags--
ve niteliklerini davranışlarını değiştirmek.
Ve görünüşe göre, her etiketi sıfır veya birine sahip olabilir
ya da iki ya da daha fazla özellik, her bir hangi yapar biraz farklı bir şey.
Şimdi, nasıl var biliyor musun?
Sadece birine dinlemek var olanı sana söyleyeyim gibi,
ya da bir öğretici etrafında sadece Google HTML, ve gerçekten bu basit.
>> Gerçekten, ben bir üniversite öğrencisi iken oldu yıllar önce ve HTML öğrendi
benim matematik öğretiminin biri yardımcıları sadece harcanan
Beni ders zaman biraz gibi yarım saat, bir saat,
ve sonra ben yoluma oldu.
Ben yapmak doğru yoluma oldu Şimdiye kadar en iğrenç web siteleri,
hangi görünüşe göre, ben değil Gerçekten ötesinde ilerlemiştir.
Ama nokta, bu senin kez Bu basit ideas-- anlama
oynamasından text-- ancak bu basit halinde Bir düşünceyi başlayan fikirler
ve, bir düşünce kapanış tutmak her şey güzel, dengeli
Kadar bir şey arıyorum değiştirerek Bu etiketin davranışı, gerçekten hepsi
buna vardır.
Ve aslında, biz şimdi gidersek Aslında google.com-- gibi bir şey,
Hadi biraz daha yer gidelim reasonable-- stanford.edu.
Ve ben görüntüle gitmek için gidiyorum Geliştirici, Kaynağı.
Bu çirkin, ama notice-- ve ben haber yakınlaştırmak olacak
Zaten tanıdık bazı şeyler.
Burada bu orada var hangi bir tarayıcı.
İşte HTML5 geliyor.
HTML var.
Görünüşe göre, orada bir Ben did not özniteliği
belirtir kullanmak Sayfanın dili,
ve bu otomatik yardımcı olabilir Böyle çeviri ve şeyler.
İşte sayfanın başı.
İşte Stanford sayfanın başlığı var.
Ben yaptığım bir etiket var yet-- Meta etiketi hakkında konuşmak.
Sadece bir çeşit bulunuyor arkaplan bilgisi.
SEO ile yardımcı olur, ya da Arama motoru optimizasyonu,
veya Google arama sonuçları veya benzeri.
Biz aramaya devam Ama, eğer tutmak seyir, burada Vücut etiketi.
Ve diğer demet var etiketler henüz konuştuk ettik.
Ama Div for a biridir Sayfanın bölümü.
Bu görünmez bir dikdörtgen gibi ne tür zihinsel istiyorsanız
içine sayfanızı bölmek Online farklı birimler.
divs Ve sonra bir sürü ben , Sınıf denilen şey görmek
ama biz geri geleceğiz.
>> Bu interesting-- Formlar olduğunu.
Formlar tüm web üzerinden vardır.
sen herhangi bir arama kutusu şimdiye kadar kullanılan bir formdur.
Ve, böylece, en doğrusu bakalım.
Form.
Aksiyon.
ne olursa olsun bu formun eylem tarihsel nedenler, bu URL.
Yöntem "post" dir.
HTTP istekleri kullanabilirsiniz çıkıyor Daha önce gördüğümüz gibi fiil, "olsun"
ya da "post".
Ve bir fark göreceksiniz Bir an bu.
en doğrusu bu ne olduğunu görelim.
me back Stanford sayfasına gidelim.
Ne biçim konuşuyorsun yaklaşık sizce?
Sana ne dışarı atlar?
>> İZLEYİCİ: Arama kutusu.
>> DAVID J. MALAN: Evet.
Sağ üst taraftaki kadar kadar Burada bu ara kutusudur.
Ve onlar bu-- bir uygulamaya nasıl kelimenin tam anlamıyla açık dirsek form etiketi.
Ve sonra bir şeye aramak için izin.
en bir dostum için arama Let benimkini "İsim Parlante." bir
Girmek.
Ve tabii ki gitti biraz daha farklı bir URL'dir.
Beni burada geri dönelim.
en aramak istiyorum "kursları."
Lanet olsun.
Farklı bir URL'ye gitti.
Yani, Stanford Biraz sihir ekleyerek Onlar URL'ye beni almıyorsun o
Biz gördüm eylem bağlıyor.
Ama burada bu formu tamamen uygulanmaktadır Burada bu biçimlendirme yoluyla, bu etiketleri.
Aslında, burada giriş var: İstediğiniz arama türü.
İşte girdi içindir Arama başka bir türü.
İşte dize kendisi için girdidir.
Ve böylece gol sarmak için değil, Bu etiketlerin her yerinde zihinlerimiz
ama sadece görmek için.
Sadece açılış ve kapanış oluyor etiketleri ve seyir şeyler kadar.
Evet?
Victoria?
>> İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Bu iyi bir soru.
Görmek için biraz yanıltıcıdır.
bana bu geri gelelim Sadece birkaç dakika içinde soru
Biz bir şey bakmak çağrılan CSS, ya da basamaklı stil sayfaları,
ve biz çıkarmayı deneyebilirsiniz sayfadan kadar.
Yani biz şimdi google.com bir göz atın eğer, en kendi sayfasında neye benzediğini görelim.
Bunu bugün şirin they're-- olacaktır.
TAMAM.
Hepsi tamam.
Kaynağı Görüntüle böylece tamam.
Google'ın sahip düşünürdüm Gerçekten güzel bir kaynak kodu.
Yani, görünüşe göre, burada ne oluyor?
Ve aslında, bu da HTML değildir.
Bu JavaScript denilen şeydir.
Ve en gidiyor ve devam edelim.
sayfa başladığı bile bilmiyorum.
Ben Command kullanmak için gidiyorum F açık dirsek HTML.
Pekala, işte burada.
Ben sayfanın başlangıcını bulundu ve çok şeyler burada var.
>> Gerçekte ne oluyor?
Peki, ne biliyorsun, Biz bu kadar temiz olabilir.
Bunun yerine giderseniz bu kontrol edin Araç çubuğu, bu özel tanı aracı,
ve Ağa değil gitmek, Bugün devam edin nereye,
ama Elements giderseniz, gerçekten güzel
Bir tarayıcı bir yeri vardır olduğunu Ben bunu çok daha iyi gözler.
Ve tarayıcı okuyabilir Bir web sayfasının bu karışıklık,
HTML posta biz sadece baktı, ve can
bunu ayrıştırmak ya da okumak ve analiz ve reformasyon
Güzel bir insan dostu bir şekilde.
Yani şimdi görüyorum ne Burada bu ekranda
Elementlerin altında, aynı içerik, ama her şeyi girintili ettik,
onlar colorized, ancak ettik tam aynı metin var
Ben sunucudan indirilen söyledi.
>> Ve şimdi ne güzel ben görebiliyorum olduğunu Vücutta, instance-- haber için,
Sayfa hala oluşur sadece baş ve gövde,
ve ben hiyerarşik burada dalış yapabilirsiniz.
Google gibi görünüyor fark Bu bir ve bu bir divs-- için.
Bunu genişletebilirsiniz.
diğer divs bir sürü var.
Bu yüzden biraz karmaşık.
Fakat bekle.
Bu çok fazla görünüyor okunabilir, nispeten bu daha.
Neden Google utanç verici Sadece göndererek kendisi
bazı kod bu büyük karmaşa sıralama sadece bir şey uygulamak
Bu ilk bakışta çok basit görünüyor?
Gibi, neden daha fazla boşluk eklemeyin?
Benim yaptığım gibi Neden Enter isabet etmedi?
Bakın ne kadar iyi ben Bir web sayfası yazma.
Ben çok özenle Enter tuşuna basın.
Ben bu yüzden her şeyi girintili çok güzel ve okunabilir.
Neden Google değil aynı pratik mu?
>> İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: İyi.
Çok adil.
Bazı yok Google'da kişi manuel
Artık ana sayfa güncellenmesi.
Artık 1999 değil.
Bu yüzden yazılım var.
Onlar diğer araçları var dinamik, HTML konum oluşturmak.
Tabii ki, bu kod kendisi İnsanlar tarafından yazılmıştır,
ama gerçeklik, o, söylemek oldukça adil
Tarayıcınız kesinlikle değil Kod nasıl dağınık önemsiyorum.
Ama daha fazlası var zorlayıcı teknik nedeni
Google, HTML dağıtır Böyle bir özensiz kod, görünüşte
ezici bir yol hep birlikte paketlenmiş çok az yol-- çok az
Benim yaptığım gibi biçimlendirme yolunda.
>> İZLEYİCİ: [Duyulmaz]
>> DAVID J. MALAN: Daha hızlı?
Niye ya?
Ve sen, Lydia ne dedin?
Daha hızlı?
Neden daha hızlı?
İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: var boşluk okumak için.
Evet.
Yani bir boşluk ne olduğunu düşünüyorum.
Yani klavyedeki her karakter alır alan bir miktar, temsil etmek
ya fiziksel, bunun gibi çok alan olduğunu kaplıyor
ya da bir şekilde altında davlumbaz, bu bellek gerektirir.
olarak aside-- ve yaparız ve Bu Yarın- hakkında daha fazla konuşmak
Klavyenin her karakter tipik 8 bit ya da bir bayt gerektirir.
Yani 8 sıfırlardan oluşan bir desen veya olanlar, ya da sadece 1 bayt, biz olarak
insanlar genellikle söyleyebilirim.
Böylece, küçük ama Hala sıfır olmayan var.
Hala uzay miktar var.
Yani bir mühendis veya Google vurursa space bar sadece bir kez, ve varsayalım
Google-- öyle süper popular-- bir milyar insanın varsayalım
Bir gün onların ana sayfasını ziyaret edin, ya da bazı insanların sayısı
ana sayfa a ziyaret milyar kez bir gün,
kaç ek bayt olduğunu vardır yazılım mühendisi sadece Google'ı mal
bir zamanlar onun uzay çubuğunu vurarak?
>> İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Oldukça kötü değil.
Sadece bir bayt kez milyar dolar.
Yani bir--
İZLEYİCİ: 8 milyar gigabayt.
DAVID J. MALAN: Not 8 milyar.
8 milyar bayt.
Ama 1 gigabayt.
1 gigabayt ölçü birimi olacaktır.
o iki yaparsa alanlarda, 2 gigabayt.
Üç gigabayt.
Sağ?
Bu pahalı bir terazi.
Ve böylece Google gibi durumlarda, hangi verilen, aşırı durumlarda vardır,
Sadece ortaya çıkan diğer sorunları vardır çok makul kararlar alarak
ya da çok basit bir insan eylemlerde, Bu büyütülmüş bir etkiye sahiptir çünkü.
nedenlerinden biri bu yüzden Bu yüzden, sıkıştırılmış görünüm
Victoria oldu ki-- tam gibidir sadece zaten bilgisayar tarafından oluşturulan.
Öylesine hayır büyük dağıtmak.
tarayıcı anlamaya edelim.
Ama aynı zamanda kasıtlı olarak fazla yer yok,
Uzay gerekli değildir, çünkü.
Ve uzay aslında masraf.
>> Ya, zaman maliyeti Sadece itmek çünkü
üzerinden o kadar daha fazla veri Google.com'un merkezi sadece
bir miktar almak için var o milisaniye olsa bile zamanı,
veya mikrosaniye, ama bu kadar ekler Pek çok kullanıcı üzerinde, ya da daha büyük olasılıkla,
muhtemelen masraf.
Google muhtemelen bağlanır Dünya, birinde başkası
Bunların bakan noktaları ve onlar varsa
mali ilişki bir çeşit bu sayede kendi veri masraf,
onlar da olabilir ne kadar veri minimize
onlar üzerinde tükürme konum kendi internet bağlantısı.
>> Çok komik bir şey olsa da, sonuçta, ya da belki güven verici bir şey,
olsa bile bu korkunç görünüyor ki ezici, günün sonunda,
yine tam olarak aynı ilkeler var Burada bir HTML bu çok basit sayfa
sayfa.
Dolayısıyla, sadece özetlemek ve böylece Eğer olmasaydı kurallı bir sürümü var
burada, burada seçim tarafından birlikte aşağıdaki web sayfalarının en basit olabilir,
bu yüzden bir şey belki daha sonra oynamak için.
>> Peki, bir tanıştırayım Şimdi diğer fikirler çift.
Biz tanıtmak üzereyiz bir şey bir stil etiketi denir.
Biz bu sayfayı stilize olabilir daha ilginç şekillerde.
HTML e-posta oysa Yani tüm hakkında işaretleme olduğunu
Veri, bir çeşit için belirterek nasıl veri yapısı tarayıcı,
nereye koymak o, CSS, veya Basamaklı Stil Şablonu,
İkinci bir dil olduğunu genellikle HTML ile kaynaştı alır
Biz see-- sizi temizlemek gibi alan bir moment-- o kadar
final mil, ve bunu stylizes.
Bu renkler sadece doğru olur, yazı tipi, sadece doğru boyutları
konumlandırma doğru.
Bu estetik hakkında herşey ya değil, yaklaşık biçimlendirme
temel veri kendisi.
Ve en kolay yolu göstermek için Bu örnek belki de.
Yani üzerinde gitmek için gidiyorum Benim basit bir metin dosyasına.
Ve sadece bir an, ben olacak sürecinde bize yürümek
Bu kendimizi yapıyor.
>> Ben dosyaya geri dönmek için gidiyorum Burada sadece sayfayı yeniden
Göründüğü gibi onaylayın.
Şu an bulunduğumuz yer orası.
çocuklar zevk alırdım gibi hissediyorum Bu web sayfasında bazı renkler olan.
Yani burada gitmek için gidiyorum Sayfanın kafasının içine.
Ve ben tarzı, / stil yapacağım.
Ve sonra bu iç, ben gidiyorum Benim page-- gövdesini anlatmak için
ve bu biçimlendirme de olduğunu İlk bakışta, belki biraz
garip ama geleneksel.
Ben arka söylemek için gidiyorum Bu sayfanın rengi yeşil olmalıdır.
Ve bu ne yazık ki çeşit değil en iyi tasarım.
Dikkat ederseniz önce HTML dünyasında,
Dedim nitelikleri olduğunu Bu anahtar-değer çiftleri vardır.
Bir şey teklifi eşittir unquote "bir şey."
oldu CSS dünyasında, Bazı farklı kişiler tarafından tasarlanmış,
onlar, o karar onların Dünya, anahtar-değer çiftleri
kelime kolon şey olurdu.
Yani olsa da, aynı fikir.
Bu değer ilişkilendirme var her nasılsa bazı anahtar buna
Bu sayfanın davranışını etkiler.
>> Ve muhtemelen tahmin edebilirsiniz.
bu muhtemelen gidiş nedir asla ettik bile yapmak
önce HTML ya da CSS gördünüz mü?
İZLEYİCİ: Arka plan rengini değiştirin.
DAVID J. MALAN: Evet, Arka plan rengini değiştirmek.
ve özellikle Vücudun arka plan rengi.
Ama sürece Şimdi vücut ağıdır
page-- o tek şey başlık çubuğu gerçekten-- altında
muhtemelen gidiyor Aynı şeyi etkiler.
Yani bakalım.
Şimdi bu kurtaralım.
Buraya gidin ve yeniden.
Oldukça iğrenç.
Ve ne oluyor Burada bir yan etkidir.
Ben sadece rastgele bu görüntü seçti.
Neden yeşil değil Mickey arkasında nüfuz?
İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Kesinlikle.
Oldukça ki görüntüleri çıkıyor Kullandığımız olabilir hemen bütün görüntüler,
dikdörtgenler her rectangles-- bulunmaktadır.
Mickey bazı eğrileri olsa bile kendine ve bir geçmişe sahiptir,
Bu arka plan bir şey olmalı.
Bu beyaz olmak zorunda.
Siyah ya da başka bir şey olmak zorunda.
Bu şeffaf olabilir.
Ve aslında, I could Burada Mickey Mouse açmak
Photoshop adlı programda ya da benzer bir şey
ve o beyaz tüm değiştirmek şeffaf arka plan,
yani yeşil ile parlaklık olacaktır.
Ama bu ihtiyaç duyduğu şey Kendim veya bir grafik sanatçısı sormak için
ya da bir tasarımcı benim şirketi, örneğin,
Özellikle ben sadece bu yana, yapmak internetten bu bir ödünç.
Bu neden oluyor ama bu.
>> Yani başka ne yapmak isteyebilirsiniz?
Eh, biz biz söylemek isteyebilirsiniz Gerçekten siz kaldınız umuyoruz.
Ve vurgu için, ben istiyorum Bu güçlü hale getirmek için,
ve bu yüzden açık, güçlü ve söyleyeceğim Güçlü kapatın ve sonra yeniden yükleyin.
Ve bu biraz zor projektöre görmek için
ama belki de gerçekten artık biraz daha size dışarı atlar.
Yani bu italik ekleyebilirsiniz yolu, bu şekilde kalın kaplama.
Biz renklerini değiştirebilir.
Aslında, sadece tekmeler, ben go ahead ve bunu yapmak için gidiyor.
Gerçekten nasıl sevmiyorum benim paragraflar, birbirine bu kadar yakın olan
bu yüzden böyle bir şey yapabilir.
Ben tarayıcı söyleyeceğim, için her paragraf etiketini değiştirmek,
ne biliyorsun, en doğrusu açarsanız edelim, en metne-align, merkezi hizaya edelim.
Ve yine, ben bu sadece bilmek Birisi bana öğretti, çünkü
ya ben baktım online başvuru.
Bu yüzden bana bu tasarruf sağlar.
Ve, ah, şimdi var Orada görüntü merkezli.
Ve aslında, ne, bilmek Ben bir paragraf içine benim görüntü taşımak
tag-- böylece üçüncü paragrafı, Hatta metne değil gerçi.
en kaydetmek ve yeniden edelim.
Şimdi sayfa tür bakmaya başlıyor of-- ben, hala, oldukça çirkin anlamına
Ben harcanan gibi ama en azından görünüyor iki dakika yerine bir dakika
gerçekleştirmek.
>> Ve böylece, adım adım, biz yapabilir Sayfanın şimdi bu estetik değişiklikler?
Gerçekten veri değişmedi ettik Gerçekten kelime ekleyerek başka sayfa.
eğer sen ben, meta ekledik.
Hey, tarayıcı, yapmak kelimesi "gerçekten" cesur.
Ancak veri güçlü değildir.
Bu meta değil.
veri "gerçekten" dir.
Bu yüzden hala bazıları var aynı kavramlar olarak önce.
Şimdi, tabii ki, bu ağ-değil, bu yüzden burada bir son adımı yapacağım.
>> Ben hello.html gitmek için gidiyorum ve sadece vurgulamak ve bu kopyalayın.
Ve şimdi ben gidiyorum Cloud9, gitmek hangi
Ben sadece bir an sizi içinden yürüyeceğiz.
Ve oranlar, eğer yakında olacak olan değil zaten böyle bir ekranda.
Ve bana sadece size hızlı vereyim Cloud9 aslında ne tur.
Yani yine 9 bulut Bu bulut tabanlı hizmet
Bu size ve bana yanılsamasını verir bizim kendi sanal makine olan
bulut içinde teknik bulut bir kap olup,
biz tam olması yönetici ayrıcalıkları için.
teoride, hiç kimse bu yüzden Dünyada başka sahiptir
Ben ekrana erişim Şu anda bakarak,
belki insanlar hariç kim siteyi çalıştırın,
teknik onlar çünkü fiziksel erişim ve benzeri.
>> Bu yüzden bu ortamda ne görüyorsun?
Ben, uzaklaştırmak için gidiyorum biraz küçük olduğu için.
Ve ben üzerinde işaret izin Burada sadece bir an için.
sol tarafta benim ve senin ekran, solda bir dosya tarayıcısı var.
ruhu içinde çok benzer Mac OS ve Windows için.
Bunlar hepsi Hesabımda dosyaları.
Ve varsayılan olarak, eğer senin hesap, benimki gibi
Gördüğünüz veya yakında göreceksiniz helloworld.html ve readme.md.
Burada sağ tarafta üzerinde, bu nerede metin dosyaları gidecek.
Hiç Microsoft kullandıysanız Kelime Not Defteri veya TextEdit veya
Bu kelime benim düzenleme olduğunu Dosyaların gidecek.
Ve sonra en esrarlı Bu ortamın özelliği
biz gerçekten kullanmaya gerek olmayacak Burada bir Terminal Pencere denir.
sizden DOS kullandıysanız yesteryear, bu Linux
veya DOS Linux eşdeğer.
Bir metin tabanlı arabirimini, var Hiçbir fare tıklamaları, hiçbir sürükleme.
Yapabileceğiniz Hepsi bir komutları, ancak bu komutlar
dosyaları, dosyaları oluşturmak taşıyabilir, açık dizinleri, yakın rehberler,
şeylerin herhangi bir sayı yok.
Şimdilik Ama, biz sadece edeceğiz Burada bizim zaman kadar harcama.
>> Ve bu yüzden bu yapalım.
Bu konum çevre, sen-meli
Bir çalışma alanı oluşturulmuş ise olmak Zaten, go ahead ve sadece kadar gitmek
Bir an için, Yeni Dosya.
Ve bu size yeni verecek Burada ortada sekmesi.
Ve ben sadece- ve yapalım go ahead ve bunu.
en Kaydet Dosya yok artık devam edin ve let ve devam edin ve hello.html çağrı,
ile karıştırılmamalıdır helloworld.html, burada
, Yeni ücretsiz bir hesap ile geldi hangi sadece bir örnek dosyasıdır.
Bunu aniden ortaya göreceksiniz, Sol taraftaki büyük olasılıkla
ve sekme hala açık olacak.
Ve beni yeniden şimdi teşvik edelim Bu dosya veya bunların bazı varyantları.
Ve oldukça üzerinde göremiyorum eğer ekran, bu slaytlar aynıdır
muhtemelen başka bir sekmede olması.
>> Yani kısacası, ilk web sayfası yapmak o, ve sonra sadece bir an kaydetmek,
nasıl ben size göstereceğim aslında bu görüntüleyebilirsiniz.
Ama en azından bir şeyi değiştirmez.
için HelloWorld değiştirin kendi seçtikleri bir şey,
o senin olduğunu ikna olduğunu ve böylece Ben sadece oluşturduğunuz bir dosya değil.
Pekala.
Ve hiçbir ready-- yaparken Hazır olduğunda rush--,
devam edin ve dosyayı kaydedin bir kez bu değişiklikler yaptık.
Ve eğer tıklarsanız Run düğme kontör, bu
anlatacağım yeni bir sekme açın gerekir sen, sen dosyanızı ziyaret edebilirsiniz ne URL
ama bir an alabilir alıntı ", Apache başlatmak" demektedir ki
Web sunucusunun adıdır.
Yani tam olarak yapmak için dikkatli olun Ne sonuçta dosyada var.
Yani şimdi, ben yakınlaştırmak gerekir.
Ben yazmaya başlayın, eğer açık dirsek HTML, haber
Benim düşünce bitirmek için bana sormadan ediyor.
Ve benim düşünce bitmiş ise, o otomatik bana kapanış etiketi verir.
Ama beklenti o zaman vurmak, güvenlik danışma Girin ve ardından içeride hareket
ve iç kafa yapmak ve Sonra içimde vücudu yapmak.
Ve bu, ilk başta biraz garip Sizin için iş yapıyor çünkü,
ama sonuçta fark size tuş vuruşlarını kaydeder.
arasında ve aslında, bir çok yaygın bir özellik Programlama bugünlerde ortamlarında
Her iki gibi web geliştirme için Bu ve gerçek programlama,
hangi yarına bahsedeceğiz, Bu otomatik tamamlama özellikleri olduğunu,
Sadece bir izin şeyler programcı veya tasarımcı
daha az tuş vuruşlarını yazın Aynı şeyi başarmak.
Bazen olsa iyi.
Bazen sadece sinir bozucu.
Ve yine, bir kez transkripsiyonu ettik slayt veya bunların bazı varyant,
Eğer kontör Çalıştır düğmesini tıklayabilirsiniz.
Sonra alt Pencere, haberdar olacak
Ne URL de web sayfasını ziyaret edebilirsiniz.
Maden ocakları, örneğin yer almaktadır business-daharvard.c9users.io
ve benzeri.
Pekala, bu yüzden bana-- herhangi bir soru olur mu?
Sadece alma hakkında herhangi bir diğer sorular özellikler eklemek önce bu çalışma?
Ve sadece bana teklif izin millet comfortable-- almak
Sadece bir şey, çünkü Ben ne yaptık körü körüne copy-paste.
Ama millet güreşmek böylece yapılacak iş en az biri ile,
Ben biraz müzik açmak için gidiyorum.
Ben bir liste önerecek gidiyorum potansiyel ekleyebilirsiniz şeyler.
Ve kesinlikle Google'ı kullanabilirsiniz.
Ve neden biz sadece çözmek için deneyin öneriyoruz
En azından belirli bir sorunu burada.
etiketleri açısından çok, beni burada bu yeniden edelim.
>> Aslında, bana koyalım bir metin halinde kullanılabilir.
en biz olabilir etiketleri arasında Diyelim ki burada kullanmak Buraya biraz etiketleri bulunmaktadır.
Biz paragraf etiketini gördüm.
Şimdi otomatik tamamlama gidiyor.
Paragraf etiketi, çapa etiketi.
Diyelim ki istediğinizi varsayalım bir şey daha büyük yapmak,
böylece da-- olabilir span etiketi yardımcı olabilir.
Eh, biraz yardım gerekebilir sadece bir an bunun için.
Biz div gördük.
Sen tablo var göreceksiniz.
bir şey tr td var çağırdı.
Th, td.
Bir an geri o gel.
kullanışlı başka ne olabilir?
Güçlü var.
Orada vurgu var, ya da daha doğrusu onları.
Orada- başka ne Burada fantezi olabilir?
Eh, biz götürürüz Birlikte Şuna bak.
gördüğümüz Formu.
Form var.
giriş ve birkaç başka var.
Pekala, hadi yapalım.
Bir Victoria'nın cevaplamak için soru, ilk bana izin
sadece herkes emin olun onların merhaba çalışma almanız mümkün.
Sonra beni tanıştırayım Birkaç diğer fikirler.
Sonra millet çözmek izin vereceğim Kendi başlarına biraz problem.
Sonra biz aslında geri geleceğiz Bir formun bu fikrine,
ve biz aslında re-implement edeceğiz Birlikte ön uç arayüzü,
bu yüzden Google kendisi için, konuşmak için.
Biz arka plan olarak Google'ı kullanıyor ve izin vereceğim Onları zor işi yapmak, arama,
ama biz ön uç yeniden edeceğiz Google'da ve arama formu
kendi ana sayfasında var.
Ve böylece biz geri geleceğiz sadece bir an bu etiketleri.
>> Yani bu ne ben sadece bir an önce önerdi.
Biz, bir stilizasyonu ekleyebilir Bu tarz etiketi içinde sayfa,
ve biz arka plan stilize edebilirsiniz renk, metin hizalama,
Bu merkezi veya sola veya sağa olsun.
Ama çok hızlı bir şekilde olur bulmak ya da bir web tasarımcısı
Bu bulacağını Biraz ağır olur
Eğer yapıyoruz, çünkü ne Karıştırma içerik olarak adlandırılan
sunumu ile bunların.
Verilerinizi karıştırma konum ve estetik bunların.
Ve aslında, düşünün Ne olan Zamanın üzerinde ne olacak
Bu çok küçük web sayfası, tabii ki.
Ama bu sayfayı içerik eklerseniz ve ben bu sayfaya stil eklemek,
sayfa çok hızlı bir şekilde alır uzun ve daha uzun ve daha uzun.
Ve ben istiyorum varsayalım İkinci bir web sayfası var
Bu özelliklerden bazıları paylaşıyor.
benim ikinci web sayfası için varsayalım benim durmayacağız de, ben her şeyi merkezi istiyorum
ve ben de her şeyi istiyorum yeşil bir arka plan ile.
Ben hemen hemen zorunda gidiyorum kopyalama ve bu hatların bazıları yapıştırın
İnce hissediyor ikinci dosya içine.
Bu sorunu çözecektir.
>> Ama üçüncü sayfa neyi istiyorsanız Bir 30 sayfa veya 40 sayfa veya?
Şimdi kopyalama için gidiyorum ve yinelenen bir sürü kod yapıştırarak
birden fazla dosya içinde.
Ve böylece varsayalım Ben karar veya ben söyledim,
hey, biz kullanmadığınız bir Artık yeşil arka plan.
Biz turuncu kullanmaya başlamak için gidiyoruz.
Ne değiştirmek zorunda mı?
Eh, bu tarz değiştirmek zorunda yeşilden turuncuya kaç yerde?
30 ya da 40 yerler gibi.
Bu sıkıcı değil.
Bu hata eğilimli olduğunu.
bir dizi nedeni vardır Eğer ikna etmek istemem nerede
Kendiniz için acı bu tür.
Ve bu yüzden güzel olmaz biz sürebilir ne sadece
Bu iki sarı arasına koymak etiketler, bu tarz etiketleri,
dışarı çarpanlarına ve tüm koymak benim Tek bir merkezi dosya halinde stylization
Bu benim diğer tüm dosyaları 30 veya 40 ödünç ya da bir şekilde referans,
değil ağ aksine diyagramlar Daha önce yapıyordun?
>> Burada gitmek, yani ben Aslında teklif edecek
Biz değiştirmeniz bir şey stil etiketi
bağlantı etiketi denir ki korkunç, korkunç olarak adlandırılır,
Eğer kullanmayın çünkü bağlantı etiketi ne oluşturmak için
Biz insanlar bir web sayfasına bir bağlantı olarak biliyorum.
Bunun için, hangi etiketi kullanabilir miyim?
Nasıl bir web sayfasındaki bir bağlantı oluşturmak mı?
İZLEYİCİ: a.
DAVID J. MALAN: a, ya da çapa önce Disney gitti etiketi,.
Burada link etiketi söylüyor adlı bir dosyaya bu-- bağlantı
için styles.css, ilişki Benim stil olduğunu olacak.
Yani bu S yıllarda biridir CSS-- geçişli stil sayfaları.
Stil sheet-- CSS S yıllardan iki.
stil sayfasını Basamaklı.
Bu sadece hey, tarayıcı, gitmek anlamına gelir yerel sunucuda styles.css bulmak
ve senin stylesheet olarak kullanabilirsiniz hangi o dosyanın içinde gelir
Tüm olacak biz sadece yaptık stilizasyonlardan.
Ve ne olmuş yani bu dosya bu gibi görünebilir.
Ve ben sadece bu hızlı yapacağız örnek ihtiyacımız yok çünkü
Burada yabancı otların içine çok fazla almak için.
Ben bu kopya Ama eğer, ben öneren Ne değilim Bir programcı yeni bir dosya oluşturmak olduğunu,
Bu çizgiler, yapıştırın Bu satırlarda whoops-- yapıştırmak,
olarak, daha sonra styles.css olarak kaydetmek ve Diğer dosya, bütün bunlar silmek
ve bunun yerine yerine Bu bağlantı etiketiyle.
ben href = "styles.css" bağlantısını Yani, ilişki "stylesheet" olacaktır
yakın etiketi.
Onu kurtar.
Benim helloworld geri dön.
Yükle.
>> Kelimenin tam anlamıyla bir şey olmadı.
Yani, iyi bir şeydir çünkü o aslında tüm çalışma demektir.
kadar ispat etmek için, ben yapmak varsayalım yazım hatası, ve ben bu "Styles.css" diyoruz
bir sermaye S ile Yanlış ve sonra yeniden yükleyin.
Şimdi sadece işe yaramazsa görebilirsiniz.
Şimdi, neden?
Peki, bir kullanmama izin önceki tekniği.
de, beni devam edelim ve Benim tarayıcı Chrome'da, ben
özel olduğunu açılacaktı Ağ sekmesi daha önce olduğu gibi,
ve bana sayfayı yeniden izin verin.
Şimdi görmek için sürpriz ne değildir?
Ya da belki de bunu görmek için sürpriz değil.
Her iki durumda da, şimdi ne görüyorsun?
İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Bu bulundu değil.
Neden bulunamadı?
Eh, Styles.css-- sermaye S- yoktur.
Ben misnamed.
Basit yazım hatası.
Ama şimdi bir anlaşılır alıyorum 404, sunucu söyleyerek çünkü, hey,
bulduğu değil.
Kelimenin tam anlamıyla, bilmiyorum nerede dosyadır.
Sonuç olarak, tarayıcı Yani , Elinden geleni gösterir
Sayfanın ham içeriği, bu, 200, HTML oldu
ancak stilizasyon yapamam daha sonra ilave edilebilir.
Ve bu basamaklı demek ne olduğunu.
Sen tür ekleyebilirsiniz sonra, ve bu tür
Web sayfasının estetiğini geliştirir.
Ve hatta bu kılabilirsiniz Yine başka stil dosyaları ile stilleri
istersen.
Bu, bu durumda, yine de, bulunan değil Çünkü elbette, bunu misnamed.
Bu yüzden ilk olarak düzeltmek gerekir.
>> Yani en önde gidelim ve aşağıdaki öneriyoruz.
en go ahead ve bu yapalım.
belki ile başlayan senin helloworld dosyası,
Bana sadece bir çift davet edelim önerileri bulunmaktadır.
Yani, Victoria sen istedi Bazı metin büyük, tamam mı?
Pekala, biz Metni büyütmek yapabilirim.
Ve biz her koparmak olacak Sadece bir problem çözmek için.
Metin daha büyük yapmak.
Ben rahatsız gitmiyorum biz ne zaman bu yazı
Burada üzerinde kurşun teknoloji var.
Bu yüzden bazı sorunlar.
Bu yüzden denemek için gidiyoruz Metin daha büyük yapmak için.
Pekala.
Başkasının ne önerirsiniz?
Başka ne isteyebilirsiniz Bir web sayfasına mu?
en a ile gelsinler şeylerin kısa bir listesi
ve sonra temsilci grup bu anlamaya.
>> İZLEYİCİ: [Duyulmaz]
>> DAVID J. MALAN: Tamam, konum metni Sayfanın farklı taraflarında?
Pekala.
Başka bir şey.
>> İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Öyle.
Yani bir gif sadece bir Farklı dosya biçimi.
Biz sadece kullanılan, ne bir png veya muhtemelen jpg?
Bir jpg kullanılır.
Eğer aşırı, meraklı iseniz Sorunuza cevap
jpg genellikle kullanılan bir fotoğraflar, destekler çünkü
renk veya 24-bit renk milyonlarca.
GIF genellikle olduğu gibi, kullanılan internet fenomeni bu days-- animasyonlar,
gibi animasyonlu gif.
Ama küçük bir renk kullanmak olur palet, yalnızca 256 olası renkler,
ancak destekler şeffaflık ve animasyon.
destekler ve sonra var png, şeffaflık ve daha fazla renk
ama animasyon.
Bu yüzden bir ticaret-off.
Yani olsa da, gif ekleyerek, işlevsel olacaktır
Bir png veya jpg ekleyerek eşdeğer.
Evet.
Görüntü kaynağı eşittir.
Yani başka bir şey.
en bir şey ile gelip edelim ki Burada yapmak için Victoria gönderildi.
>> İZLEYİCİ: Bir form için düğmeler ekleyin.
DAVID J. MALAN: Tamam.
Yani bir form için düğmeler ekleyin.
Ve birlikte o birini yapacağız.
Yani mükemmel bir segue olacak Sağ bu mücadeleden sonra.
Başka herhangi bir şey?
Ne yapmak isteyebilirsiniz?
Web çok underwhelming hissediyor Bu hepsi eğer yapabilirsiniz.
İZLEYİCİ: Metnin rengini değiştirin.
DAVID J. MALAN: Ne değiştirme?
İZLEYİCİ: Metin rengi.
DAVID J. MALAN: Metnin değiştirin rengi.
Pekala.
Yani, bu yapalım.
Sadece tekrar böylece sen değil, sadece ezbere, ben ne yaptığımı tam olarak yapıyor,
Ben müzik açmak için gidiyorum Burada belki beş dakika.
Google'ı kullanmak için sakınca yoktur.
Bana sormak için buyrun, ve Ben senin kulağına bir ipucu fısıldar edeceğiz.
Sen bakmak için buyrun üzerinde diğer omuzlarında.
Ancak bu sorunların sadece bir çözüm.
Ama biz sonuncusu, yapacağım Eğer biz-ebil birlikte, birini oluşturur.
Yani beş dakika çözmek için Bu sorunlardan biri
Google, sezgi kullanarak, ya da herhangi bir sizin için kullanılabilir diğer araçlar.
>> [MÜZİK]
Pekala.
Endişeye gerek yok isterseniz müdahalesi tutmak için,
ama ben bir çift yağma edeceğiz Bu cevapların.
ilk öneri Yani Victoria metin daha büyük yapmak için oldu.
Yani bunu yapmak için birkaç yol var.
Şu anda restore ettik Bu boyuta benim ekran,
Ben yakınlaştırılmış ettik olsa yapay sadece şeyler görmek için.
Ve bunu yapalım.
Beni önde ve kapmak gidelim Bazı genel Latince metin
sadece bu yüzden çalışmak için bir şey var.
Bu yüzden bana sadece bir anı ver.
Ben üç paragraf yapacağız.
TAMAM.
Bu, daha iyi bir örnek olacaktır.
meraklı için, So Benim hello.html, ben sadece
Yapıştırılan üç saçma Latin paragraflar
sadece bu yüzden çalışmak için bazı metin var.
Ve Victoria'nın hedefi oldu Büyük metnin bir kısmını yapmak.
Bu yüzden, daha önce olduğu gibi, burada gidebiliriz.
Ve ben bunu doğru şekilde yapalım.
Ben bir bağlantı var gidiyorum Bir dosyaya işaret eden etiketi
sözde "styles.css," ilişki hangi "stylesheet." yine
Ve sonra o kurtarmak için gidiyorum ve bu "styles.css." açmak
>> Yani, daha önce olduğu gibi, ben Bu CSS dosyasında yeteneği
aslında varsayılan geçersiz kılmak için Bir web sayfasının estetiği,
ve varsayılan estetiği, Tabii, oldukça sıkıcı.
Siyah normal yazı tipi boyutu tür var Metin, vb beyaz arka plan ve.
Yani yapmak istediğinizi varsayalım Bu metnin tüm büyük.
Ben bir şeyler yapabilirdi.
Benim styles.css dosyasında, ben ne biliyorsun, söyleyebiliriz,
Aşağıdaki uygulamak Benim sayfanın gövde.
Devam edin ve yapmak yazı tipi boyutu 24 punto,
hangi bir sayı ı olabilir olduğunu Microsoft Word'de kullanın.
benim web dönelim Burada sayfa ve yeniden,
ve bunu görebilirsiniz Zaten çok büyük.
Ve biz biraz deli alabilirsiniz sadece bir desktop-- üzerinde can gibi
o 96 puan yapmak.
Yükle.
Ve biraz gidiyor Bu noktada hantal.
>> Ama biraz daha hassas olabilir.
Bunun yerine, bu uygulama sayfamın gövdesine stil,
başka ne yerine uygulamak olabilir başka hangi etiketi hala olabilir
aynı şekilde işlev?
>> İZLEYİCİ: p etiketi?
DAVID J. MALAN: P etiketi.
Yani kafa olmaz Doğru, baş nedeni,
aslında olamaz estetiğini kontrol eder.
Her iki metin var ya da yok yok.
Ama p tag-- biraz dalış yapabilirsiniz derin, bu yüzden paragrafa, konuşmak
etiketleri.
Ve üç olsa bile, Bu, çünkü CSS, mükemmel para cezası
Ben sadece "s" bu derken Aşağıdaki uygulamak anlamına gelir
Bu eşleşen herhangi etiketi seçici, seçici sadece
etiketinin name olmak.
Yani gördükleri her yerde "P", yazı tipi boyutunu uygulamak
ve en fazla bunu yapalım Makul vasıtasıyla yine 24 puan.
Ve ne biliyorsun, sadece iyi ölçmek için,
rengini yapalım Şu an için kırmızı sadece.
Ve şimdi ben şimdi, yeniden eğer biz Üç çirkin paragraflara bakınız.
>> Ama şimdi ben sıralama olduğumu varsayalım of-- Ben ilk paragrafı istiyorum
kullanıcı dışarı atlamak için.
Ben sadece artırmak istemiyoruz Her şeyin yazı tipi boyutu.
Ve bu yüzden aslında tanımlamak istediğiniz veya Bu paragraflarda arasında ayrım.
Yani kırmızı kurtulmak izin , Bu sadece tür yapışkan çünkü
ve en go ahead ve yapalım font boyutu 12 punto, varsayılan olarak,
Bu yüzden geri bir şey değil Biraz daha makul.
Ve şimdi sadece artırmak istiyorum ilk paragrafın yazı tipi boyutu.
Birkaç yapabilirsiniz yolları, ama var tek yönlü
belki de en öğretici an aşağıdakileri yapmaktır.
Beni devam edelim ve bu demek paragraf "ilk." benzersiz bir kimliği vardır
İstediğim bu şey diyebiliriz.
Ben bu "foo" diyebiliriz ya da herhangi bir diğer kelime,
ama ben biraz vereceğim anlamsal isim
"Önce." Gibi
Bu, benzersiz bir tanımlayıcı olan Kimlik, benim ilk paragraf için.
>> Şimdi benim stil sayfasında neler yapabilirsiniz? Biraz daha kesin olduğunu.
Yerine söyleyerek, uygulamak p etiketine aşağıdaki,
Ben following-- diyebilirim aşağıdaki uygulamak,
seçin veya HTML öğesi o "ilk". benzersiz bir kimliği vardır
Ne ben buna başvurmak istiyorsun?
24-noktasının bir yazı tipi boyutu.
Yani şimdi iki seçicileri var.
Bir bütün yapar 12-nokta paragraf.
Ama bu, o geliyor özellikle saniyedir-- bu file-- son geliyor
Bu basamaklı bir etkiye sahiptir.
Ben sadece tüm yaptık benim paragraf etiketleri 12 punto,
ama bu şimdi çağlayanlar ve bu herhangi bir öğe için geçersiz kılar
sayfa sayfa, herhangi bir etiket benzersiz bir kimlik alıntı unquote "ilk".
Ve bu bağlamda hashtag'ının Sadece "benzersiz tanımlayıcı" anlamına gelir.
Ben HTML dosyasında koymayın.
Ben, buraya, sadece söylemek "Önce." Unquote alıntı
>> Bu yüzden bana yeniden izin verin.
Ve şimdi ben tamam, ah, bkz.
Ben öyle değil, yani güzel, ama o tür
bir önsöz gibi kitap ya da böyle bir şey,
burada birinci paragraf büyüktür.
ile daha hassas olabilir sadece ilk harfleri, ama en azından
Ben daha fazla kontrol icra ettik.
Şimdi belki-- belki bunu yapmak istiyorum bazen sebebi ne olursa olsun,
ve bu yüzden bu istemiyorum Sadece bir HTML etiketine için de geçerlidir.
Aksine, en haydi açarsanız let Ayrıca aşağıdakileri yapın.
Class = "ithal."
Kimlik benzersiz kullanılır oysa Bir şeyi, bir etiket tanımlamak
Web sayfasında, bir sınıf olması gerekiyordu elemanları veya etiket herhangi bir sayıda kullanılan
web sayfasında.
Yani yeniden kullanılabilir olduğunu.
Bir kimlik yeniden kullanılabilir değildir.
A sınıfı tekrar kullanılabilir.
>> Ve biliyor ne olursa olsun, ne felsefi reasons--
Ben bitiremedi benim sandým ki söylemek için gidiyorum
ilk paragraf ve İkinci paragraf önemlidir.
Yani denilen sınıf uygulamak için gidiyorum "Önemli" bu benim dosyayı kaydetmek eğer
ve hayır vardır, yeniden henüz fonksiyonel etkisi.
Ama bazı ekledik dosyaya meta,
Ayrı bir şey tür dosya çekirdek verilerden,
böylece şimdi benim stil sayfasında, eğer ben Bunun yerine ".important" demek - bilirsin,
önemli şey, ben font-renk yapacağız, red--
ya da daha doğrusu yazı renkli değil, sadece renk.
tutarsızlıklar var CSS maalesef.
Ve yeniden yükleyin.
Şimdi ilk fark iki paragraf kırmızı
ancak üçüncü, çünkü ben sadece sınıfına uygulanan "önemli"
bu şeyler ilk iki.
>> Kimlikleri Yani, sen yeteneğine sahip çok hassas belirtmek için.
sınıflar ile, yeniden kullanılabilirliği var.
Ancak her iki durumda da, fark İyi tasarım prensibi tür
Ben tüm dışarı çarpanlarına nerede Benim styles.css dosyasına estetik.
Yani burada hiçbir messiness var.
Kırmızı hiçbir söz yok ya Bu dosyada cesur bakan veya yazı tipi boyutu.
Aksine ben anlam var, anlamlı, benim veri olarak karakterize
Burada bazı önemli veridir.
İşte bazı daha önemli veridir.
Dahası, burada Benim önemli verilerin "ilk".
Yani HTML hakkında sıralamak hepsi etiketleme, kelimenin tam anlamıyla, kelimelerin
ve paragraflar ve yapıları senin Bu küçük ipuçlarıyla sayfa, eğer
olacak, sen olabilir ki Bir şekilde kullanarak kaldıraç
Bu şekilde CSS gibi diğer teknikler.
>> Yani Victoria'nın soruya yanıt olarak, biz bu şekilde metin daha büyük yapabilirsiniz.
Orada pek çok başka yolları vardır, ancak yazı tag-- açık ayraç "yazı" -
aslında birçok yaşında.
Bu sorun, bir çok olan, ancak bel ile
Online resources-- üzerinde Onlar demode olma eğilimindedirler.
Ve gerçekten de, bu önerilmemektedir oldu, Dünya fark çünkü,
"Font-size = 7" ne demek?
Öyle değil.
Ve bunca yıl için ve Bu yan biri day--
Burada notları aslında olmasıdır inanılmaz acı hala bazen
için siteleri geliştirmek için ağ,, Microsoft
Google ve Mozilla ve diğerleri genellikle olarak nasıl katılmıyorum
HTML gibi bir şartname yorumlamak.
>> HTML bir kural kitabı var olduğunu, Genellikle her etiket ne anlama geldiğini söyler.
Ama bazen için kalan uygulama takdirine,
Microsoft'un takdiri ve Google.
Ve böylece çok sık olacak Bir web sitesi bir şey görmek
PC'de farklı görünüyor Bir Mac üzerinde yaptığından daha,
ve bu gerçekten, çünkü günün sonunda,
bunu test etmedi iyi iki platformlarda.
Ama, aynı zamanda, çünkü makul Akıllı insanlar katılmıyorum
ve şirketler katılmıyorum ve bu yüzden olacak programlama zorluklardan biri
web veya tasarımı için web için işler
Bir şekilde web sitenizin yazıyor her web tarayıcısında çalışır.
Ama bu bile doğru, mantıksız değil mi?
çok pek çok versiyonu vardır bir noktada, orada o tarayıcılar,
Ayrıca bir karar çağrısı yapmak zorunda ve bir şirket olarak karar vermek zorunda,
Özellikle e-ticaret-stili sen siteleri
son ve en büyük kullanmaya çalışıyor teknolojiler gerçekten iyi bir kullanıcı vermek için
deneyim.
Ama bazı kullanıcıların yüzde olabilir hala Internet Explorer 6 veya 7 kullanıyor
ya da 8, özellikle de bağlı Onlar geliyorlar o ülke.
>> Ve bu yüzden çok sık istişare şey
"Web tarayıcısı istatistikleri." Gibi
biz izin Şeye gitmek ve eğer en Vikipedi bakın ve up-to-date, bu grafik nasıl olduğunu görmek
eğer bir tane var.
Yani burada görebilirsiniz nerede aslında tarayıcılar
Aralık 2015 göre, vardır, ABD Hükümetine göre.
Krom ardından% 42 pazar payı olan büyük ölçüde kurumsal ortamlarda IE tarafından
ya da bilgisayar ayarları, tabii ki, Ateş, ardından
Daha sonra Safari, sonra Opera vermedi nedense burada harita yapmak,
ve ardından Diğerleri.
Belki Diğerleri altında.
Ama bu daha sorunlu o-- Vikipedi de var bakalım
tarayıcılar sürümleri version--
>> tarayıcı istatistiklerine dönelim.
IE.
Hatta bu yeterli değil.
Tarayıcı istatistikleri.
Benim sürümü.
Bu doğru olacak değil.
sürümlerini görelim.
Tarayıcı pazar payı.
Bu kadar gelirse bakalım.
TAMAM.
Şimdi bu oluyor Biraz daha kullanışlı.
Yani burada, hepimizin sahip olduğunu fark tarayıcılar farklı sürümleri.
Ve, Tanrım, Chrome'u Bak-- eğer 48, Krom 47, Chrome 31, Chrome 45.
Yani, giderek güncellenen tarayıcılar, ve bu değişikliklerin bazen
anlamlıdır işlevsellik açısından.
Ve böylece bir noktada, ürün yöneticileri ya da mühendisler
Bir karar yapmak gerekir sen Dünyanın sadece% 1'ini ne biliyorsun
hala IE 7 kullanıyor.
Canları cehenneme.
Biz sadece gitmiyoruz bu tarayıcıyı destekler.
Ve bu desteklemek için değil ne demek?
Bu düğmeler anlamına gelebilir web sayfasında çalışmıyor,
ya da anlamına gelebilir biçimlendirme tamamen kapalıdır.
Ya da yapmak gerekebilir Aynı yargı çağrısı
Biz konum mobil bu günlerde, içinde Artık IOS 5 desteklemek için gitmiyorum.
Yani insanlar sadece yükseltmek zorundayız.
Ya da Cupcake desteklemek için gitmiyoruz Android cihazlar için Android OS,
Çünkü kadar --daha dünya olarak tech dünya ileriye taşımak istiyor,
bu tür sürüklemek istiyor Bu yüzden dünya onlar değil
olmaya devam etmek zorunda geriye doğru uyumlu bu kadar
Yeni ve iyi özellikleri sunabilir.
Bu gerçekten nedenlerinden biridir pek çok şirket neden yayıyoruz
otomatik güncelleştirmeler ve zorlama tür bize yazılımın en son sürümü.
Ve hatta şirketler Elma sıralamak olacak gibi
Seni neredeyse zorlamak veya zorlamak Piyasa güçlerinin açısından size
Yeni bir telefon satın almak için onlar sırf Artık eski telefonunuzu güncelleme olmayacaktır.
Yani üzerine atlamak En son ve en büyük özelliği,
Bir şekilde onlara pahalı çünkü şirket tartışmalı, yaşlı bakımı
Yazılımın alt sürümleri.
Ama net etkisi olduğunu Biz aynı zamanda bu acı.
>> Yani sadece bir göz atalım Burada nihai şeylerin bir çift.
gerçek hızlı bazı knock off edelim bu diğer mermi, meraklı eğer.
Yani çalıştığınız takdirde, örneğin, pozisyon
farklı iki metin sayfa, ben, bir hızlı şekilde yapmak için gidiyorum
ancak farklı var Bunu yapmanın yolları.
Beni go ahead ve eliminate-- edelim Bu, aşağıdaki şekilde basitleştirir.
bana sadece geri dönelim benim Basit, basit paragraflar.
benim styles.css geri dönelim.
Ve sadece simple-- kullanmak için gidiyorum Google'da görmüş olabilir
veya earlier-- hatırlayacaksınız Doğru metin hizalamak.
Ve bu sayfayı yeniden yükleyin.
Şimdi her şey görünüyor sağa hizalı olması,
Burada havai görebileceğiniz olarak.
>> Biz görünmesini sağlayabilirsiniz biraz daha gibi-kitap ve biz "haklı" diyebilirsiniz
ve yeniden yükleyin.
Şimdi güzel ve her ikisi de kare var tür güzel yanları.
Biz burada vardı başka gol Metnin rengini değiştirmek oldu.
Bu yüzden benim kırmızı metin ile gördüm.
Ve şimdi bir form için düğmeler ekleyin.
Peki neden tam olarak bunu denemiyorsun?
Ama önce bana bir siteye gidelim o çoğumuz Google day-- her kullanın.
Ve en az bir göz atalım nasıl Google aslında çalışır.
Ama bunu yapmak için gidiyorum.
Öncelikle beni yep bunu kırmızı alt çizgi yapalım, Önce Google'a gidelim.
Ben gitmek zorunda gidiyorum Google Ayarları içine,
Ben devre dışı bırakmak istiyorum çünkü bir şey Anında Sonuçlar denir.
>> Yani fark etmiş olabilir Google, bu beni geri dönelim days--
ve bu açın.
Ben aramaya başlarsa Yani Böyle "kediler" için,
Sadece bunu değil fark Ben otomatik olarak tamamlamak olsun
Üst, tüm ani bir sayfa kendisi da oldukça hızlı bir şekilde değiştirmek gibi görünüyor,
ve Google'ın bir dil kullanarak var yardımcı olmaya çalışıyorum JavaScript denir.
Ama ne yazık ki, bu tür Bizim tartışma messes
Aslında neler olup bittiğini Burada başlık altında.
Yani sadece biraz çabuk değilim anında sonuç kapatın.
Ve ben Kaydet'i tıklayın gidiyorum.
Ve şimdi ben açacağım tanı araç o ben
Ağ sekmesi altında açılış tutmak.
Yani bu yapalım.
Benim, whoops-- edelim Biraz bu aşağı kaydırın.
Ve bana aramak için izin "kedi".
>> Ve şimdi notice-- aslında Bu iyi bir fırsat
Bir an için görüşmek üzere.
Bunu durdurmak type-- anı dikkat edin.
Durdur şunu.
TAMAM.
Ben harfi anı dikkat C, ekranın alt izlemek.
A- T- S. neler dibe yapar Bu ekranın, benim Ağ sekmesi,
Her oluyor önermek zaman bir mektup yazın?
Ne yazık ki, kurbağa çok olduğu rahatsız edici, bugün veya yonca
ya da ne olursa olsun.
Ne yazdığınız her zaman oluyordu?
Ve bana silmenize olanak tampon ve yeniden yazın.
Yani-- hoppala.
Ben bir mektup yazın her zaman C- A- T- böylece yeni bir satır besbelli görünen tutar.
Bu satırların her ne temsil ediyor, Gördüğümüz ve ele aldığımız dayalı
şimdiye kadar?
İZLEYİCİ: Bir arama?
DAVID J. MALAN: Bir arama veya daha genel olarak, bir HTTP isteği
sunucuya benim tarayıcı.
Eh, neden benim tarayıcı bir HTTP yapıyor Her zaman ben bir mektup yazın talep?
>> İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Evet, veriyor Bana bu otomatik tamamlama sonuçları.
Gibi nerede bu yapmak Arama sonuçları geliyor?
Eh, her zaman bir tip mektup, Google, daha gönderir
ve daha fazla ve daha fazla Ben yazmaya çalışıyorum kelime.
Niye ya?
onlar bana bir vermek istiyorum çünkü Daha iyi ve daha iyi, daha iyi öneri,
Ne kelimesinin için öneriler listesi, Aslında tam çalışıyorum.
Yani bu tam anlamıyla her söylemek için karakter Google'da yazdığınız
sonuçta içinde, gönderiliyor toplu, aynı zamanda bazen bir
uygulamak için bir seferde Bu otomatik tamamlama özellikleri zaman
veri web üzerinde, tabii ki vardır.
>> Şimdi, aslında ne bir göz atalım Google Ara 'yı ne olur.
Ve sonra biz bu kendimizi kaldıraç olacak.
Çok şimdi aşağı doğru ilerleyin Yani eğer Sadece oldu ilk isteği.
aşağıdaki dikkat edin.
Bu oldukça uzun gönderildi URL-- https://www.google.com/search?
ve sonra şeyler bir sürü.
Şimdi aslında bu görelim tarayıcı sekmesinde kendisi.
burada araç çubuğu kurtulmak edelim.
İşte arama sonuçları sayfası.
Ve ihbar burada URL.
Şimdi, muhtemelen tahmin Ne kısmen burada oluyor.
Bir tanım, tüm yüzden ilk.
Bu görünüşte hedef Form nerede sunulur.
Yani yazdığınız zaman Ekranda "kediler" ve Enter tuşuna basın
görünüşe göre Google gönderdi Bu URL'ye benim metin girişi
Ben vurgulanır ettik Orada, arama çizgi.
bir URL şey olarak çıkıyor bir soru işareti sonra ne olur,
diyerek tutmak gibi, bir anahtar-değer çifti Bu forma ya da bir şekilde yazıldığından
iletilen Sunucuya tarayıcı.
>> Yani herhangi bir zaman giriş tipi Web üzerinde bir forma
biz ettik olarak ve gönderildikten Bir get yoluyla, tartışıyor,
Bu sanal bir zarflar, içeriği
evet envelope-- arasında tutmak Fiziksel dolması alıyorum
sınıfta zarfa Bugün, ancak teknolojik
aslında URL'ye koydu.
Aslında Yani, beni bu aracılığıyla elemek edelim.
Nerede kullanıcı girişi görüyorsunuz?
Nerede bir şey görüyorum Kendimi burada yazdığınız?
Yani "kediler." Evet
Sağ?
Bu yüzden bana bu damıtmak izin basit bir şey haline.
Ben hakkında her şeyi silmek için gidiyorum Ben anlamıyorum bu URL,
ve ben sadece terk edeceğim o paha olarak / search? q = kediler.
Biz nerede q görürsünüz Bir an geliyor,
ama bu asgari gibi hissediyor Ben verilen bilgilerin miktarı.
Ve şimdi Enter tuşuna gidiyorum.
Ve hala çalışıyor dikkat edin.
Biz hala kedi bir sürü geri almak.
Yani Google meraklısı olduğunu Bu daha bu gün.
Bu 2016 değil 1999 olduğunu.
Yani diğer şeyler var ki gözlerimi tarayıcı sunucuya gönderiyor.
Ama bu minimal olduğu Bütün bu gerekli.
>> Yani ne oluyor?
Peki, ilk beni go ahead ve gidelim geri Cloud9 ve beni önde gitmesine izin
ve önceki benim sekmeleri kapatın.
Ve ben bu konuda yapacağım benim Sadece bir an için kendi.
Ben devam edeceğim ve yeni bir dosya oluşturun.
Ve ben google.html olarak kaydetmek için gidiyorum.
Ve ben çok quickly-- gidiyorum Ben, aslında, çalacağım
Bu metnin bazıları sadece zaman kazanmak için.
Burada bu yapıştırmak için gidiyorum.
Ben rahatsız etmeyeceğim Herhangi bir stylization bu sefer.
Biz bu diyeceğiz "My Google."
Ve ben kurtulmak için gidiyorum Vücutta her şeyin.
Ve ben aşağıdakileri yapmak için gidiyorum.
Beni yakınlaştırmak edelim.
action-- Form ve kısaca belirtildiği gibi Kısaca şekilde whoops-- earlier--
Bir eylem, daha önce bahsedilen form veri göndermek yerdir.
Yani google.com/search.
Ve yöntemi kullanmak istiyorum iki şeyden biri olabilir.
biz tutmak gibi ya "olsun" olabilir tartışırken, ya da olabilir "post".
Şimdilik, temel Eğer kullanırsanız fark "olsun," dir
tüm bilgileri kullanıcı URL'ye gönderilen alır sağlar.
>> Bu arama gibi şeyler için harika motor ve bir kaç başka uygulamaları,
ama ne koşullar olur Bir formu doldurmak istemiyor
ve bilgi sonuna kadar var URL tarayıcınızın adres çubuğuna gibi?
Ne tür belgeler siz-- yapmak
İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Evet, ne gibi?
İZLEYİCİ: Şifreler.
DAVID J. MALAN: Evet, log böylece Facebook ya da bazı web sitesine giriş.
Bu kullanıcı girişi var Bir form, bir metin kutusu,
ama muhtemelen istemiyorum Tarayıcının URL gösterilmesini.
Niye ya?
Belki bazı vardır, yani Ağdaki güvenlik etkileri,
ama gibi more--, daha basit, ne olur senin oda arkadaşı, diğer önemli,
çocuklar, eşiniz görünüyor Tarayıcı tarihi boyunca?
şifrenizi hakkı yoktur Orada tarayıcınızın tarihinin.
Bu iyi bir tasarım gibi gelmiyor.
Hatta daha teknik, Eğer çalışıyoruz varsayalım
Flickr fotoğraf yüklemek için veya Facebook ya da wherever--
bu da, kullanıcı girişi nasıl interesting-- biraz daha var
Ben URL çubuğunda bir görüntü tıkmak mı?
Sen çeşit çeşit olamaz.
Tür yapabilirsiniz.
Ama, gerçekten, ben başarabilmiştir değilim bunu yaparken hayal etmek.
Yani için başka bir yöntem gerekir Bir web sitesine fotoğraf yükleme,
ve diğer bir yöntem "post" denir.
Ama şimdi, biz sadece hakkında konuşacağım iki basit olan "olsun".
Sadece koyar tüm URL içine kullanıcı girişi.
>> Yani burada yaratıyorum formudur.
Ben bir giriş istiyorum.
Ve biliyor musun?
Burada bir tahmin almak için gidiyorum.
Ben hatırlamak gidiyorum benim giriş "q" "sorgusu."
Ve ben bu biri olduğunu düşünüyorum özgün tasarımlar, belki de 1999.
Bu girişin ardından tipi Sadece olacak "metin."
Ve sonra başka bir giriş var gidiyorum Bu kadar biz yakında olacak, bir isim gerekmez
türü olduğunu görüyoruz "gönderin."
Ve bu gidiyor Bana özel bir düğme bulunuyor.
Ve bu kadar.
>> Bu yüzden bana go ahead ve bu dosyayı kaydetmek sağlar.
Ben geri gidiyorum benim tarayıcı ve google.html gidin.
Girmek.
Ve bu seyrek tür kısaca söylemek gerekirse.
Ama ben önde gitmesine izin ve arama "kediler."
Ve ben şu anda olduğum fark Bu Cloud9 URL adresinde.
Ama şu an ben bu tıklatın nereye ben bitireceğiz umuyorsunuz?
>> İZLEYİCİ: Google.
>> DAVID J. MALAN: Google.
Yani Gönder'i tıklayın edelim.
Ve gerçekten Google'ı yeniden uyguladık.
Sağ?
Bu basit değil.
Bu hafif.
Benim kod açıkça daha iyidir demek onların, karışıklık daha önce gördük.
Ve biliyor musun?
Ben biraz bu kadar baharat gidiyorum.
Ben bunu daha önce söz vermedi.
Başlık 1 için H1 gibi etiketleri vardır, Bir sayfaya en önemli başlığı.
"Google," Ben bu arayacağım.
Beni yeniden edelim.
Zaten biraz daha iyi görünüyor.
Ve aslında, biliyor musun?
Ben yalan already-- ettik.
Ben bu stil için gidiş değildi dedi, ama önce olduğu gibi bu stil için gidiyorum.
Ve bedenim, olacak text-align merkezi, diyelim.
Zaten daha Google gibi bakıyor.
>> Ben, yine de, bir çizgi molaya ihtiyacı Bunun için düğmeye gönderin.
Ve bu, çıkıyor paragrafları kullanabilir,
ya da daha tam anlamıyla sadece söyleyebiliriz Bana mola br etiketi Doğuların bir çizgi verir.
Ben bu yeniden Ve eğer şimdi oraya gidiyor.
Biraz çirkin, bu yüzden Birden fazla satır sonlarını yapabileceğini,
ama burada çok açgözlü olsun etmeyelim.
Yani şimdi onun için çalışıyor bakalım "köpekler."
O da "köpekler" için iş gibi görünüyor.
Yani zorlayıcı paket burada ne var?
Şehre için büyük bir sıçrama değildi Birkaç daha fazla etiket tanıtmak
giriş etiketinde form etiketi gibi.
Ama daha temelden olduğunu hepimiz yapıyoruz
anlayışımızı yararlanarak olduğunu HTTP ve aslında
formlar sonuçta değiştiren Tarayıcının URL ne var,
ve böylece, bu nedenle, biz mekanik bir sunucuya girdi sağlamak
Bir HTML formu yapmak ve bilerek Sunucu HTTP anlar,
sadece bizim beden gibi, anlar gibi, elime sallayarak, aynı protokol,
ve bu yüzden tepki geri almak sonuçta bekliyoruz.
>> Yani birini yapmayı deneyelim son şey artık mobil ile,
ve ben ekleyeceğim make-- edeceğiz slaytlar bu kodu.
Eğer size tamircilik istiyorum yani eğer kesinlikle oradan alabilir.
Ama gidiyorum önde ve bir şey yapmak.
Ben devam edeceğim ve Benim endeks page-- açmak
daha önce olduğu gibi benim merhaba sayfası, hangi Bu sahte Latince metin bir yeri vardır
veya anlamsız Latince metin ve has-- Bu yazı tipi boyutu bu gibi görünüyor.
Ama beni go ahead ve bu yapalım.
Ben Cloud9 gitmek için gidiyorum.
Ve bu adımı yapmak zorunda değilsiniz.
Ben sadece kendim yapacağım.
Ben paylaş tıklayın gidiyorum.
Bu bir özelliktir Sadece Cloud9, bu sayede, bir
Ben çevre, kamu yapabilirsiniz.
>> Ve sadece uğruna gösteri, bunu yapmama izin ver.
Benim uygulama kamuoyuna yapacağım.
ben, beni uyarıyor dikkat Eminim, bunu yapmak istiyor
Bu herkesi yapmak için gidiyor çünkü Dünyada, ister şimdi buradayız
veya daha sonra video izlerken mümkün internet görüyorum ne olduğunu görmek için.
Ama bu sorun değil.
Ben söylemek için gidiyorum "Bitti."
Ve eğer bilseydim, sana teşvik edelim Bu bana ilk test edelim correctly--.
Eğer zihinli yoksa, devam edin Bilgisayarınızdaki bir tarayıcı,
Bu URL'ye gidin ve umarım Benim Latince metnini göreceksiniz.
Ve net olmak gerekirse, bu kadar benim laptop değil koşuyor.
Bu bulut içinde.
Bu, kelimenin tam anlamıyla, Cloud9 üzerinde ama Benim çalışma kamuoyuna yaptık
böylece internet üzerinden herkes Benim Latince ana sayfa erişebilirsiniz.
>> Aynı URL adresine gidin Telefonunuz, eğer sen-ebil.
o, size rağmen, size mal olacak eğer Sadece bir omuz üzerinden bakabilirsiniz.
İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Üzgünüm?
İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Sadece Latince kelimeler.
Bu kadar.
Ama bu gördüğünüz gereken de budur.
>> İZLEYİCİ: Evet.
DAVID J. MALAN: Evet.
Evet.
TAMAM.
Yani tutabilir senin Sadece bir an için telefon?
Yani, umarım, erişiyorsanız o, neredeyse okunamaz bakmak gerekir.
Bu demek still--, öyle değil Çünkü Latin okunmaz.
Ama aynı zamanda okunamaz var Ne başka bir nedenle?
Mesela, bu ne hakkında displeases?
İZLEYİCİ: Bu küçük.
DAVID J. MALAN: Bu süper küçük, süper değil.
Peki bunu düzeltmek?
Bu süper küçük, süper bulunuyor Victoria'nın telefonda
ve, sen çekti verdiyseniz Muhtemelen o kadar kendinizi,
Telefonunuzda küçük, hem de sürece Erişilebilirlik ayarları etkin olması.
Bu da ne?
Sadece çimdik olabilir ve uygulanabilir olduğunu zoom,
ama o zaman sadece bakın Bir seferde birkaç kelime.
Yani bir dakika bekleyin.
Bunu düzeltmek için biliyorum.
Sağ?
Ben CSS kullanabilirsiniz, ve ben değişebilir 12-noktadan 24 noktaya yazı tipi boyutu.
Ama bu yan etkisi, Tabii, şimdi olacak,
Bir masaüstü veya dizüstü, şimdi metin iki kat daha büyük.
Ve böylece bu tür güzel olurdu cihazlar arasında ayırt etmek için,
ve orada çıkıyor Bunu yapmanın yolları vardır.
Bir kaç tane var Farklı şekilde, aslında,
CSS ve meraklısı özelliklerini kullanarak bu sayede biz büyük detaylı girmeyeceğim ki
aslında sorgulayabilirsiniz tarayıcı ve söylemek
Ekran bu daha küçükse Birçok piksel, bu yazı tipi boyutunu kullanın.
Ekran bu daha büyükse Birçok piksel, bu diğer yazı tipi boyutunu kullanın.
>> Hala bile meraklısı olabilir.
Hiç ziyaret ettiyseniz bir Web sayfası, bir masaüstünde,
belki kapalı büyük bir menüye sahip sonra yan ve tüm içeriği
bu yan için Menü-- ortak bir paradigmanın türüdür.
sol, içerik menüsü sağ, ya da tam tersi.
ne zaman gerçekten mobil çalışmıyor senin Ekran geniş Sadece bu kadar çok piksel.
mobil So daha yaygın, menü aniden alacak
çöktü ve var Bunu görmek için bir düğmeyi tıklatın,
veya web sitesi menüsü koyacağız ve üstünde altındaki içerik koymak.
Ve bu uygulayabilirsiniz Çok çeşitli şekillerde işler.
Sen programcıları sorabilirsiniz, hey, takım, her zaman
Bir Android bir HTTP isteği bakın Cihaz, bir Microsoft aygıt, Google
Cihaz, bir Apple cihazı, bu kullanmak yazı tipi boyutu, bu menü düzeni kullanmak ve
yoksa bu varsayılan büyük düzeni kullanın.
>> Şimdi kullanarak neler Temel teknik bugün
mühendisler kullanabilirsiniz öyle olmadığını bilmek
bir iPhone, Android telefon, bir dizüstü bilgisayar, Şirketin sunucu ziyaret masaüstü?
Ki burada bu bilgiyi alabilirim?
>> İZLEYİCİ: Üstbilgi?
>> DAVID J. MALAN: Evet, HTTP üstbilgisi.
Yani her HTTP isteği gelen müşterilerine kendi sunucularına
Bu sanal içinde bulunmaktadır zarf, bir sürü
HTTP başlıkları biridir tarayıcı ve işletim sistemi
Hatta, size bakım eğer ayrıntı bu seviyede.
Şimdi, bir şifreli görünümlü dize, ama Yazılım var olduğunu sadece olacak
Bu basitleştirmek ve sadece sorabilirsiniz PHP, Java, C code-- programlama ++
neyse Ne telefon bu-- olduğunu kullanarak bu kullanıcı hangi cihaz nedir?
Ve sonra onlara bu gösterebilir, diyebiliriz web sürümü bir telefon ise.
Onlara bu sürümü göster Web sitesi bir dizüstü veya masaüstü eğer.
Ama bile gerek yok sunucu tarafı karmaşıklığı.
Sen şeylerin bile basit yapabilirsiniz.
>> Bunu yapmak için gidiyorum.
Ben içine önde gidiyorum Benim Cloud9 çevre,
ve ben bir etiket eklemek için gidiyorum Daha önce Google gördüm.
Bu meta denir.
Ve ben bu yüzden, bu bir hiç hatırlamıyorum Ben burada uyarlamak için gidiyorum.
Meta name = sonra "viewport" ve content = "width = aygıt genişliği, intital
Ölçek = 1 "ve bu kadar.
>> Bu yüzden de olabilir büyülü bir sözler gibi.
Her şey açık değil, ama bu vardır bir şey, görünüm ile yapmak
ve viewport bir sadece bir organdır web sayfası, dikdörtgen bölge olduğunu
Sayfanın en tanımlar.
Ve bu sadece anlatıyor tarayıcı, biliyor musun?
Bu sayfanın genişliğini olun Cihaz genişliğine etkin bir şekilde eşit.
Diğer bir deyişle, düşünmeyin sınırsız alan tür var.
Yalnızca kadar olduğunu varsayalım cihazın kendisi kadar boşluk büyük.
Ve şimdi, eğer ben bu yeniden Benim tarayıcıda, ben hiçbir değişiklik görüyorum.
Ama bu correctly-- yaptıysam ve benim fingers-- çapraz izin Hepinize varsa
telefonlarınızı yeniden, do you zorlayıcı bir değişiklik görüyor musunuz?
Evet, ki- olduğunu
>> İZLEYİCİ: [Duyulmaz]
DAVID J. MALAN: Evet.
TAMAM.
Yani belki daha okunabilir şimdi?
Hala küçük, adil olmak, ama değil kadar küçük yönetilemez olması.
Ve ben kesinlikle bu geçersiz olabilir ayrıca CSS ile ya da sunucu tarafında,
ama giderek sen neyi daha fazla özellik olduğunu görünce
eklenen istemci tarafı environments--
JavaScript, biz ele alacağız olarak Yarın, CSS ve HTML-- böylece
Bu sorguları tüm istemcide yapılabilir
böylece rahatsız Sunucu çok daha az değil
için, ayak uydurmak zorunda örnek, sabit saldırı
Yeni işletim sistemi sürümleri, yeni tarayıcı sürümleri.
Sadece tarayıcı sağlayabilirsiniz Cihazı sormak, sen ne kadar büyük
ve daha sonra biraz mantıklı olun buna göre kararlar.
Ama biz daha fazla fırsat göreceksiniz mantıksal kararlar için
bağlamda yarın Bir programlama dili.
>> Yani, herhangi bir soru, daha sonra, web geliştirme?
Bugün web programlama, başına değil, Yaptığımız se beri her şeyi
eğer sen, çok estetik oldu.
hiçbir karar verme de vardır Biz yazdım kod,
HTML biçimlendirme neden ve böylece var dil, bir programlama dili.
Ama yarın alacağım hızlı bir bakış, sonuçta,
JavaScript de, ki bu gerçek bir programlama
Bize biraz daha fazlasını sağlar dil.
>> Sorusu olan?
Peki, bana iki teklif izin ödev için isteğe bağlı fırsatlar.
Bunlardan biri Cloud9 bu-- hesapları sona olmayacaktır.
Kullanmak için buyrun Onları ile tamircilik.
Bu hizmet ücretsiz seviye bulunuyor.
oluştururken, bu Gerçekleştirmek Çalışma alanı, sen, kamu yapılmış
Bu konuda kimseyi demek İnternet yazdıklarınızı görebilirsiniz.
Yani belki sadece düşünün Kendini rezil değil
Eğer ilk web koyarak eğer kamuya yanlışlıkla orada sayfa,
ama kimse gidiyor Zaten orada bakmak için biliyorum.
>> Ve beni atmak izin iki-- yanı sıra bu URL yukarı,
Bugün a geldi özellikle , Diğerlerine göre daha az konforlu küçük
Bütün bu şeyler ne anlama geldiğinden emin.
Bu videonun çok daha fazla fark hangi uykuya dalmak için iyi bir yol hem
ve ayrıca süre gülmeye Ayrıca, bu yüzden yapıyor
toplumsal olarak ilginç bir sürü ve güvenlikle ilgili tartışmalar
burada John Oliver dan, bir komedyen olsa.
>> Ama başka soru varsa, Bu alımı için bize getiriyor.
Öyleyse neden müzik açmazlar.
içecekler olmalı dışında ve aperatifler.
Ben için karıştırmak için mutluyum millet istiyorum sürece,
tek-tek soru daha cevap.
Ama aksi halde, buyrun herhangi bir noktada çıkarmak,
ve biz tekrar göreceğim biraz daha için yarın sabah.
Tamam, teşekkürler.