Gdy zaczynasz optymalizować swoją stronę, najważniejszą rzeczą, którą prawdopodobnie chcesz wiedzieć, jest aktualny całkowity rozmiar strony. Jest to punkt wyjścia prawie wszystkich optymalizacji stron internetowych.
Całkowity rozmiar strony jest wskaźnikiem wielu rzeczy, zwłaszcza czasu renderowania strony internetowej. W większości przypadków chcesz renderować stronę tak szybko, jak to możliwe, zwykle w ciągu 2 lub 3 sekund. Im większy rozmiar strony, tym dłuższy czas renderowania w większości przypadków.
Umożliwia także zmniejszenie lub zoptymalizowanie wykorzystywanej przepustowości. Jeśli płacisz za przepustowość, liczy się każdy bajt, zwłaszcza jeśli jest to witryna o dużym natężeniu ruchu. Większość hostów internetowych ma nieograniczony ruch w pakietach cenowych, więc może nie być już problemem. Pamiętaj jednak, że każdy dodatkowy bajt zjada trochę czasu i zasobów, bez względu na to, jak mały jest koszt.
Całkowity rozmiar strony zawiera cały kod na stronie i wszystkie dołączone zasoby, które są wymagane do renderowania strony w przeglądarce. Obejmuje to HTML, JavaScript, CSS, obrazy, filmy i wszystkie inne media i zasoby, do których się odwołuje i które są używane na stronie.
Przeglądarka internetowa Chrome
Najprostszym sposobem zmierzenia rozmiaru strony jest użycie przeglądarki internetowej. Jeśli korzystasz z przeglądarki Google Chrome lub dowolnej z powiązanych przeglądarek (takich jak Vivaldi, Opera), możesz użyć narzędzi programistycznych wbudowanych w przeglądarkę.
- Kliknij przycisk Dostosuj (przycisk z trzema kropkami) na pasku menu
- Wybierz Więcej narzędzi i kliknij Narzędzia programisty (zamiast tego możesz użyć skrótu klawiaturowego Ctrl + Shift + I )
- Kliknij kartę Sieć
- Załaduj (lub ponownie załaduj) stronę, którą chcesz zmierzyć, w odpowiedniej karcie przeglądarki
Zakładka Sieć w Narzędziach dla programistów powinna teraz wyświetlać wszystkie potrzebne informacje. Jeśli spojrzysz na dół karty, zobaczysz ogólne dane dotyczące strony, w tym liczbę żądań, rozmiar strony i czas ładowania.
Poniżej znajduje się zrzut ekranu losowej strony z Amazon. Jak widać na zrzucie ekranu, było 192 całkowitych żądań, a łączny rozmiar strony wynosił 9,7 MB.
Również w zakładce Sieć zobaczysz pełną tabelę, w której pokazane są wszystkie żądania wysłane do serwera oraz rozmiar każdego zasobu. Możesz również zobaczyć czas ładowania (lub pobierania) każdego z tych zasobów. Możesz sortować kolumny Rozmiar i Czas w tabeli, aby łatwo znaleźć „ głodne” zasoby. Teraz z danymi w ręku możesz zacząć optymalizować stronę.
Chociaż nie jest to całkowicie konieczne, należy ponownie załadować stronę kilka razy, aby zobaczyć, jak się zachowuje i czy istnieją jakieś zauważalne zmiany między odświeżeniami. Czasami nieefektywne funkcje javascript mogą zniekształcać wartości. Jednak całkowity rozmiar strony powinien pozostać taki sam.
Spróbuj także wyłączyć pamięć podręczną. Możesz łatwo wyłączyć pamięć podręczną na górze panelu. Zobaczysz opcję Wyłącz pamięć podręczną na górnym pasku narzędzi. Wybierz tę opcję, aby upewnić się, że otrzymujesz spójny raport dla przeładowań.
Przeglądarka internetowa Firefox
Jeśli używasz Mozilla Firefox, możesz użyć jednego z dwóch narzędzi: Web Developer Tool lub Firebug rozbudowa. Oba są dość podobne i podobne do narzędzia w przeglądarkach Chrome. Gdy zrozumiesz, jak działa jedno narzędzie, możesz łatwo znaleźć drogę do innych.
Web Developer Tool jest wbudowany w przeglądarki Firefox, podczas gdy Firebug to rozszerzenie, które można zainstalować jako rozszerzenie.
Możesz otworzyć Web Developer Tool w Firefoksie za pomocą skrótu klawiaturowego Ctrl + Shift + I. Możesz użyć narzędzia Ctrl + Shift + Q, jeśli chcesz bezpośrednio otworzyć kartę sieci. Możesz także otworzyć narzędzie z menu o nazwie Web Developer .
- Kliknij pozycję menu Narzędzia
- Wybierz Web Developer
- Wybierz pozycję Sieć
Po otwarciu narzędzia kliknij kartę Sieć , jeśli nie jest jeszcze wybrana. Teraz załaduj stronę, którą chcesz przeanalizować na karcie, a powinieneś podać szczegółowe dane dotyczące strony.
Informacje o poszczególnych stronach znajdziesz po prawej stronie górnego paska narzędzi (w zależności od opcji może znajdować się po prawej stronie u dołu). Powinieneś posortować tabelę, aby znaleźć zasoby, których ładowanie trwa zbyt długo. Jak widać ta strona miała 172 żądania i łączną wielkość strony 9679 Kb.
Firebug jest bardzo popularnym rozszerzeniem do tworzenia stron internetowych i działa w podobny sposób jak Web Developer Tool w kontekście analizy stron. Nie będę wchodził w szczegółowy opis tego, jak to działa, ale powinieneś znaleźć wymagane informacje o rozmiarze strony w zakładce Sieć . Działa bardzo podobnie do narzędzi, które omówiliśmy.
Jeśli jeszcze nie używasz Firebug, to prawdopodobnie jest to przesada, aby go zainstalować, aby znaleźć rozmiar strony.
Zasoby online
Istnieje kilka analizatorów stron internetowych, za pomocą których można znaleźć rozmiar strony. Wiele popularnych narzędzi dokonuje dogłębnej analizy, a nie tylko pokazuje rozmiar strony. Te analizatory online są również przydatne tylko wtedy, gdy masz publiczny adres URL, tj. już opublikowałeś stronę. W większości przypadków chcesz analizować stronę, tak jak ją tworzysz, co sprawia, że narzędzia oparte na przeglądarce są znacznie bardziej przydatne.
Istnieje kilka narzędzi / stron internetowych, które wykonują tylko rozmiar strony, ale najpierw należy sprawdzić, co dokładnie zawierają w obliczeniu rozmiaru strony. Odkryłem, że niektóre nie zawierają żadnych linków osób trzecich, takich jak Adsense, Disqus itp.
Oto kilka stron internetowych, które możesz wypróbować: Małe narzędzia SEO i Zdobądź rangę .
Powinieneś być w stanie znaleźć więcej za pomocą prostego wyszukiwania google. Szczęśliwy optymalizacja !!