Szybkość stron internetowych
CO TO JEST GOOGLE PAGE SPEED
Google Page Speed jest narzędziem, które umożliwia sprawdzenie wydajności stron internetowych (szybkości wczytywania, stopnia optymalizacji kodu itp.). Wydajność mierzy się w skali od 0 do 100 punktów. Strona działa poprawnie jeżeli ma więcej niż 85 punktów. Google Page Speed podaje wynik, który nie zależy od łącza internetowego lecz od webmasterów – jest to wydajność względna strony internetowej. Możemy zobaczyć dwa niezależne wyniki – dla komputerów i dla urządzeń mobilnych.
Oprócz samego pomiaru, narzędzie pozwala na poprawienie wyniku dzięki umieszczaniu sugestii pod analizą.
Sugestie mają trzy warianty:
- czerwone to błędy, których poprawienie znacznie wpłnie na prekość wczytywanie strony,
- żółte – poprawienie błędów ma mniejszy wpływ na szybkość strony,
- zielone – informacja, że nie ma poważnych błędów.
JAK KORZYSTAĆ Z GOOGLE PAGE SPEED?
Aby sprawdzić wydajność dowolnej strony, należy wejść na stronę narzędzia, dostępnego pod adresem: https://developers.google.com/speed/pagespeed/insights/?hl=pl.
W odpowiednie miejsce należy wkleić URL strony i czekać na wyniki.
NAJCZĘSTSZE BŁĘDY, KTÓRE WYCHWYCI GOOGLE PAGE SPEED
Czerwone i żółte wykrzykniki pojawiają się najczęściej wtedy, gdy:
- Wgrywamy na stronę niezoptymalizowane obrazy. Warto sprawdzić jaki rozmiar pliku wyświetla przeglądarka. Jeżeli po zbadaniu elementu okazuje się, że obraz ma rozmiar naturalny 1900px x 500px a wyświetla się: 1633px x 500px to nie ma potrzeby przechowywać go większego. Zmniejszenie wszystkich obrazków na stronie ZNACZNIE przyspiesza szybkość wczytywania. Podczas tworzenia stron warto zadbać o to, by obrazy przycianne były już podczas wgrywania – oszczędzimy sobie mnóstwo pracy.
- Piszemy kod html z błędami. W HTML5 są konkretne zasady, które należy stosować. Tutaj znajduje się pełna dokumentacja HTML5.2. Warto się z nią zapoznać przed rozpoczęciem prac nad strukturą strony.
- Dodajemy do naszej strony zewnętrzne pliki. Zanim strona się wczyta musi pobrać wszystkie zasoby z zewnątrz. Dobrze jest mieć jak najmniej takich plików, aby strona mogła wyświetlić się użytkownikowi jak najszybciej.
- Przyciski w nawigacji lub stopce nie są odpowiednio powiększone. Należy zwiększać czcionkę lub odstępy między linkami dla urządzeń moblinych, aby użytkownik z dużym palcem mógł bez problemu trafić w link 🙂 Google traktuje to również jako błąd.
- Jeżeli używamy naszej stronie skryptów .js, warto te skrypty w ostatecznej wersji zminimalizować, czyli usunąć zbędne białe znaki. Można użyć to tego narzędzia UglifyJS. Skrypty powinny być umieszczone na końcu dokumentu, albo w nagłówku, pod warunkiem, że dodamy parametr defer.
- Takie same akcje wymagane są do plików CSS, czyli pliki trzeba zminimalizować. Dodatkowo, warto rozważyć wklejenie ich zawartości do kodu (najlepiej automatycznie), dzięki temu strona po przeładowaniu nie będzie czekać, aż plik CSS zostanie pobrany.
- Dla wszystkich plików statycznych powinno się ponadto ustawić parametr expire w .htaccess, najelepiej na kilka miesięcy. Jednak, aby nie zmuszać użytkownika do odświeżania strony przy użyciu Ctrl+F5, każda zmiana w pliku statycznym, powinna się wiązać ze zmianą nazwy tego pliku.
POPRAWNE STRONY WG GOOGLE PAGE SPEED
Przykładem poprawnej i szybkiej strony jest reycocms.pl i wszystkie motywy wykonane w tym cms. Tak wygląda podsumowanie wyników:
WOLNE, NIEPOPRAWNE STRONY WG GOOGLE PAGE SPEED
Przykładem strony wolnej i niezoptymalizowanej jest portal Wirtualna Polska.
Bibliografia:
1. https://developers.google.com/speed/docs/insights/about?hl=pl-PL&utm_source=PSI&utm_medium=incoming-link&utm_campaign=PSI
Dzień dobry, cały czas mi się wydaje, że mój sklep internetowy bardzo wolno się ładuje. Czy mogą Państwo rzucić na niego profesjonalnym okiem?
Witam serdecznie 🙂 Mówimy o higieniczny.pl? Zerkniemy i napiszemy maila, na ten adres: sklep@higieniczny.pl – czy na jakiś prywatny?
Pozdrawiamy 🙂