Indiferent dacă sunteți nou în industria web sau un veteran experimentat, vizualizarea sursei HTML a diferitelor pagini Web este ceva care este posibil să faceți de mai multe ori pe parcursul carierei.
Pentru cei care sunt noi în designul web, vizualizarea codului sursă al site-ului este una dintre cele mai ușoare modalități de a vedea cum se fac anumite lucruri, astfel încât să puteți învăța din acea muncă și să începeți să utilizați anumite coduri sau tehnici în propria dvs. activitate. Ca orice designer de web care lucrează astăzi, în special cei care au fost la el de la primele zile ale industriei și este un pariu sigur că ei vă spun că au învățat HTML pur și simplu prin vizionarea sursei paginilor web pe care le-au văzut și au fost intrigate de. În plus față de citirea cărților de design web sau participarea la conferințe profesionale, vizualizarea codului sursă al site-ului este o modalitate excelentă pentru începători de a învăța HTML.
Mai mult decât HTML
Un lucru de reținut este faptul că fișierele sursă pot fi foarte complicate (și cu cât este mai complex pe site-ul pe care îl vizualizați, cu atât mai complex va fi codul site-ului respectiv). În plus față de structura HTML care alcătuiesc pagina pe care o vizualizați, vor exista, de asemenea, CSS (foi de stil cascadă) care dictează aspectul vizual al acelui site. În plus, multe site-uri de astăzi vor include fișiere de script incluse împreună cu codul HTML.
Există probabil mai multe fișiere script incluse, de fapt, fiecare alimentând diferite aspecte ale site-ului. Sincer, codul sursă al site-ului poate părea copleșitor, mai ales dacă sunteți nou în a face acest lucru. Nu fi frustrat dacă nu puteți afla imediat ce se întâmplă cu site-ul respectiv. Vizionarea sursei HTML este doar primul pas în acest proces. Cu o mică experiență, veți începe să înțelegeți mai bine cum se potrivesc toate aceste piese împreună pentru a crea site-ul pe care îl vedeți în browser. Pe măsură ce vă familiarizați mai mult cu codul, veți putea afla mai multe din el și nu vă va părea atât de deranjant.
Deci, cum vedeți codul sursă al unui site web? Iată instrucțiunile pas cu pas pentru a face acest lucru folosind browserul Google Chrome.
Instrucțiuni pas cu pas
-
Deschide Browser web Google Chrome (dacă nu aveți instalat Google Chrome, aceasta este o descărcare gratuită).
-
Navigați la pagina web pe care doriți să o examinați.
-
Click dreapta pagina și căutați meniul care apare. Din meniul respectiv, faceți clic pe Vezi sursa paginii.
-
Codul sursă pentru acea pagină va apărea acum ca o filă nouă în browser.
-
Alternativ, puteți utiliza și comenzile rapide de la tastatură de la CTRL + U pe un PC pentru a deschide o fereastră cu codul sursă al unui site afișat. Pe un Mac, această comandă rapidă este Comandă + Opțiune + U.
Instrumente de dezvoltare
În plus față de simplu Vezi sursa paginii capacitatea oferită de Google Chrome, puteți profita de avantajele excelentelor instrumente de dezvoltare pentru a sapa chiar mai adânc într-un site. Aceste instrumente vă vor permite nu numai să vedeți codul HTML, ci și CSS-ul care se aplică vizualizării elementelor din documentul HTML.
Pentru a utiliza instrumentele de dezvoltare ale dezvoltatorului Chrome:
-
Deschis Google Chrome.
-
Navigheaza catre pagina web pe care doriți să o examinați.
-
Apasă pe pictogramă cu trei rânduri în colțul din dreapta sus al ferestrei browserului.
-
Din meniu, treceți peste Mai multe unelte apoi faceți clic pe Instrumente de dezvoltare din meniul care apare.
-
Aceasta va deschide o fereastră care va afișa codul sursă HTML din stânga panoului și CSS-ul asociat din dreapta.
-
Alternativ, dacă faceți clic dreapta un element dintr-o pagină web și selectați Inspecta din meniul care apare, vor apărea instrumentele de dezvoltator ale Chrome și elementul exact pe care l-ați selectat va fi evidențiat în HTML cu CSS corespunzător afișat în partea dreaptă. Acest lucru este foarte util dacă doriți să aflați mai multe despre cum a fost creată o anumită piesă a unui site.
Este legală vizualizarea codului sursă?
De-a lungul anilor, am avut mulți designeri noi care se întreabă dacă este acceptabil să vizualizăm codul sursă al site-ului și să-l folosim pentru educația lor și, în cele din urmă, pentru munca pe care o fac. În timp ce copiați un cod de site-ul en-gros și treceți-l ca pe propriul dvs. pe un site este cu siguranță inacceptabil, folosiți acel cod ca o rampă de lansare de învățat de fapt, câte avansuri sunt făcute în această industrie.
După cum am menționat la începutul acestui articol, ați fi greu să găsiți un profesionist web profesionist astăzi, care nu a învățat ceva prin vizionarea sursei unui site! Da, vizualizarea codului sursă al unui site este legală. Utilizarea acelui cod ca resursă pentru a construi ceva similar este, de asemenea, bine. Luând codul ca-este și trecând-l ca munca ta este în cazul în care începeți să întâmpinați probleme.
În cele din urmă, profesioniștii web învață unul de celălalt și adesea îmbunătățesc munca pe care o văd și sunt inspirați, deci nu ezitați să vizualizați codul sursă al site-ului și să-l utilizați ca un instrument de învățare.
