Jak wyświetlić źródło strony w Chrome, Firefox, Safari | We.Inc
Skróty klawiszowe do podglądu źródła HTML strony w Chrome, Firefox i Safari, czym różni się to od Zbadaj, co wolno wykorzystać oraz podgląd, który podsumuje wklejony kod HTML.
Jak wyświetlić źródło strony
W Chrome i Firefox na Windows lub Linux naciśnij Ctrl+U. Na Macu Chrome używa Command+Option+U, a Firefox Command+U. Możesz też kliknąć prawym przyciskiem pusty fragment strony i wybrać Wyświetl źródło strony. W Safari trzeba najpierw włączyć funkcje dla programistów w Ustawieniach, w sekcji Zaawansowane.
Skróty do wyświetlania źródła według przeglądarki (strony pomocy producentów)
Przeglądarka
Windows lub Linux
Mac
Chrome
Ctrl+U
Command+Option+U
Firefox
Ctrl+U
Command+U
Safari
Niedostępne
Najpierw włącz Pokaż funkcje dla programistów (Ustawienia, Zaawansowane)
Każda z powyższych
Kliknij stronę prawym przyciskiem, potem Wyświetl źródło strony
Kliknij stronę prawym przyciskiem (lub z klawiszem Control)
Źródło strony to plik HTML wysłany przez serwer, zanim uruchomiły się jakiekolwiek skrypty. Pokazuje, jakiego tytułu i opisu używa strona, jakie tagi śledzące ładuje i gdzie znajdują się jej obrazy. Dlatego to najszybszy sposób, by sprawdzić własną stronę po edycji albo zobaczyć, jak zbudowana jest strona, która Ci się podoba.
Otwórz stronę, którą chcesz przeczytać, i naciśnij skrót dla swojej przeglądarki.
Użyj wyszukiwania w przeglądarce (Ctrl+F lub Command+F), aby przejść do tego, czego potrzebujesz, na przykład <title lub og:image.
Aby łatwiej to przeanalizować, skopiuj całość i wklej do podglądu powyżej.
Aby zobaczyć stronę w wersji po uruchomieniu skryptów, użyj zamiast tego Zbadaj.
Firefox pozwala linkować do pojedynczej linii: dodaj #line100 na końcu adresu view-source:.
W Firefox zaznacz tekst, kliknij prawym przyciskiem i wybierz Pokaż źródło zaznaczenia, aby zobaczyć tylko ten fragment.
Strony zbudowane na frameworku JavaScript często mają niemal puste źródło. Zbadaj pokazuje to, co zbudowały skrypty.
Sprawdzaj własne strony po każdej zmianie wyglądu: brak tytułu lub opisu od razu widać w źródle.
Najczęściej zadawane pytania
Czym różni się Wyświetl źródło strony od Zbadaj?
Wyświetl źródło strony pokazuje oryginalny plik z serwera. Zbadaj otwiera narzędzia dla programistów, w których, jak wyjaśnia dokumentacja Chrome, drzewo DOM pokazuje bieżący stan strony, różniący się od HTML, gdy JavaScript doda, usunie lub zmieni jej części.
Czy mogę skopiować kod HTML ze strony internetowej?
Możesz go czytać i się z niego uczyć. Ponowne wykorzystanie to inna sprawa: US Copyright Office podaje, że oryginalne teksty, grafiki i zdjęcia na stronie internetowej mogą być chronione. Prawo autorskie nie obejmuje idei, systemów ani metod, więc naucz się techniki i napisz własną wersję. To informacja ogólna, a nie porada prawna.
Dlaczego brakuje opcji wyświetlania źródła?
W Safari pozostaje ukryta, dopóki nie zaznaczysz Pokaż funkcje dla programistów w Ustawienia, Zaawansowane. Na zarządzanym komputerze służbowym lub szkolnym administrator mógł wyłączyć narzędzia dla programistów; zapytaj go.
Czy mogę zobaczyć kod serwera strony, na przykład PHP lub zapytania do bazy danych?
Nie. Serwer wykonuje ten kod i wysyła tylko wynikowy HTML, CSS i JavaScript. Nic w źródle strony nie zdradza, co go wygenerowało.
Czego szukać w źródle własnej strony
Na górze, wewnątrz <head>, znajdziesz <title> i <meta name="description">, czyli tekst pokazywany w wynikach wyszukiwania. Niżej są tagi og:, które sterują podglądem linków w mediach społecznościowych, oraz skrypty analityki lub menedżerów tagów.
Jeśli zmiana wprowadzona w edytorze strony się tu nie pojawia, strona może być w pamięci podręcznej. Przeładuj ją raz i sprawdź ponownie.
Wykorzystywanie tego, co znajdziesz
Prawo autorskie chroni sposób wyrażenia czegoś, a nie stojącą za tym ideę. Pomysł na układ lub popularna technika są do wolnego użytku; cudze zdjęcia, teksty i ilustracje już nie, chyba że pozwala na to ich licencja.
Wyświetl źródło, Zbadaj i view-source: w porównaniu
Trzy sposoby na odczytanie kodu strony
Metoda
Pokazuje
Edycja
Najlepsze do
Wyświetl źródło strony
HTML wysłany przez serwer
Nie
Sprawdzania tytułów, metatagów i skryptów śledzących
Zbadaj (narzędzia dla programistów)
Działającą stronę po uruchomieniu skryptów
Tak, tymczasowo
Znajdowania kodu, który rysuje przycisk lub obraz
view-source: w pasku adresu (Firefox)
To samo co Wyświetl źródło strony
Nie
Linkowania do linii, na przykład #line100
Przydatne wyszukiwania w źródle strony
Naciśnij Ctrl+F (Command+F na Macu) w karcie ze źródłem i wyszukaj poniższe frazy, aby znaleźć najważniejsze części.
Czego szukać
Każda linia to coś do wpisania w wyszukiwanie, a po niej to, co pozwala znaleźć.
Podgląd źródła strony
Wklej HTML skopiowany z Wyświetl źródło strony. Zostaje w Twojej przeglądarce; nic nie jest przesyłane ani pobierane.