Niezależnie od tego, czy jesteś nowicjuszem w branży internetowej, czy doświadczonym weteranem, przeglądanie źródeł HTML różnych stron internetowych jest czymś, co prawdopodobnie będziesz robić wiele razy w swojej karierze. Większość przeglądarek umożliwia łatwe przeglądanie źródła; Chrome nie jest inny.
Przeglądanie kodu źródłowego witryny jest jednym z najłatwiejszych sposobów wyciągnięcia wniosków z tej pracy i rozpoczęcia korzystania z określonego kodu lub technik w pracy. Oprócz czytania książek o projektowaniu stron internetowych lub uczestniczenia w profesjonalnych konferencjach, przeglądanie kodu źródłowego witryny jest doskonałym sposobem na naukę języka HTML dla początkujących.
Wyświetl kod źródłowy w przeglądarce Chrome
Jak więc przeglądasz kod źródłowy strony internetowej? Oto instrukcje krok po kroku, jak to zrobić za pomocą przeglądarki Google Chrome.
-
Otwórz Przeglądarka internetowa Google Chrome (jeśli nie masz zainstalowanej przeglądarki Google Chrome, jest to bezpłatne pobieranie).
-
Nawiguj do stronę internetową, którą chcesz sprawdzić.
-
Kliknij prawym przyciskiem myszy Strona i spójrz na wyświetlone menu. W tym menu kliknij Wyświetl źródło strony.
-
Kod źródłowy tej strony pojawi się teraz jako nowa karta w przeglądarce.
-
Alternatywnie możesz także użyć skrótów klawiaturowych programu CTRL + U na komputerze, aby otworzyć okno z wyświetlonym kodem źródłowym witryny. Na komputerze Mac ten skrót to Command + Option + U.
Użyj narzędzi programistycznych Chrome
Oprócz prostej możliwości wyświetlania źródła strony, którą oferuje Google Chrome, możesz także skorzystać z ich doskonałych narzędzi programistycznych, aby jeszcze bardziej zagłębić się w witrynę. Te narzędzia pozwolą Ci nie tylko zobaczyć HTML, ale także CSS, który ma zastosowanie do przeglądania elementów w tym dokumencie HTML.
Aby skorzystać z narzędzi programistycznych Chrome:
-
Załóż Google Chrome.
-
Nawigować do stronę internetową, którą chcesz sprawdzić.
-
Wybierz menu z trzema kropkami w prawym górnym rogu okna przeglądarki.
-
W menu najedź na Więcej narzędzi a następnie wybierz Narzędzia deweloperskie w menu, które się pojawi.
-
Otworzy się okno z kodem źródłowym HTML po lewej stronie panelu i powiązanym CSS po prawej.
-
Alternatywnie, jeśli klikniesz prawym przyciskiem myszy element na stronie internetowej i wybierz Sprawdzać z menu, które się pojawi, pojawią się narzędzia programistyczne Chrome i podświetlą konkretną część wybraną w kodzie HTML z odpowiednim CSS pokazanym po prawej stronie. Jest to bardzo pomocne, jeśli chcesz dowiedzieć się więcej o konkretnym fragmencie witryny.
Czy przeglądanie kodu źródłowego jest legalne?
Przez lata wielu nowych projektantów stron internetowych zadawało sobie pytanie, czy można przeglądać kod źródłowy witryny i wykorzystywać go do swojej edukacji, a ostatecznie do wykonywanej pracy. Kopiowanie kodu witryny hurtowo i przekazywanie go jako własnego na stronie internetowej jest z pewnością niedopuszczalne, jednak używanie tego kodu jako trampoliny do nauki jest w rzeczywistości liczbą postępów w tej branży.
Jak wspomnieliśmy na początku tego artykułu, trudno byłoby znaleźć dziś pracującego specjalistę od stron internetowych, który nie nauczyłby się czegoś, przeglądając źródło witryny! Tak, zobaczenie kodu źródłowego witryny jest legalne. Używanie tego kodu jako zasobu do tworzenia czegoś podobnego jest również bezpieczne. Biorąc kod tak, jak jest i przekazując go w trakcie pracy, zaczynasz napotykać problemy.
W końcu specjaliści internetowi uczą się od siebie nawzajem i często ulepszają pracę, którą widzą i którą inspirują, dlatego nie wahaj się przeglądać kodu źródłowego witryny i używać go jako narzędzia do nauki.
Więcej niż tylko HTML
Należy pamiętać, że pliki źródłowe mogą być bardzo skomplikowane (a im bardziej złożona jest przeglądana witryna, tym bardziej złożony może być jej kod). Oprócz struktury HTML, która tworzy stronę, będzie też CSS (kaskadowe arkusze stylów), które decydują o wyglądzie strony. Ponadto wiele dzisiejszych witryn internetowych będzie zawierało pliki skryptów dołączone wraz z kodem HTML.
Prawdopodobnie zawiera wiele plików skryptów; w rzeczywistości każdy z nich zasila różne aspekty witryny. Szczerze mówiąc, kod źródłowy witryny może wydawać się przytłaczający, zwłaszcza jeśli jesteś nowicjuszem. Nie denerwuj się, jeśli nie możesz od razu dowiedzieć się, co się dzieje z tą witryną. Przeglądanie źródła HTML to tylko pierwszy krok w tym procesie. Z niewielkim doświadczeniem zaczniesz lepiej rozumieć, jak te wszystkie elementy pasują do siebie, tworząc witrynę internetową, którą widzisz w przeglądarce. Gdy lepiej zaznajomisz się z kodem, będziesz mógł dowiedzieć się więcej z niego i nie będzie to dla ciebie tak zniechęcające.