Bilo da ste novi u web industriji ili iskusan veteran, gledanje HTML izvora različitih web stranica je nešto što ćete vjerojatno učiniti mnogo puta tijekom vaše karijere.
Za one koji su novi u web dizajnu, gledanje izvornog koda web mjesta jedan je od najlakših načina da vidite kako se određene stvari rade kako biste mogli naučiti iz tog posla i početi koristiti određeni kôd ili tehnike u svom radu. Kao i svaki web dizajner koji rade danas, posebno onima koji su bili u njemu od ranih dana industrije, a to je sigurno kladiti se da vam oni kažu da su naučili HTML jednostavno pregledavajući izvor web stranica koje su vidjeli i koji su bili zainteresirani po. Uz čitanje knjiga izrade web stranica ili pohađanje stručnih skupova, gledanje izvornog koda web mjesta odličan je način za početnike da nauče HTML.
Više nego samo HTML
Jedna stvar koju trebate zapamtiti je da izvorne datoteke mogu biti vrlo komplicirane (i složeniji web mjesto koje pregledavate, složeniji je kod tog mjesta vjerojatno). Uz HTML strukturu koja čini stranicu koju pregledavate, bit će i CSS (kaskadni stilski listovi) koji diktiraju vizualni izgled tog web mjesta. Osim toga, mnoge web stranice danas će uključivati skriptne datoteke uključene zajedno s HTML-om.
U stvari, vjerojatno će biti uključene više skriptnih datoteka, a svaka od njih potiče različite aspekte web mjesta. Iskreno, izvorni kod web-lokacije može se činiti neodoljiv, pogotovo ako ste novi. Nemojte se frustrirati ako ne možete shvatiti što se odmah događa s tom web lokacijom. Pregled HTML izvora samo je prvi korak u tom procesu. Uz malo iskustva, početi ćete bolje razumjeti kako se svi ti dijelovi uklapaju kako bi stvorili web stranicu koju vidite u svom pregledniku. Kada se upoznate s kodom, moći ćete saznati više od njega i neće vam izgledati tako zastrašujuće.
Pa kako vidite izvorni kôd web stranice? Evo korak-po-korak upute za to pomoću preglednika Google Chrome.
Korak po korak upute
-
Otvori Web preglednik Google Chrome (ako nemate instaliran Google Chrome, to je besplatno preuzimanje).
-
Idite na stranicu web stranicu koju želite pregledati.
-
Desni klik stranica i pogledajte izbornik koji će se pojaviti. Iz tog izbornika kliknite Pogledaj izvor stranice.
-
Izvorni kôd za tu stranicu sada će se pojaviti kao nova kartica u pregledniku.
-
Možete upotrijebiti i tipkovničke prečace CTRL + U na računalu da biste otvorili prozor s prikazanim izvornim kodom web mjesta. Na Macu taj prečac je Command + Opcija + U.
Razvojni alati
Osim jednostavnih Pogledaj izvor stranice sposobnosti koje Google Chrome nudi, također možete iskoristiti svoje izvrsne alate za razvojne programere kako biste dublje iskoristili na web-lokaciju. Ti će vam alati omogućiti da ne samo da vidite HTML, već i CSS koji se odnosi na elemente prikaza u tom HTML dokumentu.
Da biste upotrebljavali Chromeove alate za razvojne programere:
-
Otvorena Google Chrome.
-
Idite na web stranicu koju želite pregledati.
-
Kliknite gumb ikona s tri retka u gornjem desnom kutu prozora preglednika.
-
Iz izbornika zadržite pokazivač miša iznad Više alata i zatim kliknite Razvojni alati na izborniku koji će se pojaviti.
-
Otvorit će se prozor koji prikazuje izvorni HTML kôd s lijeve strane okna i pripadajućeg CSS-a s desne strane.
-
Alternativno, ako desnom tipkom kliknete element na web stranici i odaberite Pregledati iz izbornika koji će se prikazati pojavit će se alati za razvojne programere Chromea, a točan element koji ste odabrali bit će istaknut u HTML-u s odgovarajućim CSS prikazanim s desne strane. Ovo je super korisno ako želite saznati više o tome kako je izrađen određeni dio web mjesta.
Je li izvorni kod pregleda pravni?
Tijekom godina imali smo mnogo novih web dizajnera pitanje je li prihvatljivo gledati izvorni kod web stranice i koristiti ga za njihovo obrazovanje i naposljetku za posao koji rade. Dok kopirate kôd web-lokacije za veleprodaju i šaljete ga kao svoju na web-lokaciji, zasigurno nije prihvatljivo, upotrebljavajući taj kôd kao odskočnu dasku za učenje je zapravo koliko je napredaka napravljeno u ovoj industriji.
Kao što smo spomenuli na početku ovog članka, bilo bi teško pronaći profesionalnog web stručnjaka koji još nije naučio nešto gledanjem izvora web mjesta! Da, gledanje izvornog kôda stranice legalno je. Korištenje tog koda kao resursa za izgradnju sličnog je također u redu. Uzimanje koda kao-je i njegovo gašenje kao posao gdje se počinjete naići na probleme.
Na kraju, web profesionalci uče jedni od drugih i često poboljšavaju posao koji vide i nadahnjuju, stoga ne ustručavajte se pogledati izvorni kôd web mjesta i upotrijebiti ga kao alat za učenje.
