DAVID J. Malan: Tout dwa. Nou se tounen. Se konsa, objektif la nan sesyon final sa a se prezante yon tijan plis konsÃ¨p men tou, bay tout moun yon chans kalite detire dwÃ¨t ou ak aktyÃ¨lman fÃ¨ yon bagay yon ti kras men-sou. Objektif la se pa vire nou tout nan devlopÃ¨ entÃ¨nÃ¨t pa nenpÃ²t vle di men vrÃ¨man jis l 'ban nou yon gou nan kÃ¨k nan konstwi yo fondamantal nan sa ale nan pwogram entÃ¨nÃ¨t ak entÃ¨nÃ¨t jodi a devlopman, se konsa nan estatik bÃ² nan things-- pa gen okenn lojik, pa gen pwogram lang, jis kontni estatik. Epi li pral ban nou yon opÃ²tinite ki aktyÃ¨lman wÃ¨ sa ki yon sÃ¨vÃ¨ sit entÃ¨nÃ¨t se, gade ki sa yon dosye HTML se, wÃ¨ sa ki li se HTTP se aktyÃ¨lman sÃ¨vi moute. Men, anvan nou plonje nan, nenpÃ²t retrospektiv kesyon sou nwaj informatique oswa sekirite oswa nenpÃ²t bagay nan ant? Pa gen? Tout dwa, byen, se pou yo fÃ¨ sa, jis nan ka pwosesis la nan siyen pou yon bagay pran yon kÃ¨k minit. Nou pral kite l fÃ¨ l 'nan background nan. Ale pi devan, si ou te kapab, sa a URL isit lan-- c9.io. Sa a se yon twazyÃ¨m-pati service-- platfÃ²m kÃ²m yon sÃ¨vis, si ou will-- ki pral envite ou pou enskri pou yon kont, ak li a pral bay chak nan nou yon kont nan syÃ¨l la sa yo rele sou enfrastrikti yon lÃ²t moun, yon konpayi yo rele Cloud9. Men, sa ki nan bÃ¨l sou sa a se ke yo ba ou yon apwoksimasyon nan yon aktyÃ¨l devlopman mond reyÃ¨l la anviwÃ²nman, kwake nan la nwaj ak nan yon navigatÃ¨ entÃ¨nÃ¨t, epi n ap sÃ¨vi ak sa a ki aktyÃ¨lman eksperyans yon ti jan jodi a. LÃ¨ sa a, ale pi devan epi jis navige fason ou nan pwosesis la siy-up si ou t 'kapab. Se konsa, nou rive sÃ¨vi ak sa a nan klas la Mwen anseye pou tout moun nan elÃ¨v nou yo, tou de sou lakou lekÃ²l la yo ak sou kounye a, ak li nan ranplase sa istorikman te otreman Downloadable lojisyÃ¨l. Se konsa, sa ou te jwenn aksÃ¨ nan se youn nan sa yo machin vityÃ¨l, esansyÃ¨lman, pou m 'dekri pi bonÃ¨. Se konsa, Cloud9 konpayi sa a pwobableman pri lwaye ki sÃ²ti nan yon party-- twazyÃ¨m tout bon nan ka sa a, Google-- yon antye pakÃ¨t moun sou machin vityÃ¨l ki yo yon jan kanmenm koupe moute nan ilizyon an nan serveurs endividyÃ¨l ke chak nan nou gen kontwÃ²l konplÃ¨ sou. Li pa byen egzat yo di ke yo ap machin vityÃ¨l, menm si, paske sa Cloud9 aktyÃ¨lman sÃ¨vi ak se yon teknoloji yon ti jan plus rele kontnerizasyon. Ak kite m 'gen tan pwan foto sa a isit la nan penti foto sa a. 

Yon veso se, si ou sonje foto a soti nan pi bonÃ¨, yon ti kras pi lejÃ¨ pwa pase yon machin vityÃ¨l. An reyalite, LÃ¨ nou konsidere ke dÃ¨nye fwa nou te pale osijÃ¨ de gen yo te yon opere sistÃ¨m ak yon ipÃ¨rvizeur ak LÃ¨ sa a sistÃ¨m opere envite, envite sistÃ¨m opere, opere envite sistÃ¨m, sou tÃ¨t ou pyÃ¨s ki nan konpitÃ¨ fizik, diferans la ak sa a plus teknoloji, kontnerizasyon, se yo ke yo tout yon jan kanmenm pataje menm sistÃ¨m nan fonksyone. Men, yo toujou kreye ilizyon an nan tout moun gen li oswa li pwÃ²p san konte dwa administratif ak dosye sou sÃ¨vÃ¨ a. Men, gen nan mwens lojisyÃ¨l nan ant ou menm ak pyÃ¨s ki nan konpitÃ¨. Rezilta a nan ki se, nan teyori, yon pÃ¨fÃ²mans ki pi wo, paske w ap lÃ¨ l sÃ¨vi avÃ¨k oswa gaspiye mwens resous sou sa sa yo rele kouch Virtualization. Se konsa, sa a se rele kontnerizasyon pa nati pa fason pou yon teknoloji ki rele Koupre, ki se anpil vini nan pwÃ²p li yo. LÃ¨ sa a se yon bagay ki enjenyÃ¨ nan konpayi ou ta ka kalite sÃ²t de kÃ²manse pale sou byento si yo pa gen deja, menm si gen nan sÃ¨tÃ¨nman pa gen okenn rezon ki fÃ¨ yo sote sou nenpÃ²t bandwagons. 

Se konsa, avÃ¨k ki te di, ki sa pwobableman ou wÃ¨ kounye a se yon ekran ki sanble yon ti jan tankou sa a. OK. Epi jis rele m 'sou si se pa. Men, si so-- mwen pral vin sou si se pa. Ale pi devan epi klike sou ki gwo plis yo kreye yon vorkspas, epi ou pral wÃ¨ yon ekran tankou sa a. Ou ka rele vorkspas la non nenpÃ²t sa ou vle pou kounye a. Epi jis aktyÃ¨lman pou senplisite, ale and-- byen, anpil nan nou deja gen vorkspas. Rele li tou sa ou vle-biznis, Harvard, Jedi, tou sa ou ta renmen. Ou pa bezwen yon deskripsyon. Ou ka kite li prive, sof si ou deja gen yon pakÃ¨t moun sou vorkspas. Si w ap fÃ²se yo fÃ¨ li piblik, sa a, se amann pou rezon a jodi a. Isit la, tou, se youn nan upsells yo. Ou jwenn youn vorkspas prive pa default. Men, si ou vle plis, ou oblije peye pou pi plis. Otreman, yo fÃ²se ou fÃ¨ piblik travay ou. Men, sa a amann, paske yo menm tou yo sib sa a nan kominote louvri-sous ankouraje moun yo aktyÃ¨lman kolabore. 

Epi bagay ki sot pase a sa a, se enpÃ²tan, menm si, se, apre ou fin chwazi yon non ak apre ou chwazi pou ou prive oswa piblik, klike sou HTML5, gwo icon nan zoranj dezyÃ¨m soti nan bÃ² gÃ²ch la, ak LÃ¨ sa a, klike sou Kreye buro. Epi li pral pwobableman pran yon minit oswa konsa, men ou pral LÃ¨ sa a, gen yon anviwÃ²nman, yon fwa ou fÃ¨ sa, ki sanble okoumansman de sa m 'genyen sou ekran an isit la kounye a. Men, ankÃ², li ta ka pran yon minit oswa plis pou li ale nan ekran sa a yon fwa ou te klike Kreye buro. Men, jis drapo m 'sou si ou ta renmen m' pran yon gade nan anyen oswa konseye. Tout dwa. Se konsa, mwen ale nan jan nou koumanse sa a pou kounye a. Rele m 'sou si ou sanble yo gen nenpÃ²t difikilte teknik. Men, ankÃ², li ta ka pran yon ti kras pou sa yo louvri. Li kite yo ale pi devan epi pale sou sa li aktyÃ¨lman vle di fÃ¨ yon paj entÃ¨nÃ¨t, sa HTML se, ak ki jan tout bagay sa yo kounye a interconnexions kÃ²m nou ap kÃ²manse ki aktyÃ¨lman sÃ¨vi ak kÃ¨k nan teknoloji a. Se konsa, li sanble ke mwen kapab ale sou ti kras Mac mwen an isit la, louvri yon pwogram senp rele TextEdit, oswa sou Windows mwen te kapab louvri yon bagay yo rele Notepad.exe. Apre sa, mwen te kapab jis tou senpleman fÃ¨ yon bagay tankou sa a men "hello, nan lemonn." LÃ¨ sa a, mwen te kapab sove sa a kÃ²m hello.txt Se konsa, pa gen okenn majik la. Sa a pa gen anyen fÃ¨ ak sit entÃ¨nÃ¨t pwogram, pa gen anyen fÃ¨ ak HTML. Jis kreye yon dosye tÃ¨ks ki senp. Men, li sanble ke yon sit entÃ¨nÃ¨t paj se literalman sÃ¨lman sa. Li se yon senp tÃ¨ks dosye tÃ¨ks ki gen ke ou ta ka tape nan klavye ou, men li tipikman men se pa toujou fini nan pa .txt men .HTML oswa .htm. Epi ou pa fÃ¨ sa jis tape mo nan dosye a. Ou gen aktyÃ¨lman yo sÃ¨vi ak bagay sa yo rele Tags oswa, plis jeneralman, yon bagay rele lang markeup. 

Se konsa, mwen ale nan trÃ¨ vit tape ak LÃ¨ sa a eksplike ki annapre yo. Mwen pral premye tape sa a, ki di, hey, navigatÃ¨, isit la vini yon paj entÃ¨nÃ¨t ekri nan HTML. Apre sa, de bagay sa yo ansanm di, hey, navigatÃ¨, sa ki annapre yo se vre HTML. Hey, navigatÃ¨, isit la vini nan tÃ¨t oswa tÃ¨t la nan paj m 'yo. Hey, navigatÃ¨, andedan nan tÃ¨t la nan paj mwen, mete yon tit se sa ki, "hello, nan lemonn. " Hey, navigatÃ¨, apre yo fin tÃ¨t la nan mwen paj, isit la vini kÃ² a nan paj m 'yo. Epi, hey, navigatÃ¨, kÃ² a nan mwen paj ta dwe tou di, "alo nan lemonn." Se konsa, sa yo se detay yo essayant isit la? Sa a se sa ki nan jeneralman rele yon deklarasyon doc-kalite, ak, franchman, li nan yon ti kras difisil yo memorize sa a an premye. Ou jis kalite kopi-kole li. Sa a se yon fason a fÃ²mÃ¨l nan di, hey, navigatÃ¨, M ap itilize HTML vÃ¨syon 5 ki soti yon ti jan dÃ¨nyÃ¨man. Li se yon enkantasyon majik ki kÃ¨k moun ki gen yon sans pÃ²v nan konsepsyon deside mete nan la anpil tÃ¨t nan dosye a. Menm si li nan yon ti kras Esoteric, ki nan tout li means-- hey, navigatÃ¨, isit la vini ak vÃ¨syon 5 nan HTML. 

te RÃ¨s la nan sa a te avÃ¨k nou pou kÃ¨k tan kounye a, istorikman, men li te gen en, ak li a pwobableman te resevwa yon ti kras ki pi senp. Avi yon karakteristik kÃ¨k nan sa m 'te make. Genyen bagay sa yo ak Incline brackets-- bracket a bÃ² gÃ²ch ak bracket a dwat. Apre sa, remake simetri a isit la. Ak nan simetri, mwen vle di, menm jan mwen gen sa a tag kÃ²manse isit la oswa yon tag louvri si ou vle, desann isit la mwen gen yon fÃ¨men tag oswa yon tag fen sa a, se diferan sÃ¨lman tÃ¨l degre ke li gen sa a koupe nan kÃ²mansman an nan pawÃ²l Bondye a HTML. Epi ou ka panse a sa a jan mwen te dekontrakte pwopoze anvan, hey, navigatÃ¨, isit la vini kÃ¨k HTML. Epi, KontrÃ¨man, hey, navigatÃ¨, sa a, se li pou kÃ²mansman an HTML-- ak yon fen. 

Pandan se tan hey, navigatÃ¨, isit la vini tÃ¨t la nan paj m 'yo. Hey, navigatÃ¨, sa a, se li pou tÃ¨t la. Hey, navigatÃ¨, isit la se kÃ² a nan paj m 'yo. Hey, navigatÃ¨, sa a, se li pou kÃ² a. Apre sa, andedan nan ki se kÃ¨k abitrÃ¨ tÃ¨ks pou kounye a. Ak andedan nan tÃ¨t la, pandan se tan, se kÃ¨k abitrÃ¨ men atenn, se konsa pale, tÃ¨ks ki di, tit la nan paj m ap "hello, nan lemonn." Koulye a, pou kounye a, ou kapab asime ke navigatÃ¨ gen only-- oswa, olye, paj wÃ¨b gen sÃ¨lman de parts-- tÃ¨t la ak kÃ² a. Ak tÃ¨t la se jeneralman jis tankou ba meni an, bagay la vrÃ¨man jis nan tÃ¨t la anpil. Ansanm ak tout kÃ² a se entesten yo nan paj la, tout bagay nan ki rektang gwo ki plen ekran an. Se konsa, mwen pral ale pi devan epi fÃ¨ sa a. Mwen pral ale pi devan ak klike sou Save, File Save. Men, mwen pral pou konsÃ¨ve pou sa a kÃ²m hello.html, ak mwen jis ale nan mete l 'sou Desktop m' yo. Apre sa, mwen pral ale pi devan epi klike sou Save. Apre sa, notice-- Mac mwen an pi piti se tap rele ke nan m '. Ãske ou sÃ¨ten ou vle fÃ¨ sa? Apre sa, mwen pral di, repons lan se wi, sÃ¨vi ak HTML. Mwen konnen pi byen nan ka sa a. Epi, koulye a mwen pral pou yo ale nan Desktop m ' kote mwen gen sa a ranpli toudenkou. Men, mwen pral a doub-klike sou li. Apre sa, ou pral avi ke, pa default, Chrome louvri moute. Sa a paske se sa navigatÃ¨ default mwen. Epi, se jis di, "hello, nan lemonn." Men, li di "hello, mond "nan de kote. Avi gÃ²ch anwo. Joli difisil yo kapab manke sa. Li nan gwo ak karaktÃ¨ fonse. Ak ki kote lÃ²t moun li sanble yo di, "hello, mond"? 

ODYANS: Tab la. 

DAVID J. Malan: Yeah, tab la tÃ¨t li. Se konsa, lÃ¨ m 'te di tÃ¨t la nan nan paj se tout bagay moute top-- ak tout bon sa a se tit la. Se jis nan tab la isit la. Apre sa, mwen ka rale sa a tab soti se konsa yo pa konfonn. Sa a se jis yon tab sÃ¨l kounye a, ak tout bon nou wÃ¨ "hello, mond" moute isit la ak "hello, mond" desann isit la. Se konsa, trÃ¨ dwat. Men, li la tou san patipri ki senp. Epi, aktyÃ¨lman, mwen agrandi nan. Mwen ka chanje gwosÃ¨ a font jis magnify pou aksÃ¨. Men, kite a kounye a fÃ¨ yon bagay yon ti kras plis enteresan. 

Mwen pral go-- whoops, se pou m 'jwenn tounen nan dosye tÃ¨ks m' yo. Mwen pral tounen nan m ' dosye tÃ¨ks, ak mwen pral chanje sa a epi di "Hello, Disney World." Save. Apre sa, tounen nan m ' navigatÃ¨, epi klike Reload. Koulye a, nan kou, li di "Disney World." Apre sa, mwen mwen pral atifisyÃ¨lman rale nan jis pou li pi fasil wÃ¨. Se konsa, kounye, malerezman, mwen kalite vle to-- aktyÃ¨lman, sa a, se yon karakteristik Mac. Mwen vle klike sou Disney World ak ale yon kote tankou disney.com, men sa pa travay. Se konsa, yon prensip debaz yo nan entÃ¨nÃ¨t la se Des, lyen ki ale yon lÃ²t kote. Se konsa, kouman mwen fÃ¨ sa? Oke, mwen te kapab jis di, "Hello, http://www.disney.com." Save sa a. Recharger. Men, sa a tou, pa klikabl. Ak sa ki nan bÃ¨l isit la, menm si sa a se pa fonksyonÃ¨l ankÃ², se ke li sanble ke nan navigatÃ¨ literalman sÃ¨lman fÃ¨ ki sa mwen di l 'bay fÃ¨. Se konsa, si mwen jis tape yon URL tankou sa a, li nan jis ale nan montre m URL la. Mwen bezwen sÃ¨vi ak Tags oswa markeup lang yo aktyÃ¨lman di navigatÃ¨ a fÃ¨ menm plis. Se konsa, mwen pral ale pi devan ak efase sa a pou yon moman. Apre sa, mwen pral di, hey, navigatÃ¨, kÃ²manse yon jete lank isit la, yon lyen se konsa pale. Apre sa, ultra-referans a, destinasyon an nan ki jete lank, yo ta dwe URL sa a. Apre sa, remake quotes mwen. Mwen te kapab sÃ¨vi ak quotes sÃ¨l, tou, men ou gen yo dwe konsistan, e mwen ta jeneralman jis itilize quotes doub kenbe li senp. Avi mwen pral fÃ¨men tag la. LÃ¨ sa a, isit la mwen pral yo di, "Disney World." Epi kounyeya, m bezwen kÃ¨k symmetry-- louvri bracket, / a, fÃ¨men bracket. 

Se konsa, sa m 'prezante? Nou te gen yon Tags kÃ¨k deja. HTML, TÃ¨t, Tit, kÃ², yo tout Tags, se konsa pale, ak tokay ouvÃ¨ ak fÃ¨men. Men, avi, sa a se sÃ²t nan fondamantalman diferan. Sa a se sa nou pral rele nan HTML yon atribi. Apre sa, yon atribi se jis yon pÃ¨ kle-valÃ¨. Sa a se yon bagay ki komen nan kle-valÃ¨ Ã²dinatÃ¨ science-- pÃ¨. Li nan sÃ²t de zouti nan nan komÃ¨s la. Yon kle ak yon valÃ¨. Yon ti mo ak LÃ¨ sa a kÃ¨k lÃ²t mo oubyen yon mo yo. Ak nan ka sa a, kle a se href, ak valÃ¨ a se ke URL plen. Ak sa ki yon atribi fÃ¨ se li enfliyanse konpÃ²tman an nan yon tag. Ak nan ka sa a, nou bezwen gen enfliyans sou konpÃ²tman an nan tag nan jete lank, paske nou bezwen jete lank sa a ap mennen nan yon kote. Ak ki jan ou fÃ¨ sa se pa fason pou atribi a. 

Se konsa, mwen pral ale pi devan epi sove dosye a kounye a. Tounen nan navigatÃ¨ m 'ak Reload. Epi, vwala, nou genyen kounye a nan kÃ²manse nan yon paj entÃ¨nÃ¨t lejitim. Super-senp, men si mwen hover sou avi sa a men nan kwen an anba-gÃ²ch, li nan super-piti. Men, ou fÃ¨ wÃ¨ www.disney.com. Men, si mwen klike sou li, tout bon sa a fwe m 'tounen al jwenn disney.com. Koulye a, bagay la kirye isit la se ke li se pa best-- nan URL ki pi marchands, men sa a, se amann paske sa a ranpli pa fÃ¨ sa egziste sou World Wide Web la. Li egziste kÃ²m yon dosye lokal yo nan aparamman ItilizatÃ¨ yo mwen anyÃ¨ / jharvard-- pou Jan Harvard / Desktop. Men, li gen yon URL. Li jis k ap pase yo lokal yo. Malerezman, pa youn nan ou ka ale nan sa a, paske si ou tape URL sa a, ou ta dwe di navigatÃ¨ ou a, gade pou yon hello.html dosye rele sou kondwi difisil ou. Epi, nan kou, sof si ou te te swiv ansanm manyÃ¨lman, li pa k ap pase yo egziste a. 

Se poutÃ¨t sa se amann. Nou toujou bezwen yon fason, finalman, yo ka resevwa sa a ranpli nan entÃ¨nÃ¨t la, men kite a toumante apa yon koup la enplikasyon sekirite nan sa ki nou jis wÃ¨ epi mare l 'tounen nan pi bonÃ¨ a diskisyon sa a soti nan maten. Li sanble ke, si yon navigatÃ¨ literalman jis fÃ¨ ki sa mwen di l 'bay fÃ¨, epi li sanble yo dwe ka a ke yon tag jete lank se enfliyanse pa valÃ¨ a nan sa a atribi rele href men li montre sa a tÃ¨ks, sa a ta sanble yo vle di ke mwen te ka mete URL la nan tou de kote ak LÃ¨ sa a Reload e kounye a, wÃ¨ URL la epi ale nan URL la. Avi, si mwen hover sou anba-bÃ² gÃ²ch la, Mwen tout bon ale toujou yo disney.com. 

Se konsa, si ou te janm te phished-- P-H-I-S-H-E-D-- ak youn nan moun ki ImÃ¨l fos soti nan tankou PayPal bank ou, ou te pwobableman vinn lyen andedan nan imel la ke ou ap li ki di ou klike isit la yo ale konfime modpas ou oswa pou konfime DAT NESANS ou oubyen sosyal oswa yon bagay sosyalman jeni ou ka ta pataje enfÃ²masyon. Oke, mwen te kapab kalite pran avantaj nan sa a, pa t 'kapab ye? Mwen te kapab di yon bagay tankou, www.paypal.com. Ak olye pou yo disney.com, mwen te ka ale nan, tankou, badguy.com. Recharger. Ak ki jan fasil se li nan trompe, espesyalman yon lektÃ¨ ki pa teknik oswa yon cursorily lekti lektÃ¨ pase klike yon ap mennen tankou sa a, ki si mwen klike sou l-- Mwen aktyÃ¨lman pa ta vle ale badguy.com. Mwen pa konnen sa la aktyÃ¨lman la. Se konsa, paypal.com, avi, se sa li di li pral yo, men nan kou, si mwen gade desann super-ba, li nan yon ti kras twoub, men li di badguy.com. Sa a se sÃ¨lman di a kounye a ke mwen pral nan plas la sa ki mal. LÃ¨ m 'te di byen bonÃ¨ ke bank vrÃ¨man pa ta dwe ankouraje oswa tren itilizatÃ¨ nan klike lyen, sa a se jis yon manifestasyon nan li. LÃ¨ li nan sa ki senp. Ou se kounye a yon lÃ¨nmi si ou fÃ¨ yon bagay tankou sa a epi eseye fÃ¨ je chÃ¨ch ak yon itilizatÃ¨ nan vizite sit entÃ¨nÃ¨t ou. Men, pou kounye a, nou pral kenbe bagay sa yo bÃ¨l e pwÃ²p. Nou ap pral ale pi devan ak remonte chanjman sa yo. Reload paj la. Apre sa, mwen tounen nan disney.com. 

Ann wÃ¨ si nou pa ka toumante sa a apa yon ti kras plis. Se konsa, "hello, Disney World." Mwen pral di desann isit la. PetÃ¨t mwen pral fÃ¨ kÃ¨k chanm. "Nou espere ou jwi rete ou!" Save. Recharger. Li pa nan rea-- sa a pa ki sa mwen gen entansyon, dwa? Mwen vle di, si mwen trete tÃ¨ks mwen ranpli tankou yon processeur mo, kisa nou te espere ta rive isit la? Yeah, Mwen santi mwen tankou gen ta dwe gen yon ti repo liy isit la, se konsa li santi l buggy nan kÃ¨k fason. Men, sa a aktyÃ¨lman ekspre, paske jis tankou anvan, navigatÃ¨ a se sÃ¨lman pral sa ou di l 'bay fÃ¨. Mwen pa t 'rakonte l' bay kraze liy yo. Mwen pa te rakonte l 'bay deplase desann, menm menm si, entwitif, mwen santi mwen tankou mwen te fÃ¨ sa. Se konsa, li vire soti nou bezwen yon ti kras plis markeup, ak mwen pral ranje sa a jan sa a. Mwen pral prefas sa a premye alo ak sa yo rele yon tag paragraf. LÃ¨ sa a, mwen pral ale pi devan epi vlope sa a fraz lÃ²t nan yon lÃ²t tag paragraf, menm si yo ap paragraf super-kout. Koulye a, mwen pral pou konsÃ¨ve pou. Recharger. Epi, koulye a nou gen ki espas, epi nou sÃ²t de gen Semantics yo nan de paragraf ki apa a. 

Sa a tout amann ak bon, men li ta dwe nice yo ajoute yon imaj nan paj sa a, se konsa mwen pral yo ale gade pou Mickey Mouse sou Google Images. Epi jis pou plezi, mwen se ale nan gen tan pwan imaj sa a. Mwen pral ale pi devan kounye a epi yo gen tan pwan URL la nan imaj sa a, menm si gen nan diferan fason yo fÃ¨ sa a. Pou kounye a, mwen jis ale a kapab bay kopi URL la. Mwen pral ale tounen nan tÃ¨ks mwen dosye, ak mwen pral di isit la, img src = quote unquote ki URL, super-long. LÃ¨ sa a, nosyon de yon imaj se yon ti kras diferan. Genyen vrÃ¨man pa gen okenn nosyon nan kÃ²manse yon imaj epi k ap fini yon imaj, tankou yon kÃ²manse tag yon tag fen. Se konsa, li santi l yon ti kras etranj nan m 'Semantics fÃ¨ sa, gen yon tag pre-imaj. Li pa kÃ²rÃ¨k. Li nan parfe kÃ²rÃ¨k, ak li a ankouraje, men gen nan steno notasyon. Mwen kapab kalite ansanm ouvÃ¨ epi fÃ¨men tag a menm, ak ki pral fÃ¨ navigatÃ¨ a kÃ¨ kontan. Se konsa, li jis yon ti kras plis somÃ¨r pou bagay sa yo ki concept reyÃ¨lman pa fÃ¨ sa fÃ¨ sans yo kÃ²manse ak yon fen. Yo jis ki genyen, oswa yo pa fÃ¨ sa. 

Se konsa, mwen pral pou konsÃ¨ve pou sa a epi ale tounen mwen an "hello, mond" paj ak Reload. LÃ¨ li nan yon ti kras soti nan kontwÃ²l, paske ke imaj se aktyÃ¨lman yon ti kras gwo, men sa a OK. Mwen te kapab rdimansyonman l 'nan yon pwogram. Ou, ou konnen ki sa. Jis yo demontre, mwen ale nan aktyÃ¨lman di ki lajÃ¨ a nan bagay sa a ta dwe fÃ¨t sÃ¨lman 200 piksÃ¨l, 200 pwen. Kite m 'ale pi devan epi sove ak Reload, epi kounye a paj la sanble yon ti kras plis ki rezonab. Men, remake modÃ¨l la. Bon, mwen te kalite moutre nou tout nan HTML nan kÃ¨k sans, omwen concept, paske tout HTML se se sa yo tags-- Tags louvri, fÃ¨men Tags, ak atribi figi ki modifye konpÃ²tman yo. Epi, aparamman, chak tag ka gen zewo oswa yon sÃ¨l oswa de oswa plis atribi, yo chak nan ki fÃ¨ yon bagay yon ti kras diferan. Koulye a, ki jan ou konnen sa ki egziste? Ou jis koute yon moun tankou m 'di ou sa ki egziste, oswa ou jis Google alantou pou yon leson patikilye sou HTML, ak li vrÃ¨man se senp sa a. 

Se vre wi, lÃ¨ m 'te yon undergrad ane de sa epi aprann HTML, youn nan ansÃ¨yman matematik mwen asistan jis te pase yon ti kras nan tan leson patikilye m ' pou tankou demi Ã¨dtan yon, yon Ã¨dtan, ak LÃ¨ sa a mwen te sou wout mwen. Mwen te sou wout mwen nan direksyon fÃ¨ sou sit entÃ¨nÃ¨t yo pi efreyan tout tan, ki, aparamman, mwen pa gen reyÃ¨lman ap pwogrese pi lwen toujou. Men, pwen an se ke, yon fwa ou konprann sa yo ideas-- senp si Esoteric text-- men sa yo ki senp lide nan kÃ²manse yon panse ak fÃ¨mti yon panse, kenbe tout bagay joliman balanse, kap yon bagay moute, modifye nan konpÃ²tman nan ki tag, sa ki nan vrÃ¨man tout gen nan li. Ak an reyalite, si nou kounye a ale nan yon bagay tankou google.com-- aktyÃ¨lman, se pou yo ale yon kote yon ti kras plis reasonable-- stanford.edu. Men, mwen pral pou yo ale nan View, Developer, View Sous. Li nan lÃ¨d, men notice-- epi mwen pral rale nan avi kÃ¨k bagay sa a, se abitye deja. Genyen sa a moute isit la, ki se yon navigatÃ¨. La ap vini HTML5. Genyen HTML. Aparamman, gen nan yon atribi ki mwen pa t ' sÃ¨vi ak sa espesifye nan lang nan paj la, ak sa a ka ede ak otomatik tradiksyon ak bagay tankou sa. Isit la nan tÃ¨t la nan paj la. Isit la nan tit la nan paj Stanford la. Genyen yon tag mwen pa t ' pale sou tag Meta yet--. Se jis sÃ²t de enfÃ²masyon jan nou koumanse. Li ede ak SEO, oswa optimize rechÃ¨ch-motÃ¨, oswa Google-search rezilta oswa renmen an. Men, si nou kenbe kap, kenbe kap, isit la nan tag nan kÃ². Apre sa, nan grap nan lÃ²t Tags nou pa te pale sou ankÃ². Men, Div se youn pou yon divizyon nan paj la. Se tankou yon rektang envizib si ou kalite vle mantalman divize paj ou a nan inite diferan sou entÃ¨nÃ¨t. LÃ¨ sa a, anpil nan div mwen wÃ¨, yon bagay yo rele Gwoup, men nou pwal tounen vin jwenn sa. 

Sa a se FÃ²m interesting--. FÃ²m yo tout lÃ²t peyi sou entÃ¨nÃ¨t la. NenpÃ²t bwat rechÃ¨ch w ap janm itilize se yon fÃ²m. Epi, se konsa, kite a aktyÃ¨lman wÃ¨. FÃ²m. Aksyon. Aksyon an nan fÃ²m sa a, pou kÃ¨lkeswa rezon istorik, se ke URL. MetÃ²d se "post." Vire soti ke demann HTTP ka itilize vÃ¨b la "jwenn," tankou nou te wÃ¨ anvan, oswa "post." Epi yo pral wÃ¨ yon diferans bagay sa yo nan yon moman. Se pou nou aktyÃ¨lman wÃ¨ sa ki sa a se. Kite m 'ale tounen nan paj Stanford la. Ki sa ki fÃ²m nou jwenn pale sou, ou panse? Ki sa ki sote soti nan ou? 

ODYANS: Search bwat. 

DAVID J. Malan: Yeah. Se konsa, moute bÃ² dwat nan tÃ¨t isit la se ti bwat Search sa a. Epi sa a, ki jan yo aplike l-- yon tag sa a, se literalman fÃ²m louvri-bracket. LÃ¨ sa a, se pou yo rechÃ¨ch pou yon bagay. Se pou nou rechÃ¨ch pou yon zanmi nan mine-- "Nick Parlante." Antre nan. Ak nan kou, li te ale nan yon URL ti kras diferan. Kite m 'ale tounen isit la. Se pou nou rechÃ¨ch pou "kou yo." Modi li. Te ale nan yon URL diferan. Se konsa, Stanford nan pandan l ajoute kÃ¨k majik yo ke yo pa ap pran m 'nan URL la ki nou te wÃ¨ nan nan aksyon atribi a. Men, se fÃ²m sa a isit la aplike piman pa fason pou sa a markeup isit la, sa yo Tags. An reyalite, isit la nan D 'a pou kalite a nan rechÃ¨ch ke ou vle. Isit la se D 'a pou yon lÃ²t kalite rechÃ¨ch. Isit la se D 'a pou fisÃ¨l la tÃ¨t li. Se konsa, objektif la se pa yo vlope lespri nou alantou tout nan sa yo Tags men jis yo wÃ¨. Li nan jis louvri ak fÃ¨mti Tags ak kap bagay yo. Yeah? Victoria? 

ODYANS: [fÃ¨bl] DAVID J. Malan: Sa se yon bon kesyon. Sa se yon ti kras Delice yo wÃ¨. Kite m 'tounen vin jwenn ki kesyon nan jis yon kÃ¨k minit lÃ¨ nou gade yon bagay yo rele fÃ¨y papye CSS, oswa style kaskad, epi nou ka eseye dÃ©gager kÃ²m anpil soti nan paj la. Se konsa, si nou kounye a pran yon gade nan google.com, kite a wÃ¨ sa paj yo sanble. Ou ta they're-- sa a, se bÃ¨l jodi an. OK. Tout fÃ¨. Tout dwa, se konsa View Sous. Ou ta panse Google gen reyÃ¨lman bon kÃ²d sous. Se konsa, aparamman, sa k ap pase isit la? Ak an reyalite, sa a se pa menm HTML. Sa a se yon bagay yo rele JavaScript. Li kite yo kenbe prale ak prale. Mwen pa menm konnen ki kote paj la kÃ²manse. Mwen pral sÃ¨vi ak KÃ²mandman F, louvri bracket HTML. Tout dwa, gen li ye. Mwen te jwenn nan kÃ²mansman an nan paj la, ak gen tÃ¨lman bagay bagay nan isit la. 

Ki sa ki aktyÃ¨lman ale sou? Oke, ou konnen ki sa, nou ka netwaye sa a leve. Si m 'olye pou ale nan sa a Enspekte toolbar, zouti dyagnostik sa a espesyal, epi ale pa rezo a, kote nou kenbe pral jodi a, men si m 'ale nan Eleman, sa ki nan reyÃ¨lman bon se ke yon navigatÃ¨ gen yon anpil pi bon je pase m 'fÃ¨. Apre sa, navigatÃ¨ a ka li ki dezÃ²d nan yon paj entÃ¨nÃ¨t, ki HTML mail nou jis gade, epi li kapab analizan li oswa li ak analize li epi li FomatÃ¨ li nan yon fason bÃ¨l imen-zanmitay. Se konsa, sa m ap wÃ¨ kounye a nan sa a ekran isit la anba Eleman, egzak kontni an menm, men yo te utilize tout bagay, yo te colorized li, men li nan egzak tÃ¨ks la menm ke mwen telechaje soti nan sÃ¨vÃ¨ a. 

Ak sa ki nan bÃ¨l kounye a se mwen ka wÃ¨ nan kÃ² a, pou avi instance--, paj la se toujou konpoze nan jis yon tÃ¨t ak yon kÃ², e mwen ka yerarchik plonje nan isit la. Remake Google sanble gen divs-- yon sÃ¨l sa a ak yon sÃ¨l sa a. Mwen kapab elaji sa. Genyen yon pakÃ¨t antye nan lÃ²t div. Se konsa, li nan yon ti kras konplÃ¨ks. Men, tann. Sa a sanble pou pi plis lizib, relativman, pase sa a. Poukisa se Google anbarasan tÃ¨t li pa jis voye dezÃ²d sa a gwo nan kÃ²d nan kÃ¨k sÃ²t jis aplike yon bagay ki sanble se konsa senp nan premye gade? Tankou, poukisa yo pa yo ajoute plis espas? Poukisa nou pa yo te frape Antre tankou mwen te fÃ¨? Gade ki jan bon mwen te nan ekri yon paj entÃ¨nÃ¨t. Mwen frape Antre se konsa konnen tout bagay. Mwen dantle se konsa tout bagay se konsa bÃ¨l ak lizib. Poukisa Google pa pratike menm bagay la tou? 

ODYANS: [fÃ¨bl] DAVID J. Malan: Bon. TrÃ¨ san patipri. Yo pa gen kÃ¨k moun nan Google manyÃ¨lman Ã  paj an kay ankÃ². Li pa 1999 ankÃ². Se konsa, yo gen lojisyÃ¨l. Yo gen lÃ²t zouti ki jenere dynamique yo ap HTML. NatirÃ¨lman, ki KÃ²d tÃ¨t li te ekri pa moun, men reyalite a se, li nan byen jis yo di, navigatÃ¨ a sÃ¨tÃ¨nman pa fÃ¨ sa pran swen ki jan sal kÃ²d la se. Men, gen nan yon menm plis irezistib rezon teknik ki Google distribye HTML yo KÃ²d nan yon sloppy, w pÃ¨di akablan fason tout chaje ansanm ak anpil ti way-- anpil ti nan chemen an nan fÃ²ma tankou mwen te fÃ¨ sa. 

ODYANS: [fÃ¨bl] 

DAVID J. Malan: Pi vit? Poukisa? Ak sa ki ou te di m Lydia? Pi vit? Poukisa pi vit? ODYANS: [fÃ¨bl] DAVID J. Malan: Genyen okenn espas li. Yeah. Se konsa, panse sou sa ki yon espas se. Se konsa, chak karaktÃ¨ sou klavye a pran kÃ¨k kantite lajan pou espas yo reprezante, swa fizikman, tankou li pran moute ki anpil espas, oswa yon jan kanmenm anba a kapo, ki egzije pou memwa. Apre sa, kÃ²m yon aside-- epi nou pral pale plis sou sa tomorrow-- chak karaktÃ¨ sou klavye a tipikman mande pou 8 Bits, oswa yon sÃ¨l multiple. Se konsa, yon modÃ¨l nan 8 zewo oswa yo menm, oswa jis 1 multiple, menm jan nou moun ta tipikman di. Se poutÃ¨t sa se piti, men li la toujou ki pa zewo. Li nan toujou kÃ¨k kantite lajan pou espas. Se konsa, si yon enjenyÃ¨ oswa Google frape ba a espas jis yon fwa, ak ta kwÃ¨ Google-- li nan super-popular-- ta kwÃ¨ ke yon milya moun vizite paj lakay yo nan yon jounen, oswa kÃ¨k kantite moun ki vizite paj lakay yon nan milya fwa nan yon jounen, konbyen bytes plis gen ki lojisyÃ¨l enjenyÃ¨ jis koute Google pa frape li oswa espas li ba yon fwa? 

ODYANS: [fÃ¨bl] DAVID J. Malan: Pa byen sa ki move. Jis youn multiple fwa nan yon milya dola. Se konsa, a-- ODYANS: 8 milya dola jigokte. DAVID J. Malan: Se pa 8 milya dola. 8 milya dola bytes. Men, 1 jigokte. 1 jigokte ta dwe inite a nan mezi. Si li oswa li te fÃ¨ de espas, 2 jigokte. Twa jigokte. Dwa? Li balans chÃ¨r. Se konsa, nan ka tankou Google, ki, yo akÃ²de, yo ka ekstrÃ¨m yo, gen lÃ²t pwoblÃ¨m ki rive jis pa pran desizyon trÃ¨ rezonab oswa pran trÃ¨ senp aksyon imen, paske li gen efÃ¨ sa a agrandisman. Se konsa, youn nan rezon ki sa a sanble se konsa konprese se egzakteman jan Victoria said-- li te jis ki te pwodwi pa Ã²dinatÃ¨ de tout fason. Se konsa, pa gen okenn kontra gwo. Se pou navigatÃ¨ a figi li soti. Men, li tou fÃ¨ espre pa gen anpil espas, paske espas ki la pa nesesÃ¨. Apre sa, espas ki la aktyÃ¨lman koute lajan. 

Li swa koute tan, paske jis pouse ke anpil plis done soti nan katye jeneral google.com yo jis te gen yo pran kÃ¨k kantite lajan pou tan, menm si li nan milisgond oswa mikro, men ki ajoute moute sou anpil itilizatÃ¨ yo, oswa plis chans, li pwobableman koute lajan. Google pwobableman konekte nan yon lÃ²t moun nan mond, yon sÃ¨l la nan tout sa yo pirin pwen, epi si yo gen kÃ¨k kalite relasyon finansye kijan done yo koute lajan, yo ta ka kÃ²m byen misyon pou minimize done konbyen lajan yo ap voye krache deyÃ² sou koneksyon entÃ¨nÃ¨t yo. 

Se konsa, bagay la komik, menm si, finalman, oswa petÃ¨t bagay la rasire, se ke menm si sa a sanble fÃ² anpil boulvÃ¨san, nan fen jounen an, li la toujou egzak prensip yo menm jan ak paj sa a trÃ¨ senp isit la nan yon HTML paj. Se konsa, jis fÃ¨ rezime ak pou ke ou gen yon vÃ¨syon kanonyal si ou pa t ' swiv ansanm pa chwa isit la, isit la ta ka ki pi senp lan nan paj wÃ¨b, se konsa yon bagay yo jwe avÃ¨k petÃ¨t pita. 

Oke, kite la prezante yon koup nan lÃ²t lide kounye a. Nou ap sou yo prezante yon bagay yo rele yon tag style. Nou ka stilize paj sa a nan fason plis enteresan. Se konsa, LÃ¨ nou konsidere ke HTML imel se tout sou regilye nÃ¨f semenn klas moute done yo, sÃ²t de ki espesifye nan yon navigatÃ¨ ki jan yo estrikti done yo, ki kote yo mete l ', CSS, oswa dra style kaskad, se yon dezyÃ¨m lang ki jeneralman vin melanje avÃ¨k HTML menm jan nou pral see-- men nou ka netwaye ki moute nan yon moment-- ki pran li mil final la, epi li stylizes li. Li vin koulÃ¨ yo jis dwa, font la gwosÃ¨ jis dwa, pwezante nan jis dwat. Se sou tout estetik yo oswa fÃ²ma, pa sou done yo fondamantal tÃ¨t li. Apre sa, fason ki pi fasil yo montre sa a se petÃ¨t pa egzanp. Se konsa, mwen pral ale sou nan dosye senp tÃ¨ks m 'yo. Ak nan jis yon ti moman, mwen pral mache nou atravÃ¨ tout pwosesis la pou fÃ¨ sa tÃ¨t nou. 

Mwen pral pou tounen nan dosye mwen isit la ak Reload paj la jis nan konfime sa li sanble. Sa a kote nou ap nan kounye a. Mwen santi mwen tankou timoun ta renmen gen kÃ¨k koulÃ¨ nan paj entÃ¨nÃ¨t sa a. Se konsa, mwen pral ale moute isit la nan tÃ¨t la nan paj la. Apre sa, mwen pral fÃ¨ style, / style. LÃ¨ sa a, andedan nan sa a, mwen pral di kÃ² a nan page-- mwen ak fÃ²ma sa a se, nan premye gade, petÃ¨t yon ti kras etranj men konvansyonÃ¨l yo. Mwen pral di ke background nan koulÃ¨ nan paj sa a yo ta dwe vÃ¨t. LÃ¨ sa a se malerezman sÃ²t de pa desen an pi byen. Remake deja nan mond lan nan HTML, Mwen te di ke atribi timoun sa yo pÃ¨ kle-valÃ¨. Yon bagay egal quote unquote "yon bagay." Nan mond lan nan CSS, ki te ki fÃ¨t nan gen kÃ¨k moun ki diferan, yo te deside ke, nan yo mond, kle-valÃ¨ pÃ¨ ta dwe mo yon bagay kolon. Se konsa, li lide a menm, menm si. Li nan asosye se yon valÃ¨ ak kÃ¨k kle ki yon jan kanmenm enfliyanse konpÃ²tman an nan paj sa a. 

Epi ou ka pwobableman devine. Ki sa ki se sa a pwobableman pral fÃ¨ menm si ou te pa janm wÃ¨ HTML oswa CSS ye anvan an? ODYANS: Chanje koulÃ¨ nan background. DAVID J. Malan: Yeah, chanje koulÃ¨ a ââjan nou koumanse. Ak espesifikman an koulÃ¨ background nan kÃ² a. Men, tÃ¨l degre ke la kÃ² pou kounye a se entÃ¨nÃ¨t la page-- li nan bagay la sÃ¨lman anba a really-- nan tit ba li la pwobableman ale nan enfliyanse menm bagay la. Se konsa, kite a wÃ¨. Se pou yo sove sa a. Ale isit la ak Reload. Li trÃ¨ efreyan. Ak sa ki k ap pase sou isit la se yon efÃ¨ segondÃ¨. Mwen jis te chwazi imaj sa a owaza. Poukisa se pa vÃ¨t la enprÃ¨y dÃ¨yÃ¨ Mickey? ODYANS: [fÃ¨bl] DAVID J. Malan: Egzakteman. Li sanble ke imaj, bÃ¨l anpil tout imaj ki nou ta ka sÃ¨vi ak, yo tout rectangles-- nan rektang. Menm si Mickey gen kÃ¨k koub nan kÃ¨ l 'e li gen yon jan nou koumanse, ki jan nou koumanse gen yo dwe yon bagay. Li te gen yo dwe blan. Li te gen yo dwe nwa oswa yon lÃ²t bagay. Li kapab transparan. Ak an reyalite, mwen te kapab louvri Mickey Mouse isit la nan yon pwogram yo rele fotoschop oswa yon bagay ki sanble ak chanje nan tout sa blan background transparan, se konsa vÃ¨t la ta klere nan. Men, sa a yon bagay mwen ta bezwen mande nan tÃ¨t mwen oswa yon atis grafik oswa yon designer nan mwen konpayi, pou egzanp, fÃ¨, espesyalman depi mwen jis prete yon sÃ¨l sa a nan entÃ¨nÃ¨t la. Men, sa a poukisa sa a k ap pase. 

Se konsa, sa lÃ²t bagay nou ta ka vle fÃ¨? Bon, nou ta ka vle di nou vrÃ¨man espere ou jwi rete ou. Se pou anfaz, mwen vle fÃ¨ sa-a fÃ², Se poutÃ¨t sa mwen pral di louvri ki gen fÃ²s ak fÃ¨men ki gen fÃ²s ak LÃ¨ sa a, recharger. LÃ¨ li nan yon ti kras difisil wÃ¨ sou pwojektÃ¨ a men petÃ¨t reyÃ¨lman kounye a sote soti nan ou yon ti jan plis. Se konsa, ou kapab ajoute italik nan sa a fason sa a, fonse fÃ¨ fas a nan fason sa. Nou te ka chanje koulÃ¨ yo. An reyalite, jis pou anvwaye, mwen se ale nan ale pi devan epi fÃ¨ sa. Mwen pa vrÃ¨man renmen ki jan mwen paragraf yo sa a fÃ¨men ansanm, Se konsa, mwen ta ka fÃ¨ yon bagay konsa. Mwen pral di navigatÃ¨ a, chanje chak tag paragraf gen, se pou yo say-- aktyÃ¨lman, ou konnen ki sa, se pou yo aliman li tÃ¨ks-aliman, sant. Epi ankÃ², m konnen sa a sÃ¨lman paske yon moun anseye l 'ban mwen oswa Mwen gade l 'kanpe nan yon referans sou entÃ¨nÃ¨t. Se pou m 'sove sa a. Epi, ah, koulye a, mwen te santre imaj la a. Apre sa, aktyÃ¨lman, ou konnen ki sa, si Mwen demenaje imaj mwen nan yon paragraf tag se konsa yon paragraf twazyÃ¨m, menm si li pa nan tÃ¨ks. Se pou nou delivre sa ak Reload. Koulye a, paj la se kÃ²manse gade kalite de- Mwen vle di, li nan toujou trÃ¨ lÃ¨d, men omwen li sanble mwen te pase de minit olye pou yo yon minit fÃ¨ li. 

Se konsa, incrÃ©mentielle, ka nou fÃ¨ chanjman sa yo ayestetik kounye a nan paj la? Mwen pa te reyÃ¨lman chanje done ki nan nan paj lÃ²t pase ajoute pawÃ²l Bondye a vrÃ¨man. Mwen te ajoute Metadata, si ou pral. Hey, navigatÃ¨, fÃ¨ nan mo "vrÃ¨man" karaktÃ¨ fonse. Men, done a se pa fÃ². Sa a Metadata. done a se "vrÃ¨man." Se konsa, nou toujou gen kÃ¨k nan konsÃ¨p yo menm jan ak anvan. Koulye a, nan kou, sa a se pa sou entÃ¨nÃ¨t la, se konsa mwen pral fÃ¨ yon final etap isit la. 

Mwen pral pou yo ale nan hello.html ak jis mete aksan sou ak fÃ¨ kopi sa a. Epi, koulye a mwen pral ale nan Cloud9, ki Mwen pral mache ou atravÃ¨ nan jis yon moman. Apre sa, chans yo se ou pral byento dwe, si pa gen deja, nan yon ekran tankou sa a. Ak kite m 'jis ba ou yon rapid toune nan sa Cloud9 aktyÃ¨lman se. Se konsa, ankÃ² nwaj 9 se sÃ¨vis sa a nwaj ki baze sou ki bay m 'avÃ¨ ou ilizyon an ki gen pwÃ²p nou machin vityÃ¨l nan syÃ¨l la, teknikman yon veso ki nan syÃ¨l la, ke nou gen plen privilÃ¨j administratif nan. Se konsa, nan teyori, pa gen yon lÃ²t moun nan mond lan gen aksÃ¨ a ekran an mwen se gade nan kounye a, eksepte petÃ¨t pÃ¨p la ki te kouri sit la, paske teknikman yo gen aksÃ¨ fizik ak pou fÃ¨. 

Se konsa, sa nou wÃ¨ nan anviwonman sa a? Mwen pral rale soti, paske li nan yon ti kras ki piti yo. Ak kite m 'pwen sou isit la sÃ¨lman pou moman yon. Ki sou bÃ² gÃ²ch-men nan m 'ak ou ekran, gen nan yon navigatÃ¨ dosye sou bÃ² gÃ²ch. Se konsa, menm jan an nan lespri nan Mac OS ak fenÃ¨t yo. Sa yo se tout nan a dosye nan kont mwen. Apre sa, pa default, si ou kont se tankou m ', ou pral wÃ¨ oswa byento wÃ¨ helloworld.html ak readme.md. Plis pase isit la sou bÃ² dwat la, sa a se kote dosye tÃ¨ks mwen yo ale nan ale. Si ou te janm itilize Microsoft PawÃ²l oswa notepad oswa TextEdit, sa a se mo koreksyon mwen nan dosye ki pral ale. LÃ¨ sa a, pi Esoteric nan karakteristik nan anviwonman sa a ke nou pa pral reyÃ¨lman bezwen sÃ¨vi ak se desann isit la rele yon FenÃ¨t TÃ¨minal. Si ou te itilize DOS soti nan pase, sa a se Linux a oswa ekivalan a Linux nan DOS. Li se yon interface-- tÃ¨ks ki baze sou pa gen okenn klik sourit, pa gen trenen. Tout sa ou ka fÃ¨ se tape kÃ²mandman, men moun kÃ²mandman ka kreye dosye, deplase dosye, louvri repÃ¨rtwar, repÃ¨rtwar fÃ¨men, fÃ¨ nenpÃ²t ki kantite bagay sa yo. Men, pou kounye a, nou pral jis pase tan nou an moute isit la. 

Se konsa, kite a fÃ¨ sa. Si w ap nan sa a anviwÃ²nman, ki ou ta dwe ye si ou te kreye yon vorkspas deja, ale pi devan epi jis ale moute nan File, New pou yon moman. Apre sa, ki pral ba ou yon nouvo tab dwa isit la nan mitan yo. Apre sa, mwen just-- e kite yo ale pi devan epi fÃ¨ sa. Se pou nou ale pi devan e kounye a, File, Save ak ale pi devan epi rele li hello.html, pa t 'dwe konfonn ak helloworld.html, ki vin rive ak nouvo kont lib ou, ki se jis yon dosye echantiyon. Ou gen pou wÃ¨ li toudenkou parÃ¨t, gen plis chans ki sou bÃ² gÃ²ch-men, ak tab la ap toujou gen louvri. Ak kite m 'ankouraje w kounye a rkree sa a ranpli oswa kÃ¨k varyant ladan l '. Men, si ou pa ka byen wÃ¨ l 'sou nan ekran, sa a se ki idantik ak glisad yo ke ou pwobableman gen nan yon lÃ²t tab. 

Se konsa, nan ti bout tan, fÃ¨ paj premye entÃ¨nÃ¨t ou an, sove li, ak LÃ¨ sa nan jis yon moman, Mwen pral montre w kouman ou ka aktyÃ¨lman wÃ¨ sa a. Men, chanje omwen yon sÃ¨l bagay. Chanje HelloWorld yon bagay nan chwa pwÃ²p ou a, pou ke ou ap konvenki ke li nan ou ranpli epi yo pa yon sÃ¨l la mwen jis te kreye. Tout dwa. Men, lÃ¨ ou ap ready-- pa gen okenn rush-- lÃ¨ w ap pare, ale pi devan epi sove dosye a yon fwa ou te fÃ¨ chanjman sa yo. Men, si ou klike sou Kouri bouton moute tÃ¨t, sa a ta dwe louvri yon tab nouvo ki pral di ou sa URL ou ka ale nan dosye ou a, men li ta ka pran yon moman yo quote unquote "kÃ²manse Apache," ki se non an nan sÃ¨vÃ¨ wÃ¨b la. Se konsa, dwe fÃ¨ atansyon fÃ¨ egzakteman sa ki nan dosye a finalman. Se konsa, kounye a, mwen pral rale nan. Si mwen kÃ²manse sezisman louvri-bracket HTML, avi li nan pouse m 'fini te panse m' yo. Men, si mwen fini panse mwen, li otomatikman ki ban m 'tag a fÃ¨mti a. Men, tann nan se lÃ¨ sa a mwen pral frape Antre, ak lÃ¨ sa a deplase andedan gen ak tÃ¨t anndan ak LÃ¨ sa a, m 'fÃ¨ kÃ² anndan an. LÃ¨ li nan yon ti kras etranj an premye, paske li te fÃ¨ travay pou ou, men mwen reyalize ki finalman l ap fÃ¨ ekonomi ou frap. Ak an reyalite, yon karakteristik trÃ¨ komen nan pwogram environnements jou sa yo tou de pou devlopman entÃ¨nÃ¨t tankou sa a ak pwogramasyon aktyÃ¨l la, ki nou pral pale sou demen, se karakteristik sa yo oto-konplÃ¨, bagay sa yo ke jis pÃ¨mÃ¨t yon pwogramÃ¨ oswa yon designer tape mwens frap akonpli menm bagay la. Pafwa li nan bon, menm si. Pafwa li nan jis anmÃ¨dan. Epi, ankÃ², yon fwa ou te transkri glise nan oswa kÃ¨k Variant ladan l ', ou ka klike sou bouton an kouri moute tÃ¨t. LÃ¨ sa a, nan pati anba a fenÃ¨t, ou pral enfÃ²me nan sa ki URL ou ka ale nan paj entÃ¨nÃ¨t ou an. Mine, pou egzanp, se nan business-daharvard.c9users.io ak pou fÃ¨. Tout dwa, se konsa, se pou mele l nenpÃ²t kesyon? NenpÃ²t lÃ²t kesyon sou jis ap resevwa sa a ap travay anvan nou ajoute karakteristik? Ak kite m 'pwopoze, jis yo ka resevwa jan comfortable-- paske li nan yon sÃ¨l bagay yo jis kopi-kole je fÃ¨men sa m 'te fÃ¨. Men, jis pou ke jan lite ak omwen yon a-fÃ¨, Mwen pral vire sou kÃ¨k mizik. Mwen pral pwopoze yon lis bagay ou kapab potansyÃ¨lman ajoute. Epi ou ka sÃ¨tÃ¨nman sÃ¨vi ak Google. Epi poukisa pa fÃ¨ sa nou jis pwopoze ke ou eseye rezoud omwen yon pwoblÃ¨m patikilye isit la. Se konsa, nan tÃ¨m de Tags, kite m 'jam itilize sa a isit la. 

AktyÃ¨lman, kite m 'mete li nan yon fÃ²m textuelle. Se pou nou di ke nan mitan etikÃ¨t yo nou ta ka sÃ¨vi ak isit la gen kÃ¨k Tags sou isit la. Nou te wÃ¨ tag a paragraf. Koulye a, li k ap pase yo oto-konplÃ¨. tag paragraf, tag nan jete lank. Se pou nou di ou vle fÃ¨ yon bagay pi gwo, se konsa ou ta ka like-- tag a span ka ede w. Oke, ou ta ka bezwen kÃ¨k Ã¨d pou sa nan jis yon moman. Nou te wÃ¨ div. Ou pral wÃ¨ gen nan tab. Gen yon bagay yo rele tr, td. Th, td. Tounen vin jwenn ke nan yon moman. Ki lÃ²t bagay ta ka sou la men? Genyen fÃ². Genyen anfaz, ou pito em. Gen lan ki lÃ²t bagay ta ka ou imajine isit la? Bon, nou pral pran yon gade nan ki ansanm. FÃ²m, ki nou te wÃ¨. Genyen fÃ²m. Genyen opinyon ak yon lÃ²t moun kÃ¨k. Tout dwa, kidonk kite a fÃ¨ sa. Pou reponn yon nan Victoria kesyon, kite m 'premye jis asire w ke tout moun se kapab jwenn k ap travay alo yo. LÃ¨ sa a, kite m 'entwodui yon koup lÃ²t lide. LÃ¨ sa a, nou pral kite jan rezoud kÃ¨k pwoblÃ¨m sou kont yo. LÃ¨ sa a, nou pral aktyÃ¨lman tounen vin ak sa yo ki nosyon nan yon fÃ²m, epi n ap aktyÃ¨lman re-aplike ansanm koÃ²done nan devan-fen, se konsa pale, pou Google tÃ¨t li. Nou pral sÃ¨vi ak Google kÃ²m fen a retounen lakay yo epi kite yo fÃ¨ travay la difisil, chache a, men nou pwal rkree fen a devan nan Google ak fÃ²m nan rechÃ¨ch yo ke yo gen nan paj pwÃ²p lakay yo. Se konsa, nou pral tounen vin jwenn sa yo Tags nan jis yon moman. 

Se konsa, sa a te ki sa mwen pwopoze jis yon ti moman de sa. Nou kapab ajoute stilizasyon la nan yon paj andedan nan tag style sa a, epi nou ka stilize background nan koulÃ¨, aliyman an tÃ¨ks, si li nan sant oswa gÃ²ch la oswa dwa. Men, trÃ¨ byen vit ou ta jwenn oswa yon designer sit entÃ¨nÃ¨t ta jwenn ke sa a vin tounen yon ti kras maladwa, paske ou ap fÃ¨ sa ki nan rele melanje kontni ak prezantasyon ladan l '. W ap melanje done ou ak estetik yo ladan l '. Ak an reyalite, si ou konsidere sa k ap pase rive sou time-- sa a se yon piti anpil paj entÃ¨nÃ¨t, nan kou. Men, si mwen ajoute kontni nan paj sa a mwen menm m'ap mete style nan paj sa a, paj la trÃ¨ byen vit vin pi long ak pi long ak pi long lan. Apre sa, ta kwÃ¨ ke mwen vle gen yon paj entÃ¨nÃ¨t dezyÃ¨m ki pataje kÃ¨k nan atribi sa yo. Sipoze paj dezyÃ¨m entÃ¨nÃ¨t mwen an pou m ' site-- tou, mwen vle sant tout bagay, e mwen vle tou tout bagay ki gen yon background vÃ¨t. Mwen bÃ¨l anpil pral fÃ¨ yo kopye epi kole kÃ¨k nan liy sa yo nan ki dezyÃ¨m ranpli, ki santi l amann. Li pral rezoud pwoblÃ¨m nan. 

Men, sa ki si mwen vle yon paj twazyÃ¨m oswa yon paj 30 oswa yon paj 40th? Koulye a, mwen pral yo dwe kopye ak kole yon anpil nan kopi KÃ²d nan dosye miltip. Se konsa, ta kwÃ¨ ke Mwen deside oswa mwen te di, hey, nou pa ap itilize yon vÃ¨t jan nou koumanse ankÃ². Nou pral kÃ²manse lÃ¨ l sÃ¨vi avÃ¨k zoranj. Ki sa ou gen chanje? Oke, ou gen chanje ke style soti nan vÃ¨t yo zoranj nan ki jan anpil kote? FÃ¨ tankou 30 oswa 40 kote. Li nan fatigan. Li nan tandans fÃ¨ erÃ¨. Genyen yon kantite rezon kote ou pa ta vle pwovoke ki kalite doulÃ¨ pou tÃ¨t ou. Se konsa, pa ta li dwe nice si nou te ka pran sa mwen jis mete ant de jÃ²n sa yo Tags, sa yo Tags style, faktÃ¨ li soti,, li mete tout sa mwen stilizasyon nan yon sÃ¨l dosye santral ke tout 30 oswa 40 nan lÃ²t dosye mwen prete nan men oswa yon jan kanmenm referans, pa kontrÃ¨man ak rezo a dyagram nou te fÃ¨ anvan an? 

Se konsa, si m 'ale nan isit la, mwen se ale nan aktyÃ¨lman pwopoze ke nou ranplase la tag style ak yon bagay rele tag nan lyen, ki se oribleman, oribleman nonmen non li, paske ou pa sÃ¨vi ak nan tag ap mennen nan kreye sa nou moun konnen kÃ²m yon lyen an nan yon paj entÃ¨nÃ¨t. Pou sa, ou itilize ki tag? Ki jan ou fÃ¨ kreye yon lyen an nan yon paj entÃ¨nÃ¨t? ODYANS: yon an. DAVID J. Malan: yon la, oswa jete lank tag, ki te ale nan Disney anvan. Tag nan lyen isit la ap di lyen sa a men nan yon dosye rele styles.css, relasyon a ki a pwal ke li nan stylesheet mwen. Se konsa, sa a se youn nan la a S an CSS-- style kaskad dra. Style sheet-- de nan la a S an CSS. Kaskad fÃ¨y style. Sa a jis vle di, hey, navigatÃ¨, ale jwenn styles.css sou sÃ¨vÃ¨ lokal la epi sÃ¨vi ak li kÃ²m stylesheet ou, ki vle di andedan nan ki dosye a pwal tout nan a stylizations ke nou te jis fÃ¨. Se konsa, sa ki dosye ta ka sanble se sa a. Apre sa, mwen pral jis fÃ¨ sa se yon fason rapid egzanp, paske nou pa bezwen yo ka resevwa twÃ²p nan move zÃ¨b yo isit la. Men, si mwen kopi sa a, ki mwen se pwopoze se ke yon pwogramÃ¨ kreye yon dosye nouvo, keratin nan moun lines-- whoops-- keratin nan liy sa yo, sove li kÃ²m styles.css, ak LÃ¨ sa, nan dosye a lÃ²t, efase tout nan ki ak ranplase li olye pou ki genyen etikÃ¨t lyen sa a. Se konsa, ke si mwen lyen href = "styles.css", relasyon ki va "stylesheet" fÃ¨men tag. Sove li. Tounen nan HelloWorld mwen. Recharger. 

Literalman pa gen anyen ki te pase. Sa se yon bon bagay, paske li vle di li la aktyÃ¨lman tout ap travay. Pou pwouve kÃ²m anpil, ta kwÃ¨ mwen fÃ¨ yon Typo, epi mwen rele sa a "styles.css" ak yon kapital S, ki se kÃ²rÃ¨k, ak LÃ¨ sa a recharger. Koulye a, ou ka wÃ¨ li jis pa travay. Koulye a, poukisa? Oke, kite la sÃ¨vi ak yon teknik soti nan pi bonÃ¨. Kite m 'ale pi devan epi, nan navigatÃ¨ m ', nan Chrome, mwen se ale nan louvri moute ki espesyal rezo tab tankou anvan, ak kite m 'Reload paj la. Ki sa ki ou pa sezi wÃ¨ kounye a? Oswa petÃ¨t w ap sezi wÃ¨ li. NenpÃ²t fason, sa ou wÃ¨ kounye a? ODYANS: [fÃ¨bl] DAVID J. Malan: Li pa nan jwenn. Poukisa li pa jwenn? Oke, Styles.css-- kapital S-- pa egziste. Mwen misnamed li. Senp Typo. Men, mwen ap resevwa konprann kounye a yon 404, paske sÃ¨vÃ¨ a ap di, hey, li pa nan jwenn. Literalman, mwen pa konnen kote ke dosye se. Se konsa, kÃ²m yon rezilta, navigatÃ¨ a montre w ki sa li kapab, kontni an anvan tout koreksyon nan paj la, ki te yon 200, HTML a, men stilizasyon a pa kapab dwe ajoute apre sa. LÃ¨ sa a se sa k ap vle di pa kaskad. Ou ka sÃ²t de ajoute li apre, epi li sÃ²t de rafine estetik yo nan paj wÃ¨b la. Epi ou ka menm pase sou desizyon sa yo Styles ak dosye stylesheet ankÃ² lÃ²t Si ou vle. Li pa nan jwenn, menm si, nan ka sa a, paske nan kou, mwen misnamed li. Se konsa, mwen ta gen yo ranje ki premye. 

Se konsa nou ale pi devan epi pwopoze sa ki annapre yo. Se pou nou ale pi devan epi fÃ¨ sa. KÃ²manse avÃ¨k petÃ¨t ou dosye HelloWorld, kite m 'jis envite yon koup nan prezante sijesyon. Se konsa, Victoria, ou te vle fÃ¨ kÃ¨k tÃ¨ks pi gwo, dwa? Tout dwa, se konsa nou kapab fÃ¨ tÃ¨ks pi gran. Apre sa, nou chak pral rache koupe sÃ¨lman yon sÃ¨l pwoblÃ¨m yo rezoud. FÃ¨ tÃ¨ks pi gran. Mwen pa pwal bezwen deranje ekri sa a lÃ¨ nou gen teknoloji bal droit sou isit la. Se konsa, kÃ¨k pwoblÃ¨m. Se konsa, nou ap ale nan eseye fÃ¨ tÃ¨ks pi gran. Tout dwa. Ki lÃ²t bagay ta yon moun pwopoze? Ki lÃ²t bagay ta ka nou vle yo dwe fÃ¨ nan yon paj entÃ¨nÃ¨t? Se pou nou vini ak yon lis kout de bagay sa yo ak LÃ¨ sa a delege nan la gwoup figi sa a soti. 

ODYANS: [fÃ¨bl] 

DAVID J. Malan: OK, pozisyon tÃ¨ks sou kote diferan nan paj la? Tout dwa. Yon lÃ²t bagay. 

ODYANS: [fÃ¨bl] DAVID J. Malan: Li se. Se konsa, yon gif se jis yon diferan dosye fÃ²ma. Nou jis itilize, sa ki, yon png oswa yon jpg pwobableman? Nou itilize yon jpg. Si ou se kirye, yon twÃ²p reponn a kesyon ou se se yon jpg jeneralman itilize pou foto, paske li sipÃ²te dÃ¨ milyon de koulÃ¨ oswa koulÃ¨ 24-ti jan. Yon gif jeneralman itilize pou, tankou, memes entÃ¨nÃ¨t sa yo Animations days--, tankou jif anime. Men, bagay sa yo rive yo sÃ¨vi ak yon koulÃ¨ pi piti palÃ¨t, se sÃ¨lman 256 koulÃ¨ posib, men li sipÃ²te transparans ak animasyon. LÃ¨ sa a, gen nan png, ki sipÃ²te transparans ak plis koulÃ¨ men se pa animasyon. Se konsa, li yon komÃ¨s-off. Se konsa, pandan l ajoute yon gif, menm si, ta dwe fonksyonÃ¨l ekivalan a ajoute yon png oswa yon jpg. Yeah. sous Imaj egal. Se konsa, yon lÃ²t bagay. Se pou nou vini ak yon bagay ki nou te voye nan Victoria fÃ¨ isit la. 

ODYANS: Ajoute bouton pou yon fÃ²m. DAVID J. Malan: OK. Se konsa, ajoute bouton pou yon fÃ²m. Epitou, n ap fÃ¨ sa yon sÃ¨l ansanm. Se konsa, ki pral yon seg pafÃ¨ dwa apre defi sa a. NenpÃ²t bagay lÃ²t bagay? Ki sa ou ta renmen fÃ¨? EntÃ¨nÃ¨t la santi l trÃ¨ underwhelming si sa a se tout sa nou kapab fÃ¨. ODYANS: Chanje koulÃ¨ a âânan tÃ¨ks la. DAVID J. Malan: Chanje sa a? ODYANS: KoulÃ¨ nan tÃ¨ks la. DAVID J. Malan: Chanje koulÃ¨ nan tÃ¨ks. Tout dwa. Se konsa, kite a fÃ¨ sa a. Jis ankÃ² pou ke ou pa, jis pa rot, fÃ¨ egzakteman sa m ap fÃ¨, Mwen pral vire sou mizik pou petÃ¨t senk minit isit la. Ou se akeyi yo sÃ¨vi ak Google. Ou se Byenveni nan mande m ', ak Mwen pral chichote yon allusion nan zÃ²rÃ¨y ou. Ou se Byenveni nan gade sou sou zepÃ²l lÃ²t la. Men, rezoud jis youn nan pwoblÃ¨m sa yo. Men, nou pral fÃ¨ yon sÃ¨l la ki sot pase a, fÃ²me yon sÃ¨l, si nou te kapab, ansanm. Se konsa, senk minit yo rezoud nenpÃ²t youn nan pwoblÃ¨m sa yo lÃ¨ l sÃ¨vi avÃ¨k Google, entwisyon, oswa nenpÃ²t ki lÃ²t mwayen disponib nan ou. 

[MIZIK jwe] Tout dwa. Pa gen enkyetid si ou vle kenbe brikolaj, men mwen pral gate yon koup nan repons sa yo. Se konsa, sijesyon an premye soti nan Victoria te fÃ¨ tÃ¨ks pi gran. Se konsa, gen nan yon fason kÃ¨k fÃ¨ sa. Mwen te kounye a retabli ekran m 'nan gwosÃ¨ sa a, si mwen te agrandi nan atifisyÃ¨lman jis yo wÃ¨ bagay sa yo. Li kite yo fÃ¨ sa. Kite m 'ale pi devan epi gen tan pwan kÃ¨k jenerik Latin tÃ¨ks jis pou nou gen yon bagay yo travay avÃ¨k. Se konsa, ban m 'jis yon sÃ¨l moman. Mwen pral moute twa ti paragraf yo. OK. Sa a pral yon pi bon egzanp. Se konsa, pou kirye a, nan hello.html mwen, mwen jis kopye twa idyo paragraf latin jis pou nou gen kÃ¨k tÃ¨ks yo travay avÃ¨k. Ak objektif Victoria a te fÃ¨ kÃ¨k nan tÃ¨ks la pi gran. Se konsa, mwen te kapab, tankou anvan, ale nan isit la. Ak kite m 'fÃ¨ l' chemen dwat la. Mwen pral gen yon lyen tag ki pwen nan yon dosye rele "styles.css," relasyon ki nan ki se ankÃ² "stylesheet." LÃ¨ sa a, mwen pral delivre sa epi louvri moute sa a "styles.css." 

Se konsa, tankou anvan, mwen gen nan kapasite nan sa a ranpli CSS ki aktyÃ¨lman pase sou desizyon default la estetik nan yon paj entÃ¨nÃ¨t, ak estetik yo default, nan kou, yo trÃ¨ mat. Li nan sÃ²t de font size nÃ²mal, nwa tÃ¨ks, blan jan nou koumanse, ak pou fÃ¨. Se konsa, ta kwÃ¨ mwen vle fÃ¨ tout nan tÃ¨ks sa a pi gran. Mwen te kapab fÃ¨ yon bagay kÃ¨k. Nan dosye styles.css mwen, mwen te kapab di, ou konnen ki sa, aplike sa yo nan kÃ² a nan paj m 'yo. Ale pi devan epi fÃ¨ nan font size 24 pwen, ki se yon nimewo mwen ta ka itilize nan Microsoft Word. Kite m 'ale tounen nan entÃ¨nÃ¨t mwen an paj isit la ak Reload, epi ou ka wÃ¨ ki li nan deja pi gwo anpil. Epi nou ka jwenn yon ti kras fou, jis tankou nou kapab sou yon desktop-- fÃ¨ li 96 pwen. Recharger. Epi, se nan ap resevwa yon ti kras maladwa nan pwen sa. 

Men, mwen te kapab fÃ¨ yon ti kras pi plis presi. Olye pou yo k ap aplike sa a stylesheet nan kÃ² a nan paj m 'yo, ki lÃ²t bagay ta ka mwen aplike li nan olye de sa, sa lÃ²t tag ki ta ka toujou fonksyon nan menm fason an? 

ODYANS: Tag nan p? DAVID J. Malan: P tag. Se konsa, tÃ¨t la pa ta dwe kÃ²rÃ¨k, paske tÃ¨t la, ou pa kapab aktyÃ¨lman kontwole estetik yo nan. Genyen swa tÃ¨ks gen oswa pa. Men, p tag mwen kapab plonje nan yon ti kras pi fon, se konsa pale, nan paragraf la Tags. E menm si gen twa, sa a, se parfe amann, paske se nan CSS, lÃ¨ m 'jis di "p," sa a vle di aplike sa ki annapre yo nan nenpÃ²t tag ki matche ak chwa sa a seleksyon, seleksyon an jis ke yo te non an nan tag a. Se konsa, tout kote ou wÃ¨ yon "P," aplike gwosÃ¨ a font, e kite yo fÃ¨ li plis rezonab again-- 24 pwen. Epi ou konnen ki sa, jis pou bon mezi, kite a fÃ¨ koulÃ¨ a wouj jis pou moman sa a. Epi, koulye a si mwen Reload, kounye a nou wÃ¨ twa paragraf lÃ¨d. 

Men koulye a, ta kwÃ¨ ke mwen se sÃ²t de- mwen vle paragraf nan premye so soti nan itilizatÃ¨ a. Mwen pa vle jis ogmante gwosÃ¨ a font nan tout bagay. Se konsa, mwen aktyÃ¨lman vle yo idantifye oswa fÃ¨ distenksyon ant nan mitan paragraf sa yo. Se konsa nou debarase m de wouj la, paske sa se sÃ¨lman kalite minables, e kite yo ale pi devan epi fÃ¨ nan font size 12-pwen pa default, pou nou ap tounen nan yon bagay yon ti kras plis ki rezonab. Epi, koulye a mwen jis vle ogmante a font size nan paragraf la an premye. Mwen ka fÃ¨ sa nan yon kÃ¨k fason, men yon fason sa a, se petÃ¨t pi ansÃ¨yman nan la moman se fÃ¨ sa ki annapre yo. Kite m 'ale pi devan epi di, sa a paragraf gen yon ID inik nan "premye." Mwen te kapab rele anyen sa a mwen vle. Mwen te kapab rele sa a "foo" oswa nenpÃ²t ki lÃ²t mo, men mwen pral bay li kÃ¨k Semantics sans Non tankou "premye." Sa a se idantifyan a inik, ID a, la pou premye paragraf mwen. 

Ki sa mwen kapab kounye a fÃ¨ nan stylesheet mwen se gen yon ti kras pi plis presi. Olye pou yo di, aplike , Ki anba la a tag nan p Mwen kapab di annapre a aplike sa ki annapre yo, oswa chwazi, eleman nan HTML ki gen yon ID inik nan "premye." Ki sa mwen vle pou aplike nan li? Yon font size nan 24-pwen. Se konsa, mwen gen de seleksyon kounye a. Youn fÃ¨ tout nan a paragraf 12-pwen. Men, yon sÃ¨l sa a, espesyalman depi li rive second-- li rive sot pase a nan file-- la sa a gen yon efÃ¨ kaskad. Mwen te jis te fÃ¨ tout sa mwen paragraf Tags 12-pwen, men sa a kounye a kaskad ak Vanport ke pou nenpÃ²t eleman nan paj la, nenpÃ²t tag nan paj la ki gen inik ID se quote unquote "premye." Apre sa, hashtag a nan kontÃ¨ks sa a jis vle di "inik idantifyan." Mwen pa mete l 'nan dosye a HTML. Se mwen menm, sou isit la, jis di quote unquote "premye." 

Se pou m 'recharger. Epi, koulye a mwen wÃ¨, ah, OK. Mwen vle di, li pa ki bÃ¨l, men li la kalite de tankou prefas la nan yon liv oswa yon bagay tankou sa yo, kote paragraf nan premye se pi gran. Ta ka menm plis egzak ak jis lÃ¨t yo an premye, men omwen Mwen te egzÃ¨se plis kontwÃ²l. Koulye a, maybe-- petÃ¨t mwen vle fÃ¨ sa detanzantan pou kÃ¨lkeswa rezon, Se poutÃ¨t sa mwen pa vle sa a aplike nan sÃ¨lman yon sÃ¨l tag HTML. Olye de sa, se pou yo say-- kite nan tou fÃ¨ sa ki annapre yo. Gwoup = "enpÃ²te." LÃ¨ nou konsidere ke se yon ID itilize yo inikman idantifye yon sÃ¨l bagay, yon sÃ¨l tag, nan paj entÃ¨nÃ¨t ou an, se yon klas vle di yo dwe itilize sou nenpÃ²t ki kantite eleman oswa Tags nan paj entÃ¨nÃ¨t ou an. Se konsa, li ki kapab itilize ankÃ². Yon ID se pa ki kapab itilize ankÃ². Yon klas se ki kapab itilize ankÃ². 

Epi ou konnen ki sa, pou kÃ¨lkeswa filozofik reasons-- Mwen pa t 'fini mwen thought-- mwen pral di ki paragraf nan premye ak nan dezyÃ¨m paragraf yo enpÃ²tan. Se konsa, mwen pral pou aplike pou klas la rele "EnpÃ²tan," sa a, si mwen sove dosye mwen ak Reload, pa gen okenn fonksyonÃ¨l enpak ankÃ². Men, mwen te te ajoute kÃ¨k Metadata nan dosye a, sÃ²t de yon bagay apa soti nan done yo debaz nan dosye a, se konsa ke kounye a nan stylesheet mwen, si mwen olye pou di ".Ki enpÃ²tan" - ou konnen, nenpÃ²t ki bagay ki enpÃ²tan, mwen pral fÃ¨ font-koulÃ¨, red-- ou pito pa font-koulÃ¨, jis koulÃ¨. Genyen enkonsistans nan CSS malerezman. Apre sa, recharger. Koulye a, remake premye a de paragraf yo wouj men se pa twazyÃ¨m lan, paske mwen sÃ¨lman aplike klas la nan "enpÃ²tan" nan de nan premye nan bagay sa yo. 

Se konsa, nan idantite, ou gen kapasite nan ou presize trÃ¨ jisteman. AvÃ¨k klas, ou gen reutilizasyon. Men, nan tou de ka, remake nan sÃ²t de prensip bon-konsepsyon kote mwen faktÃ¨ soti tout nan a estetik nan dosye styles.css mwen. Se konsa, gen nan pa gen messiness isit la. Gen nan pa gen mansyone nan wouj oswa fonse-fÃ¨ fas a oswa font size nan sa a dosye-a. Olye de sa mwen gen Semantics, aktivman karakterize done m 'kÃ²m, isit la se kÃ¨k done enpÃ²tan. Isit la se kÃ¨k done pi enpÃ²tan. Anplis, isit la se a "Premye" nan done enpÃ²tan m 'yo. Se konsa, HTML se tout sou sÃ²t nan balisage, literalman, mo ak paragraf ak konstwi nan ou paj ak sijesyon sa yo ti kras, si ou pral, ke ou ka yon jan kanmenm ogmante lÃ¨ l sÃ¨vi avÃ¨k lÃ²t teknik tankou CSS nan fason sa. 

Se konsa, nan repons a kesyon Victoria a, nou ka fÃ¨ tÃ¨ks pi gwo nan fason sa a. Gen anpil lÃ²t fason, men font la tag louvri bracket "font" - se aktyÃ¨lman plizyÃ¨ ane fin vye granmoun. LÃ¨ sa a se pwoblÃ¨m nan, tou, ak repoze sÃ¨lman sou entÃ¨nÃ¨t resources-- yo gen tandans yo dwe demode. Ak tout bon, sa a te Obsoleted, paske mond lan reyalize, sa ki "font-gwosÃ¨ = 7" vle di? Li pa fÃ¨ sa. Se konsa, pou anpil ane ak sa a day-- youn nan bÃ² a nÃ²t isit la se ke li se aktyÃ¨lman Ã¨kstrÃ¨meman ki fÃ¨ mal toujou pafwa yo devlope sit pou la sou sit wÃ¨b, paske Microsoft ak Google ak Mozilla ak lÃ²t moun souvan dakÃ² ki di kÃ²man ka esplike nou rÃ¨v yon spesifikasyon tankou HTML. 

Gen yon rulebook pou HTML ki jeneralman di ki sa chak tag vle di. Men, pafwa li ki rete nan la diskresyon aplikasyon an, diskresyon Microsoft a ak Google. Se konsa, ou pral trÃ¨ souvan wÃ¨ sou yon yon bagay sit entÃ¨nÃ¨t parÃ¨t diferan sou yon PC pase sa li fÃ¨ sou yon Mac, ak sa ki nan vrÃ¨man paske, nan fen jounen an, yo pa t 'tÃ¨s li byen sou tou de tribin. Men, li la tou paske rezonab, moun ki entelijan pral dakÃ² ak konpayi pral dakÃ², e konsa youn nan defi yo nan pwogram pou entÃ¨nÃ¨t la oswa desine bagay sa yo pou entÃ¨nÃ¨t la ap ekri sit entÃ¨nÃ¨t ou nan yon fason ki travay sou chak navigatÃ¨ entÃ¨nÃ¨t. Men, menm sa a, se rezonab, dwa? Gen vÃ¨syon anpil nan anpil navigatÃ¨ yo deyÃ² ki, nan kÃ¨k pwen, ou gen tou yo fÃ¨ yon apÃ¨l jijman epi ou gen deside kÃ²m yon konpayi, espesyalman pou E-commerce-style sit kote w ap ap eseye sÃ¨vi ak dÃ¨nye a ak pi gran teknoloji bay yon itilizatÃ¨ reyÃ¨lman bon eksperyans. Men, gen kÃ¨k pousantaj nan itilizatÃ¨ ou ta ka toujou gen lÃ¨ l sÃ¨vi avÃ¨k Internet Explorer 6 oubyen 7 oswa 8, espesyalman tou depann de la peyi yo ke yo ap vini soti nan. 

Se konsa, trÃ¨ souvan konsultÃ© se yon bagay tankou "estatistik navigatÃ¨ entÃ¨nÃ¨t." Men, si n 'al jwenn to-- kite a wÃ¨ Wikipedya ak wÃ¨ kÃ²man monte-a-dat tablo sa a se si gen yon sÃ¨l. Se konsa, isit la ou ka wÃ¨ kote navigatÃ¨ aktyÃ¨lman yo, dapre jiska desanm 2015, dapre GouvÃ¨nman Ameriken an. Chrome se nan pati nan mache 42%, ki te swiv pa IE lajman nan anviwÃ²nman antrepriz oswa anviwÃ²nman PC, nan kou, ki te swiv pa Firefox, LÃ¨ sa a, Safari, lÃ¨ sa a Opera pa t ' fÃ¨ kat jeyografik la isit la pou kÃ¨k rezon, ak LÃ¨ sa a Gen lÃ²t ki. PetÃ¨t li nan anba Gen lÃ²t ki. Men, plis pwoblÃ¨m pase sa is-- kite a wÃ¨ si Wikipedya tou te gen vÃ¨syon an navigatÃ¨ version-- 

Ann ale nan estatistik navigatÃ¨. IE. Menm sa a, se pa ase. NavigatÃ¨ estatistik. vÃ¨syon mwen. Sa pa k ap pase yo dwe gen dwa. Ann wÃ¨ vÃ¨syon. NavigatÃ¨ mache pataje. Ann wÃ¨ si sa a vini leve. OK. Koulye a, sa a ap vin yon ti kras plis itil. Se konsa, isit la, remake ke nou gen tout diferan vÃ¨syon nan navigatÃ¨. Epi, Bondye mwen, si ou look-- Chrome 48, Chrome 47, Chrome 31, Chrome 45. Mwen vle di, navigatÃ¨ de pli zan pli mete ajou, epi pafwa kÃ¨k nan chanjman sa yo yo enpÃ²tan nan tÃ¨m de fonksyonalite. Se konsa, nan kÃ¨k pwen, nan administratÃ¨ pwodui oswa enjenyÃ¨ yo bezwen fÃ¨ yon decision ou konnen ki sa, sÃ¨lman 1% nan mond lan se toujou lÃ¨ l sÃ¨vi avÃ¨k IE 7. Kote mÃ² yo ye ak yo. Nou jis ap pa pral sipÃ²te ki navigatÃ¨. Ak sa ki sa vle di pa sipÃ²te? Li ta ka vle di ke bouton pa travay nan paj entÃ¨nÃ¨t ou an, oswa li ta ka vle di nan fÃ²ma se konplÃ¨tman an. Oswa ou ta ka gen fÃ¨ ki menm rele jijman nan mobil jou sa yo, kote, nou ap pa ale nan sipÃ²te iOS 5 ankÃ². Se konsa, pÃ¨p jis gen mete yo ajou. Oubyen Ã¨ske nou pa ap ale nan sipÃ²te kupkÃ¨yk sou android eksplwatasyon pou android aparÃ¨y, paske kÃ²m world-- a kÃ²m nan teknoloji mond vle pou avanse pou pi pou pi devan, li kalite vle trennen nan mond ak li pou ke yo pa fÃ¨ sa gen pou l kontinye gen bak konpatib pou yo ka ofri nouvo ak bon karakteristik. Sa a se tout bon youn nan rezon ki poukisa sa anpil konpayi yo ap woule nan dÃ¨nye otomatik ak sÃ²t de fÃ²se vÃ¨syon yo dÃ¨nye nan lojisyÃ¨l sou nou. E menm konpayi tankou Apple pral sÃ²t nan fÃ²se ou prÃ¨ske oswa fÃ²se ou an tÃ¨m de fÃ²s mache yo achte yon nouvo telefÃ²n paske yo jis pa pral mete ajou telefÃ²n fin vye granmoun ou ankÃ². Se konsa, ou manke soti sou la dÃ¨nye yo ak pi gran karakteristik, paske li nan koute chÃ¨ yo yo tankou yon konpayi yo kenbe pi gran, joui vÃ¨syon enferyÃ¨ nan lojisyÃ¨l. Men, efÃ¨ a nÃ¨t se ke nou menm tou nou soufri sa a tou. 

Se konsa, kite a pran yon gade nan jis yon koup nan bagay final isit la. Se pou nou frape nan reyÃ¨l vit kÃ¨k nan moun sa yo lÃ²t bal, si kirye. Se konsa, si ou te ap eseye, pou egzanp, pozisyon tÃ¨ks la sou kote diferan nan la paj, mwen pral fÃ¨ yon fason rapid, men gen nan diferan fason pou fÃ¨ sa a. Kite m 'ale pi devan epi eliminate-- senplifye sa a jan sa a. Kite m 'jis tounen nan m' senp, paragraf senp. Kite m 'ale tounen nan styles.css mwen. Apre sa, mwen jis ale nan sÃ¨vi ak simple-- la ki ou ta ka gen pou wÃ¨ sou Google oswa sonje soti nan earlier-- tÃ¨ks-aliman dwat. Ak Reload paj sa a. Koulye a, tout bagay sanble yo dwe gen dwa-ki aliyen, jan ou ta ka wÃ¨ sou sou tÃ¨t la isit la. 

Nou ka fÃ¨ li gade yon ti kras plis liv ki tankou, epi nou ka di "jistifye" ak Reload. Kounye a li nan bÃ¨l ak kare sou tou de kote, ki se kalite bÃ¨l. Yon lÃ²t objektif sa a nou te gen isit la te chanje koulÃ¨ nan tÃ¨ks. Se konsa, nou te wÃ¨ ke ak tÃ¨ks wouj m 'yo. Epi, koulye a ajoute bouton pou yon fÃ²m. Se konsa, poukisa pa nou eseye fÃ¨ egzakteman sa a? Men, anvan kite m 'ale nan yon sit ki pi fÃ² nan nou itilize chak day-- Google. Li kite yo pran yon gade nan ki jan Google aktyÃ¨lman ap travay. Men, mwen pral fÃ¨ sa. Premye kite m 'fÃ¨ l in-- YEP, kite m 'ale sou Google premye. Mwen pral gen yo ale nan Google AnviwÃ²nman, paske mwen vle enfim yon bagay yo rele rezilta Instant. 

Se konsa, ou ka gen remake nan Google sa yo days-- kite m 'ale tounen epi y'a vire sa a sou. Se konsa, si mwen kÃ²manse chÃ¨che pou "chat" tankou sa a, remake ke pa sÃ¨lman fÃ¨ Mwen jwenn oto-ranpli moute tÃ¨t, tout nan yon toudenkou, paj nan tÃ¨t li sanble yo chanje trÃ¨ byen vit kÃ²m byen, e ke sa a lÃ¨ l sÃ¨vi avÃ¨k Google yon lang rele JavaScript ap eseye gen itil. Men, malerezman, li kalite nan dega moute diskisyon nou an nan sa k ap aktyÃ¨lman pase anba kapo a isit la. Se konsa, mwen menm ki jis kalite byen vit fÃ¨men rezilta enstantane. Apre sa, mwen ale nan klike sou Save. Epi, koulye a mwen pral louvri ki dyagnostik toolbar ke mwen kenbe ouvÃ¨ti anba tab la Network. Se konsa nou fÃ¨ sa. Se pou mele l whoops-- woulo liv sa a desann yon ti jan. Ak kite m 'rechÃ¨ch pou "chat." 

Epi, koulye a notice-- aktyÃ¨lman, sa a se yon bon opÃ²tinite yo diskite sou pou yon moman. Avi moman sa a mwen type-- sispann li. Sispann. OK. Avi moman sa a mwen tape lÃ¨t la C, gade anba a nan ekran an. A- T S. Ki sa pati anba a nan ekran sa a, tab Rezo mwen, sijere k ap pase chak fwa mwen tape yon lÃ¨t? Malerezman, krapo a se trÃ¨ trouble jodi a oswa Shamrock la oswa kÃ¨lkeswa sa li ye. Sa ki te pase chak fwa mwen tape? Ak kite m 'klÃ¨ nan pezib ak kalite l 'ankÃ². whoops So--. Chak fwa mwen tape yon lÃ¨t, C- A- T-- se konsa yon ranje nouvo evidamman kenbe parÃ¨t. Ki sa ki chak nan ranje sa yo reprezante, ki baze sou sa nou te wÃ¨ ak diskite konsa byen lwen? ODYANS: Yon rechÃ¨ch? DAVID J. Malan: Yon rechÃ¨ch, oswa plis generic, yon demann HTTP soti nan nan sÃ¨vÃ¨ navigatÃ¨ m '. Oke, poukisa se navigatÃ¨ m 'fÃ¨ yon HTTP mande chak fwa mwen tape yon lÃ¨t? 

ODYANS: [fÃ¨bl] DAVID J. Malan: Yeah, li nan bay m 'rezilta oto-konplÃ¨ sa yo. Tankou, kote fÃ¨ sa yo Rezilta rechÃ¨ch soti? Oke, chak fwa mwen tape yon lÃ¨t, Google voye plis ak pi plis ak plis nan pawÃ²l Bondye a mwen sezisman. Poukisa? Paske yo vle ban m 'yon pi bon ak pi bon, pi bon sijesyon, yon lis sijesyon, pou sa ki mo Mwen ap eseye aktyÃ¨lman konplÃ¨. Se konsa, sa sa a vle di literalman chak pÃ¨sonaj ou tape nan Google se ke yo te voye, finalman nan esansyÃ¨l, men tou, pafwa yon sÃ¨l nan yon moman nan lÃ²d yo aplike karakteristik sa yo oto-konplÃ¨ lÃ¨ done a se, nan kou, sou entÃ¨nÃ¨t la. 

Koulye a, kite a pran yon gade nan sa ki aktyÃ¨lman k ap pase lÃ¨ mwen klike sou Google Search. LÃ¨ sa a, nou pral ogmante sa a tÃ¨t nou. Se konsa, si mwen desann kounye a trÃ¨ a premye demann ki jis ki te pase. Avi sa ki annapre yo. Li te voye nan yon san patipri lontan URL-- https://www.google.com/search? ak LÃ¨ sa a yon pakÃ¨t antye nan bagay. Ann wÃ¨ sa a aktyÃ¨lman kounye a nan tab la navigatÃ¨ tÃ¨t li. Se pou nou debarase m de ba ikÃ²n nan isit la. Isit la nan paj la nan rezilta rechÃ¨ch la. Apre sa, avi isit la nan URL la. Koulye a, ou ka pwobableman devine sa k ap pase isit la nan pati. Se konsa, premye a tout moun, yon definisyon. Sa a aparamman se destinasyon an ki kote fÃ²m nan soumÃ¨t. Se konsa, lÃ¨ mwen tape nan nan mo "chat" ak frape Antre, aparamman Google voye opinyon tÃ¨ks mwen an sa a URL ke mwen te make la, koupe rechÃ¨ch. Vire soti, nan yon URL, nenpÃ²t ki bagay ki k ap pase apre yon mak kesyon se, jan nou kenbe li di, yon pÃ¨ kle-valÃ¨ ki te tape nan fÃ²m lan oswa yon jan kanmenm transmÃ¨t de la navigatÃ¨ nan sÃ¨vÃ¨ a. 

Se konsa, nenpÃ²t ki lÃ¨ ou tape D ' nan yon fÃ²m sou entÃ¨nÃ¨t la ak li a voye kÃ²m nou te te diskite sou, atravÃ¨ yon jwenn, youn nan sa yo vityÃ¨l anvlÃ²p, sa ki nan ki envelope-- repons lan se wi, kenbe ap resevwa boure fizikman nan anvlÃ²p la nan klas jodi a, men teknoloji li la aktyÃ¨lman mete nan URL la. Se konsa, an reyalite, kite m 'pase atravÃ¨ sa a. Ki kote ou wÃ¨ opinyon itilizatÃ¨? Ki kote ou wÃ¨ yon bagay pou mwen menm mwen tape moute isit la? Yeah, se konsa "chat." Dwa? Se pou m 'distile sa a nan yon bagay ki pi senp. Mwen pral efase tout bagay sou sa a URL ke mwen pa konprann, ak mwen jis ale nan kite li kÃ²m sa a men / rechÃ¨ch? q = chat. Nou pral wÃ¨ ki kote q soti nan nan yon moman, men sa santi l tankou minimÃ²m la kantite lajan pou enfÃ²masyon ke mwen bay la. Epi, koulye a mwen pral frape Antre. Apre sa, remake li toujou ap travay. Nou toujou jwenn tounen yon pakÃ¨t antye nan chat. Se konsa, Google se amateur pase sa a jou sa yo. Li nan 2016, pa 1999. Se konsa, gen nan lÃ²t bagay ki mwen se navigatÃ¨ voye nan sÃ¨vÃ¨ a. Men sa se minim tout sa a, se sa nesesÃ¨. 

Se konsa, sa k ap pase sou? Oke, premye kite m 'ale pi devan epi ale tounen nan Cloud9 ak kite m 'ale pi devan epi fÃ¨men onglÃ¨ mwen pi bonÃ¨. Apre sa, mwen pral fÃ¨ sa a sou mwen posede jis pou yon moman. Mwen pral ale pi devan ak kreye nouvo dosye-a. Men, mwen pral pou konsÃ¨ve pou li kÃ²m google.html. Men, mwen pral trÃ¨ quickly-- Mwen pral yo nan vole, aktyÃ¨lman, kÃ¨k nan tÃ¨ks sa a jis pou konsÃ¨ve pou tan. Mwen pral kole sa a nan isit la. Mwen pa ale nan deranje ak nenpÃ²t stilizasyon moman sa a. Nou pral rele sa a "mwen Google." Men, mwen pral debarase m nan tout bagay nan kÃ² a. Apre sa, mwen pral fÃ¨ sa ki annapre yo. Kite m 'rale nan. FÃ²m action-- ak jan mwen yon ti tan mansyone earlier-- whoops-- jan mwen yon ti tan mansyone pi bonÃ¨, aksyon an nan yon fÃ²m se kote ou voye done yo nan. Se konsa, google.com/search. Ak metÃ²d la mwen vle sÃ¨vi ak kapab youn nan de bagay sa yo. Li ka swa dwe "jwenn," kÃ²m nou kenbe diskite sou, oswa li kapab "post." Pou kounye a, fondamantal nan diferans se, si ou sÃ¨vi ak "jwenn," tout enfÃ²masyon an ki nan itilizatÃ¨ bay vin voye nan URL la. 

Sa se gwo pou bagay sa yo tankou rechÃ¨ch motÃ¨ ak yon kÃ¨k aplikasyon pou lÃ²t, men nan ki sikonstans ta ou pa vle ranpli yon fÃ²m epi yo gen enfÃ²masyon ki fini nan URL, tankou nan navigatÃ¨ ou a adrÃ¨s ba? Ki kalite fÃ²m fÃ¨ you-- ODYANS: [fÃ¨bl] DAVID J. Malan: Yeah, tankou ki sa? ODYANS: Modpas. DAVID J. Malan: Yeah, se konsa ou ouvri sesyon nan Facebook oswa kÃ¨k sit entÃ¨nÃ¨t. Sa a opinyon itilizatÃ¨ soti nan yon fÃ²m, yon bwat tÃ¨ks, men pwobableman ou pa vle li ki montre moute nan URL navigatÃ¨ a. Poukisa? Mwen vle di, petÃ¨t gen kÃ¨k enplikasyon sekirite sou rezo a, men more-- renmen, plis tou senpleman, sa ki si kolokasyon ou, lÃ²t enpÃ²tan ou, timoun ou, mari oswa madanm ou sanble nan istwa navigatÃ¨ ou a? Gen dwat modpas ou gen la nan istwa navigatÃ¨ ou a. Sa pa santi tankou bon konsepsyon. Oswa menm plis teknikman, ta kwÃ¨ w ap eseye Upload yon foto Flickr oswa Facebook oswa wherever-- ki se opinyon itilizatÃ¨, menm si li nan yon ti kras pi plis interesting-- ki jan Mwen bachote yon imaj nan ba a URL? Ou kalite sÃ²t de pa kapab. Ou kalite kapab. Men, reyÃ¨lman, mwen se difisil-bourade imajine fÃ¨ sa. Se konsa, mwen bezwen yon lÃ²t metÃ²d pou uploading foto nan yon sit entÃ¨nÃ¨t, epi li se ke lÃ²t metÃ²d rele "post." Men, pou kounye a, nou pral jis pale sou "Jwenn", ki se ki pi senp la nan de a. Li jis mete tout nan opinyon itilizatÃ¨ nan URL la. 

Se konsa, isit la nan fÃ²m la mwen kreye. Mwen vle yon opinyon. Epi ou konnen ki sa? Mwen pral pran yon devine isit la. Mwen pral sonje mwen D ' "q" pou "rechÃ¨ch." Apre sa, mwen panse ke sa a se youn nan nan desen orijinal la, petÃ¨t, ki soti nan 1999. LÃ¨ sa a, ki kalite sa a D ' se jis ale yo dwe "tÃ¨ks." LÃ¨ sa a, mwen pral gen yon lÃ²t opinyon ki pa bezwen yon non, menm jan nou pral byento wÃ¨, ki kalite ki se "soumÃ¨t." LÃ¨ sa a ki pral ban m 'yon bouton espesyal. Epi sa a, li. 

Se pou m 'ale pi devan epi sove sa a ranpli. Mwen pral pou tounen nan m ' navigatÃ¨ epi ale nan google.html. Antre nan. Epi, se nan kalite rar yo di pi piti a. Men, kite m 'ale pi devan ak rechÃ¨ch pou "chat." Apre sa, remake mwen se kounye a nan sa a Cloud9 URL. Men, moman sa a mwen klike sou sa a, kote ou espere ke mwen pral fini? 

ODYANS: Google. 

DAVID J. Malan: Google. Se konsa nou klike sou soumÃ¨t. Ak tout bon mwen te re-aplike Google. Dwa? Li nan ki pi senp. Li nan pi lejÃ¨. Mwen vle di, kÃ²d m 'se byen klÃ¨ pi bon pase leur, ki soti nan dezÃ²d la nou te wÃ¨ pi bonÃ¨. Epi ou konnen ki sa? Mwen pral epis sa a moute yon ti kras. Mwen pa t 'mansyone sa a pi bonÃ¨. Gen Tags tankou H1, pou Tit 1, tit ki pi enpÃ²tan nan yon paj. "Google m 'yo," Mwen pral rele sa a. Kite m 'recharger. Li nan kap yon ti kras pi byen deja. Epi, aktyÃ¨lman, ou konnen ki sa? Mwen te deja- mwen bay manti. Mwen te di mwen pa te ale nan style sa a, men mwen pral style sa a tankou anvan an. Apre sa, kÃ² mwen an a pwal, kite a di, tÃ¨ks-aliman sant. Li nan kap plis tankou Google deja. 

Mwen bezwen yon ti repo liy, menm si, pou sa soumÃ¨t bouton. Epi li vire soti, ou ka itilize paragraf, oswa ou ka plis literalman jis di, ban m 'yon liy repo isit lan-- tag nan br. Men, si mwen Reload sa a, kounye a li ale la. Li se yon ti kras lÃ¨d, se konsa mwen ta ka fÃ¨ repo liy miltip, men kite a pa jwenn twÃ² visye isit la. Se konsa, kounye a kite a wÃ¨ si li ap travay pou "chen." Li sanble nan travay pou "chen," osi byen. Se konsa, sa ki nan Takeaway a konvenkan isit la? Yonn-pa t 'yon kwasans gwo nan prezante yon tijan plis Tags, tankou tag nan fÃ²m nan tag a opinyon. Men, plis fondamantalman se, tout n ap fÃ¨ se swe konpreyansyon nou nan HTTP ak lefÃ¨t ki fÃ²m finalman chanje sa ki nan URL la nan navigatÃ¨ a, epi konsa, Se poutÃ¨t sa, nou kapab mekanikman bay dizon nan yon sÃ¨vÃ¨ pa fÃ¨ yon fÃ²m HTML ak konnen ke sÃ¨vÃ¨ a konprann HTTP, jis tankou kÃ² nou konprann, tankou, souke men m ', ki pwotokÃ²l menm, epi pou nou jwenn tounen repons lan ke nou finalman atann. 

Se konsa nou eseye fÃ¨ yon sÃ¨l dÃ¨nye bagay kounye a ak mobil, epi mwen pral make-- mwen pral ajoute sa a kÃ²d nan glisad yo. Se konsa, si ou ta renmen Tinker, ou kapab sÃ¨tÃ¨nman pran li nan men la. Men, mwen pral ale pi devan epi fÃ¨ yon sÃ¨l bagay. Mwen pral ale pi devan epi louvri moute page-- endÃ¨ks mwen paj alo mwen tankou anvan, ki gen yon anpil nan sa a tÃ¨ks faux-Latin lan, oswa san sans Latin tÃ¨ks, ak has-- li sanble tankou sa a nan nivo sa a font size. Men, kite m 'ale pi devan epi fÃ¨ sa. Mwen pral ale nan Cloud9. Epi ou pa dwe fÃ¨ sa a etap. Mwen pral jis fÃ¨ li tÃ¨t mwen. Mwen pral klike sou pataje. LÃ¨ sa a se yon karakteristik jis nan Cloud9, annakÃ² ak sa Mwen ka fÃ¨ anviwÃ²nman mwen piblik. 

Epi jis pou dedomajman pou la demonstrasyon, kite m 'fÃ¨ sa. Mwen pral fÃ¨ piblik aplikasyon mwen an. Avi li nan avÃ¨tisman m ', mwen se Mwen asire w mwen vle fÃ¨ sa a, paske sa a ki pral fÃ¨ tout moun nan mond lan, si wi ou non yo ap isit la kounye a oswa l ap gade videyo a pita sou nan entÃ¨nÃ¨t kapab wÃ¨ sa m 'wÃ¨. Men, sa a OK. Mwen pral di "FÃ¨." Ak kite m 'ankouraje w, si m' te fÃ¨ sa a correctly-- kite m 'tÃ¨s li an premye. Ale pi devan, si ou pa mind-- nan yon navigatÃ¨ sou Ã²dinatÃ¨ ou, ale nan sa a URL, ak Ã¨spere ke ou pral wÃ¨ tÃ¨ks Latin mwen. Ak yo dwe klÃ¨, li nan kouri pa sou laptop mwen. Li nan nan nwaj la. Li nan sou Cloud9, literalman, men Mwen te fÃ¨ piblik vorkspas mwen se konsa ke nenpÃ²t moun ki sou entÃ¨nÃ¨t la kapab jwenn aksÃ¨ paj Latin lakay mwen. 

Ale nan URL la menm sou telefÃ²n ou, si ou te kapab. Si li pral koute ou, menm si, ou ka jis gade sou yon zepÃ²l. ODYANS: [fÃ¨bl] DAVID J. Malan: Mwen regrÃ¨t? ODYANS: [fÃ¨bl] DAVID J. Malan: Jis Mo Latin. Sa a tout. Men, sa a sa ou ta dwe wÃ¨. 

ODYANS: Yeah. DAVID J. Malan: Yeah. Yeah. OK. Se konsa, mwen ka kenbe moute ou telefÃ²n sÃ¨lman pou moman yon? Se konsa, Ã¨spere ke, si w ap gen aksÃ¨ nan li, li ta dwe gade prÃ¨ske ilizibl. Li nan still-- Mwen vle di, li nan ilizibl paske nan Latin nan. Men, li la tou ilizibl pou sa lÃ²t rezon? Tankou, ki sa deple ou sou sa a? ODYANS: Li nan ki piti yo. DAVID J. Malan: Li nan super, super piti. Se konsa, kouman nou te ka ranje sa a? Li nan super, super ti sou telefÃ²n Victoria a ak, si ou te rale l 'tÃ¨t ou, pwobableman ti sou telefÃ²n ou kÃ²m byen, sof si ou gen anviwÃ²nman aksÃ¨ pÃ¨mÃ¨t. Kisa sa ye? Ou ta ka jis zongle ak rale, ki se possible, men LÃ¨ sa a ou sÃ¨lman wÃ¨ yon kÃ¨k mo nan yon tan. Se konsa, rete tann yon minit. Mwen konnen ki jan yo ranje sa a. Dwa? Mwen te kapab sÃ¨vi ak CSS, ak mwen te kapab chanje a font size soti nan 12-pwen nan 24-pwen. Men, efÃ¨ a bÃ² nan sa, nan kou, a pwal kounye a, sou yon Desktop oswa yon laptop, kounye a tÃ¨ks la se de fwa tankou gwo. Se konsa, li ta kalite dwe nice nan distenge aparÃ¨y, epi li vire soti gen yo fason pou fÃ¨ sa. Gen plizyÃ¨ diferan fason, an reyalite, kijan lÃ¨ l sÃ¨vi avÃ¨k CSS ak amateur karakteristik ke nou pa pral antre nan nan gwo detay, ou ka esansyÃ¨lman sijÃ¨ rechÃ¨ch navigatÃ¨ a ak di, si ekran ou se pi piti pase sa a anpil piksÃ¨l, sÃ¨vi ak sa a font size. Si ekran ou se pi gwo pase sa a anpil piksÃ¨l, sÃ¨vi ak sa a font size ak lÃ²t. 

Ou kapab menm amateur toujou. Si ou te janm te vizite yon paj wÃ¨b ki, sou yon Desktop, gen yon meni gwo petÃ¨t yo ale nan la bÃ², ak LÃ¨ sa a tout nan kontni an se sou bÃ² a nan ki menu-- sa a, se kalite yon paradigm komen. Menu sou bÃ² gÃ²ch, kontni sou bÃ² dwat, oswa vis vÃ¨rsa. pa reyÃ¨lman travay sou mobil lÃ¨ ou ekran se sÃ¨lman sa a anpil piksÃ¨l lajÃ¨. Se konsa, pi komen sou mobil se, meni ou pral toudenkou jwenn tonbe, epi ou gen yo klike sou yon bouton yo wÃ¨ li, oswa sou sit wÃ¨b la pral mete meni an pi wo a li, li mete kontni an anba a li. Epi ou ka aplike sa yo bagay sa yo nan fason miltip, tou. Ou ka mande pwogramasyon ou, hey, ekip, nenpÃ²t ki lÃ¨ ou wÃ¨ yon demann HTTP soti nan yon android aparÃ¨y, yon aparÃ¨y Microsoft, yon Google aparÃ¨y, yon aparÃ¨y Apple, sÃ¨vi ak sa a font size epi sÃ¨vi ak sa a Layout meni an, oswa lÃ²t moun sÃ¨vi ak default sa a pi gwo layout. 

Koulye a, lÃ¨ l sÃ¨vi avÃ¨k sa teknik fondamantal jodi a te kapab enjenyÃ¨ yo sÃ¨vi ak konnen si li nan yon ifon, yon telefÃ²n android, yon laptop, yon Desktop vizite sÃ¨vÃ¨ yo nan konpayi an? Kote yo jwenn enfÃ²masyon sa? 

ODYANS: Header? 

DAVID J. Malan: Yeah, header nan HTTP. Se konsa, chak demann HTTP vini soti nan kliyan yo nan serveurs yo enkli ladan yo, andedan ki vityÃ¨l anvlÃ²p, yon pakÃ¨t antye nan TÃ¨t HTTP, youn nan ki se navigatÃ¨ a ak sistÃ¨m nan fonksyone menm, si ou pran swen yo nivo sa a nan detay. Koulye a, li nan yon fisÃ¨l skre-kap, men gen egziste lojisyÃ¨l ki pral jis senplifye ki, epi ou ka jis mande nan pwogram code-- PHP, Java, C ++, kÃ¨lkeswa sa sa telefÃ²n se sa a men sa aparÃ¨y se itilizatÃ¨ sa a lÃ¨ l sÃ¨vi avÃ¨k? LÃ¨ sa a, ou ka di, montre yo sa a vÃ¨syon nan sit wÃ¨b la si li nan yon telefÃ²n. Montre yo sa a vÃ¨syon an nan sit entÃ¨nÃ¨t si li nan yon laptop oswa Desktop. Men, ou pa menm bezwen sÃ¨vÃ¨-bÃ² konpleksite. Ou ka fÃ¨ menm pi senp la bagay sa yo. 

Mwen pral fÃ¨ sa. Mwen pral ale pi devan nan anviwÃ²nman Cloud9 mwen, ak mwen pral ajoute yon tag ke ou te wÃ¨ nan Google anvan. Yo rele li metabaliz la. Apre sa, mwen pa janm sonje yon sÃ¨l sa a, se konsa Mwen pral transkripsyon li isit la. Meta Non = "viewport" ak LÃ¨ sa kontni = "lajÃ¨ = aparÃ¨y lajÃ¨, intital echÃ¨l = 1 "e ke sa a li. 

Se konsa, li ta ka kÃ²m byen, se pou tankou yon enkantasyon majik. Li nan pa tout sa ki klÃ¨, men sa a gen yon bagay fÃ¨ ak viewport la, ak viewport la se jis kÃ² a nan yon paj entÃ¨nÃ¨t, rejyon an rektangilÃ¨ ki defini pi fÃ² nan paj la. LÃ¨ sa a se jis di navigatÃ¨ a, ou konnen ki sa? FÃ¨ lajÃ¨ a nan paj sa a efektivman egal a lajÃ¨ a aparÃ¨y. Nan lÃ²t mo, pa asime ke ou gen sÃ²t de espas san limit. Sipoze ou gen sÃ¨lman kÃ²m anpil espas kÃ²m aparÃ¨y la tÃ¨t li se gwo. Se konsa, kounye a, si mwen Reload sa a nan navigatÃ¨ m 'yo, mwen pa wÃ¨ okenn chanjman. Men, si m 'te fÃ¨ correctly-- sa a epi kite m 'travÃ¨se fingers-- mwen si nou tout Reload telefÃ²n ou, ou wÃ¨ yon chanjman irezistib? Yeah, se that-- 

ODYANS: [fÃ¨bl] DAVID J. Malan: Wi. OK. Se konsa, joui plis lizib kounye a? Toujou piti, yo dwe jis, men se pa se konsa ti kÃ²m yo dwe dificil. Apre sa, mwen te kapab sÃ¨tÃ¨nman pase sou desizyon sa a pi lwen ak CSS oswa sou bÃ² sÃ¨vÃ¨, men de pli zan pli sa w ap wÃ¨ se pi plis ak plis karakteristik yo te ajoute nan kliyan-kÃ²t environments-- JavaScript, menm jan nou pral diskite sou demen, CSS, ak HTML-- se konsa ke tout nan demann sa yo ka fÃ¨ sou kliyan an se konsa yo bezwen deranje a sÃ¨vÃ¨ yon anpil mwens epi yo pa gen kenbe moute ak, pou egzanp, ofansiv la konstan nan nouvo opere-sistÃ¨m vÃ¨syon, vÃ¨syon navigatÃ¨ nouvo. Ou ka jis kite navigatÃ¨ a mande aparÃ¨y la, ki jan gwo moun ou ye, ak LÃ¨ sa a fÃ¨ yon ti jan ki lojik desizyon ki baze sou sa. Men, nou pral wÃ¨ plis opÃ²tinite pou pran desizyon ki lojik demen nan yon kontÃ¨ks la nan yon lang pwogramasyon. 

Se konsa, nenpÃ²t kesyon, lÃ¨ sa a, sou devlopman entÃ¨nÃ¨t? Jodi a se pa pwogram entÃ¨nÃ¨t, pou chak gade, depi pi tout bagay nou te fÃ¨ te trÃ¨ ayestetik, si ou pral. Pa gen okenn pou pran desizyon nan kÃ²d la ke nou te ekri nan Liv la ak pou Se poutÃ¨t sa HTML se yon markeup lang, se pa yon lang programmation. Men, demen nou pral pran yon gade rapid, finalman, nan JavaScript, ki se yon pwogram aktyÃ¨l lang ki pÃ¨mÃ¨t nou fÃ¨ yon ti jan plis. 

NenpÃ²t kesyon? Oke, kite m 'pwopoze de opÃ²tinite si ou vle pou devwa lakay. Youn is-- sa yo Cloud9 kont pa pral ekspire. Ou se akeyi yo sÃ¨vi ak yo Tinker ak. Li nan nivo a gratis nan sÃ¨vis. Reyalize ke, si lÃ¨ y ap kreye vorkspas ou, ou te fÃ¨ li piblik, ki fÃ¨ vle di ke nenpÃ²t moun ki sou la entÃ¨nÃ¨t ka wÃ¨ sa ki w ap tape. Se konsa, petÃ¨t jis konsidere pa anbarasan tÃ¨t ou si w ap mete sou sit wÃ¨b premye fwa ou paj yo deyÃ² piblikman aksidantÃ¨lman, men pesonn pa t k ap pase yo konnen yo gade gen de tout fason. 

Apre sa, two-- kite m 'jete moute sa a URL kÃ²m byen, espesyalman si w te vini nan jodi a yon ti kras mwens konfÃ²tab pase lÃ²t moun, fin sa ki tout bagay sa a vle di. Reyalize ke pi plis nan videyo sa a, ki se tou de yon bon fason yo tonbe nan dÃ²mi epi tou li ri pandan y ap fÃ¨ sa, tou te gen yon anpil nan societally enteresan ak sekirite-ki enpÃ²tan diskisyon ladan l 'soti nan John Oliver, kwake yon komedyen. 

Men, si pa gen okenn kesyon pi lwen, ki pote nou nan resepsyon an. Se konsa, poukisa pa mwen vire sou mizik la. Ta dwe gen bwason ak ti goute deyÃ². Mwen kontan yo melanje pou osi lontan ke jan ta renmen, reponn kesyon plis yon sÃ¨l-on-one. Men, otreman, w ap akeyi yo pran an nan nenpÃ²t ki pwen, epi n ap wÃ¨ nou ankÃ² demen maten pou yon ti jan pi plis. Tout dwa, mÃ¨si.