Sprawdzanie rozmiaru strony pod kątem SEO: kompletny przewodnik
Dowiedz się, jak sprawdzać rozmiar strony pod kątem SEO, w tym wskazówki, narzędzia, sprawdzone metody i dlaczego jest to ważne. Dzisiejsze prędkości internetu są nie z tego świata. Według Statista średnia prędkość pobierania ze stacjonarnego łącza szerokopasmowego wynosi 105,15 Mb/s, a mobilnego 55,95 Mb/s.
Mimo to rozdęcie kodu, usterki i inne problemy mogą prowadzić do rozmiarów stron, które stają się krytycznym punktem dla SEO. Nie uwierzysz, jakie rozmiary stron napotkałem podczas audytów SEO , największy to 100 MB (nie żartuję). Istnieje kilka kroków, które możesz podjąć, aby zmniejszyć rozmiar strony, ale najpierw musisz określić rozmiar strony.
Musimy również przyjrzeć się Core Web Vitals i temu, jak strona pasuje do wskaźników Google. W tym przewodniku znajdziesz wszystko, czego potrzebujesz, aby zrozumieć i sprawdzić rozmiar strony, a następnie ją zoptymalizować.
Ogólne zasady dotyczące rozmiaru strony
Najlepiej byłoby, gdyby rozmiar strony HTML DOM wynosił około 100 kb lub mniej, w zależności od Twojej niszy. Strony mogą być większe w niektórych niszach; na przykład w e-commerce często zdarza się, że strony o wielkości około 150-200 kb, w zależności od tego, ile zdjęć produktów znajduje się na stronie. Nie chcesz stać się zbyt duży, ponieważ wtedy zaczynasz negatywnie wpływać na wrażenia użytkownika i możesz tracić możliwości uzyskania poprawy rankingu dzięki dobrym wynikom Core Web Vitals.
Jednak zmniejszenie rozmiaru strony bez dbałości o wrażenia użytkownika może spowodować, że Twoja strona nie będzie tak użyteczna jak Twoja konkurencja. Równowaga jest kluczem. Jeśli szukasz jakichkolwiek narzędzi do sprawdzania rozmiaru strony HTML , poniższe narzędzie w SEO Site Checkup jest dobrym narzędziem.
Problemy, które wpływają na rozmiar Twojej strony
CSS i JS
Gdy dołączasz domyślny CSS i JS, chcesz się upewnić, że optymalizujesz również ten kod pod kątem ładowania strony. Oznacza to upewnienie się, że wszystkie te pliki są odpowiednio zminimalizowane i upewnienie się, że nie zawierasz ogromnego rozrostu kodu. „Rozdęcie kodu” oznacza, że niepotrzebny kod znacznie zwiększa rozmiar strony, wpływając tym samym na szybkość strony. To samo można osiągnąć na różne sposoby. Chcesz uniknąć tych, które powodują problemy poprzez nadmierne kodowanie po stronie CSS i JS.
Oprócz zoptymalizowanego sposobu myślenia o kodowaniu, pliki CSS i JS wymagają procesu minifikacji. Proces minifikacji usuwa dodatkowe spacje i inne losowe artefakty kodu, które nie muszą tam być. Należy pamiętać, że minifikacja nie zmieni faktycznego kodowania — tylko artefakty kodowania. Twój umysł i kotlety programistyczne będą nadal potrzebne, aby osiągnąć ostateczną optymalizację kodu CSS i JS po stronie serwera.
HTML
Duży rozmiar drzewa DOM jest istotną przyczyną problemów z szybkością strony i może znacznie ją spowolnić. Wpływa to na takie rzeczy, jak wydajność sieci, wydajność ładowania, wydajność pamięci i wydajność środowiska wykonawczego, z których wszystkie mogą znacząco wpłynąć na ogólne ładowanie strony i wrażenia użytkownika Core Web Vitals. Twój proces rozwoju powinien obejmować pewien rodzaj alokacji zasobów w celu optymalizacji rozmiaru drzewa DOM.
Obrazy
Duże obrazy mogą negatywnie wpłynąć na rozmiar strony, zwłaszcza jeśli przeszkadzają w zadowoleniu użytkowników. Jeśli użytkownik musi czekać 5 minut na załadowanie obrazu o wielkości 15 MB, już go zgubiłeś. Dlatego ważne jest, aby uwzględnić fizyczny rozmiar piksela wraz z wymiarami obrazu podczas pracy nad kompresją obrazów.
Narzędzia do sprawdzania rozmiaru strony
Istnieje wiele narzędzi do sprawdzania rozmiaru strony. Dwa, które lubię to:
– Statystyki szybkości strony Google .
– Screaming Frog SEO Pająk.
Statystyki szybkości stron Google
Google Page Speed Insights to kluczowe narzędzie do identyfikowania problemów z rozmiarem strony, które mogą spowalniać ładowanie. Ponadto pomoże Ci odhaczyć pozycje na liście kontrolnej dla podstawowych wskaźników internetowych Google dotyczących rozmiaru strony.
Screaming Frog SEO Pająk
Możesz również sprawdzić rozmiar swojej strony za pomocą Screaming Frog SEO Spider, aby wykonać indeksowanie Twojej witryny. Po zakończeniu indeksowania wykonaj następujące czynności, aby sprawdzić rozmiar strony:
- Kliknij menu rozwijane w lewym górnym rogu.
- Wybierz HTML . Spowoduje to wyświetlenie tylko stron HTML, które zostały zindeksowane w Twojej witrynie.
- Następnie przewiń w prawo, aż zobaczysz numery rozmiaru strony
W ten sposób możesz sprawdzić rozmiar swojej strony za pomocą Screaming Frog SEO Spider.
Dlaczego sprawdzanie rozmiaru strony jest tak ważne?
Rozmiar strony jest kluczowym czynnikiem w SEO, ponieważ może znacząco wpłynąć na ogólną szybkość strony, wpływając zarówno na rankingi wyszukiwania, jak i wydajność.
Szybkość ładowania strony
Według Centrum wyszukiwarki Google :
„Przyspieszenie stron internetowych jest ważne — nie tylko dla właścicieli witryn, ale dla wszystkich użytkowników Internetu. Szybsze witryny sprawiają, że użytkownicy są zadowoleni, a w naszych wewnętrznych badaniach zauważyliśmy, że gdy witryna reaguje wolno, odwiedzający spędzają w niej mniej czasu.
Jednak szybsze witryny nie tylko poprawiają wrażenia użytkownika; ostatnie dane pokazują, że poprawa szybkości witryny zmniejsza również koszty operacyjne.
Podobnie jak my, nasi użytkownicy przywiązują dużą wagę do szybkości — dlatego zdecydowaliśmy się uwzględnić szybkość witryny w naszych rankingach wyszukiwania. Korzystamy z różnych źródeł, aby określić szybkość witryny w porównaniu z innymi witrynami”.
Prawie 70% konsumentów przyznaje, że szybkość strony wpływa na ich gotowość do zakupów w sklepie internetowym, a połowa stwierdziła, że byłaby skłonna zrezygnować z animacji i wideo, aby skrócić czas ładowania. A według Google, gdy czas ładowania strony wynosi od jednej sekundy do 10 sekund, prawdopodobieństwo odbicia się odwiedzającego witrynę mobilną wzrasta o 123% . Jak widać, przyspieszenie działania strony jest ważne – nie tylko dla wygody użytkownika, ale także dla rankingu w wyszukiwarkach.
Może pomóc obniżyć koszty hostingu
W zależności od dostawcy hostingu internetowego i jego planów hostingowych możesz zaoszczędzić na kosztach hostingu dzięki mniejszym rozmiarom plików stron. Mniejszy rozmiar strony przekłada się na niższą przepustowość (transfer plików), co może obniżyć koszty hostingu – szczególnie w przypadku dużych witryn.
Sprawdzone metody optymalizacji pod kątem rozmiaru strony
Zwróć uwagę na następujące sprawdzone metody, aby uzyskać najlepszą możliwą optymalizację rozmiaru strony w swojej witrynie:
Zoptymalizuj te obrazy
Tworzenie najlepszych, najbardziej zoptymalizowanych obrazów wymaga zaznaczenia następujących elementów na liście kontrolnej:
– Fizyczny rozmiar piksela.
– Ogólny rozmiar obrazu.
– Utrzymanie jakości obrazu.
Fizyczny rozmiar piksela odnosi się do gęstości pikseli obrazu. Nie ma znaczenia, czy obraz zostanie zmniejszony z 1600 x 1600 do 500 x 500, jeśli gęstość pikseli obrazu pozostanie taka sama. Nadal będziesz otrzymywać obrazy o rozmiarze pliku 1 MB, jeśli od tego zacząłeś. Aby zapewnić odpowiednią optymalizację uwzględniającą oba te czynniki, upewnij się, że korzystasz z bezstratnej kompresji obrazu za pomocą narzędzi takich jak Adobe Photoshop lub płatnych wersji narzędzi, takich jak Smush Pro. Obecnie Adobe Photoshop to złoty standard, jeśli chodzi o kompresję obrazu.
Pomoże to skupić się na wszystkich trzech czynnikach i sprawi, że Twoje obrazy będą nadal krystalicznie czyste po zakończeniu procesu kompresji. Musisz także wziąć pod uwagę szybsze formaty obrazów, które są lepsze niż ich poprzednicy, takie jak WebP nad png. Istnieje kilka usług, których możesz użyć do optymalizacji obrazu, w tym ShortPixel.com i TinyPNG.com. Jeśli korzystasz z WordPressa, istnieje kilka wtyczek, które są bardzo przydatne do tego zadania. Jednym z nich jest Optymalizator obrazu Shortpixel, a drugim jest wtyczka Tiny Compress Images.
Nie używaj niepotrzebnie niestandardowych czcionek
Wszyscy tam byliśmy. Wszyscy byliśmy ofiarami „chcę tego fontu”! Są szanse, że istnieje alternatywna czcionka bezpieczna w Internecie, która dość łatwo pasuje do tego, czego chcesz użyć. Jeśli nie, należy wziąć pod uwagę, że pobranie dodatkowych czcionek z zasobu innej firmy zajmie więcej czasu. Taka jest po prostu natura bestii.
Korzystanie z bezpiecznych w Internecie czcionek, takich jak Arial, Verdana lub Helvetica, to świetny wybór i eliminujesz możliwość wystąpienia problemów związanych z wybraną czcionką niestandardową. Jest również bardziej przyjazny dla wielu platform i przeglądarek, co oznacza, że Twoja witryna będzie wyświetlana w jak największej liczbie przeglądarek i urządzeń, nie wyglądając na zepsutą.
Zminimalizuj swój kod HTML i CSS
Proces minifikacji plików HTML i CSS może przynieść znaczne korzyści, jeśli chodzi o zmniejszenie rozmiaru strony. Kiedy minify kod HTML i CSS , można pozbyć się niechcianych i niepotrzebnych odstępów w kodzie, i kurczyć rozmiar pliku strony w wyniku. Rozsądne jest przeprowadzenie procesu minifikacji dla wszystkich stron, zwłaszcza jeśli wiesz, że wszystkie strony są przepełnione niepotrzebnym kodem. Istnieje wiele narzędzi, których możesz użyć do zminimalizowania plików HTML i CSS, w tym:
– Wtyczka JavaScript Minifier firmy Toptal.com
– WP Super Minifikacja
– Autooptymalizacja wtyczki WordPress
Jeśli szukasz optymalizacji jednym kliknięciem dla swoich zadań minifikacji WordPress, Cloudflare oferuje również tę funkcję, jeśli chcesz przejść do swojej usługi CDN (Content Delivery Network). Narzędzie na Minifier.org jest również bardzo przydatne do tego celu.
Unikaj rozdęcia wtyczki
Dodawanie wtyczek nie jest tak niewinne, jak się wydaje. Jeśli dodasz 5, 10 lub 15 wtyczek naraz, możesz chcieć znacznie zmniejszyć tę praktykę. Samo dodawanie wtyczek do witryny WordPress będzie miało negatywny wpływ na rozmiar Twojej strony, a także na wszystkich użytkowników, którzy mogą odwiedzić tę stronę (mogą w rezultacie doświadczyć znacznego spadku wydajności witryny).
Uważaj, aby ograniczyć swoje wtyczki tylko do tych, które są niezbędne i dodać odpowiednią funkcjonalność wymaganą dla Twojej strony. Nie chcesz wpaść w sytuację, w której dodawanie wtyczek w dużej ilości powoduje, że Twoja strona ugrzęźnie w problemach z szybkością strony.
Optymalizacja rozmiaru strony to pierwszy krok wśród wielu
Rozmiar strony może zwiększyć lub zmniejszyć wydajność witryny. Nie popełnij błędu polegającego na nadmiernym obciążaniu użytkowników niepotrzebnymi czcionkami, zbyt dużymi obrazami i niepotrzebnymi wtyczkami.
Wszystkie te praktyki mogą spowodować powolne ładowanie stron, co będzie frustrować użytkowników i spowodować, że porzucą Twoją stronę. To tylko pierwszy z wielu kroków, jeśli chodzi o solidny proces optymalizacji technicznej, który działa. Przeczytaj Zaawansowane techniczne SEO: kompletny przewodnik, aby dowiedzieć się więcej.