Kaip peržiūrėti "HTML" šaltinį "Google Chrome"

Sužinokite, kaip svetainė buvo pastatyta peržiūrint jos šaltinio kodą

Kai aš pirmą kartą pradėjausi savo karjerą kaip interneto dizainerį, aš labai daug sužinojo, peržiūrėdamas kitų internetinių dizainerių, kuriuos žavėjau, darbą. Aš ne vienintelis. Nesvarbu, ar esate naujokas žiniatinklio pramonėje, ar patyrusiems veteranams, peržiūrėję skirtingų tinklalapių HTML šaltinį , jūs tikriausiai atliksite daugybę kartų per savo karjerą.

Tiems, kurie yra nauji interneto dizainui, svetainės šaltinio kodo peržiūra yra vienas iš paprasčiausių būdų, kaip pamatyti, kaip tam tikri dalykai daromi, kad galėtumėte išmokti iš šio darbo ir pradėti savo darbą pritaikyti tam tikrą kodą ar technologijas. Kaip ir bet kuris interneto dizaineris, dirbantis šiandien, ypač tiems, kurie jau dirbo nuo pat pirmųjų pramonės dienų, ir tai yra saugus statymas, kad jie jums pasakytų, kad jie išmoko HTML paprasčiausiai peržiūrėdami interneto puslapių šaltinį, kurį jie matė ir buvo įžvalgūs pagal. Be žiniatinklio dizaino knygų ar profesinių konferencijų lankymo , svetainės šaltinio kodo peržiūra yra puikus būdas pradedantiesiems mokytis HTML.

Daugiau negu tik HTML

Vienas dalykas, kurį reikia prisiminti, yra tai, kad šaltinio failai gali būti labai sudėtingi (ir kuo sudėtingesnė svetainė, kurią peržiūrėjote, tuo sudėtingesnė, kad svetainės kodas greičiausiai bus). Be HTML struktūros, kuri yra puslapio, kurį peržiūrite, taip pat bus CSS (kaskadiniai stiliaus lapai), kurie diktuoja šios svetainės išvaizdą. Be to, šiandien daugelyje svetainių bus įtraukti scenarijų failai kartu su HTML.

Tikriausiai gali būti keli scenarijų failai, iš tikrųjų kiekvienas iš jų turi įtakos skirtingiems svetainės aspektams. Atvirai sakant, svetainės šaltinio kodas gali atrodyti nepaprastai svarbus, ypač jei esate naujokas. Negalima nusivylti, jei negalite iš karto sužinoti, kas vyksta šioje svetainėje. HTML šaltinio peržiūra yra tik pirmas žingsnis šiame procese. Turėdami šiek tiek patirties, jūs pradėsite geriau suprasti, kaip visi šie gabalai suderinami, norint sukurti svetainę, kurią matote naršyklėje. Kai susipažinsite su kodu, galėsite daugiau sužinoti apie tai ir neatrodo, kad tai bauginantis jums.

Taigi, kaip matote svetainės šaltinio kodą? Štai po žingsnio pateikiamos instrukcijos, kaip tai padaryti naudodami "Google Chrome" naršyklę.

Žingsnis po žingsnio instrukcijos

  1. Atidarykite " Google Chrome" žiniatinklio naršyklę (jei neturite įdiegto "Google Chrome", tai nemokamas atsisiuntimas).
  2. Eikite į tinklalapį, kurį norėtumėte išnagrinėti .
  3. Dešiniuoju pelės mygtuku spustelėkite puslapį ir pažiūrėkite į pateiktą meniu. Šiame meniu spustelėkite Peržiūrėti puslapio šaltinį .
  4. Šio puslapio šaltinis bus rodomas kaip naujas skirtukas naršyklėje.
  5. Arba galite naudoti CTRL + U spartieji klavišai kompiuteryje, kad atidarytumėte langą su rodomu svetainės šaltinio kodu. "Mac" programoje ši santrumpa yra Command + Alt + U.

Kurejo irankiai

Be paprasto " View" puslapio šaltinio galimybės, kurią siūlo "Google Chrome", taip pat galite pasinaudoti puikiais "Developer Tools", kad iškiltų dar giliau į svetainę. Šios priemonės leis jums ne tik pamatyti HTML, bet ir CSS, kuris taikomas peržiūrėti šiame HTML dokumente esančius elementus.

Norėdami naudoti "Chrome" kūrėjų įrankius:

  1. Atidarykite " Google Chrome" .
  2. Eikite į tinklalapį, kurį norėtumėte išnagrinėti .
  3. Viršutiniame dešiniajame naršyklės lango kampe spustelėkite piktogramą su trimis eilutėmis .
  4. Iš meniu nuveskite žymeklį virš Daugiau įrankių ir spustelėkite skirtuke esantį meniu " Kūrėjo įrankiai ".
  5. Bus atidarytas langas, rodantis HTML šaltinio kodą kairėje pusėje ir atitinkamą CSS dešinėje.
  6. Arba, jei dešiniuoju pelės klavišu spustelėsite elementą tinklalapyje ir pasirinktame meniu pasirinkite Apžiūrinėti , pasirodys "Chrome" kūrėjo įrankiai, o pasirinktas elementas bus pažymėtas HTML su atitinkamu CSS parodytu dešinėje. Tai labai naudinga, jei norite sužinoti daugiau apie tai, kaip sukurta viena konkreti svetainės dalis.

Ar teisinio šaltinio kodo peržiūra?

Per daugelį metų aš turėjau daug naujų interneto dizainerių, klausdamas, ar yra priimtina peržiūrėti svetainės šaltinio kodą ir naudoti jį jų mokymuisi, o galiausiai ir už darbą, kurį jie atlieka. Nors kopijuoti svetainės kodą didmenine ir išbraukiant jį kaip savo svetainėje, tikrai nėra priimtina, naudojant šį kodą kaip tramplinas, iš kur mokytis, iš tikrųjų yra tai, kiek šioje srityje pasiekta pažanga.

Kaip minėjau šio straipsnio pradžioje, jums bus sunku rasti šiandien dirbančio žiniatinklio profesionalo, kuris ką nors išmoko žiūrėdamas svetainės šaltinį! Taip, svetainės šaltinio kodo peržiūra yra teisėta. Taip pat gerai, naudodamas šį kodą kaip šaltinį kuriant kažką panašaus. Įveskite kodą taip, kaip jis yra, ir išmeskite jį, nes jūsų darbas yra tas, kuriame jūs pradedate susidurti su problemomis.

Galų gale, žiniatinklio specialistai mokosi vienas iš kito ir dažnai tobulina darbą, kurį jie mato ir įkvėpė, todėl nedvejodami perskaitykite svetainės šaltinio kodą ir naudokite jį kaip mokymosi priemonę.