Przyspieszanie stron internetowych

Żyjemy w szybkich czasach, dlatego zmuszanie Internautów do czekania na pojawienie się zawartości naszej strony internetowej w ich przeglądarce to nieporozumienie. Jest wiele czynników, które wydłużają czas ładowania się strony www. Opiszę tylko te, na które mamy wpływ i pokażę jak je zminimalizować.

O tym jak ważne jest utrzymanie wysokiej dostępności naszej witryny internetowej poprzez zapewnienie szybkiego wejścia na nią, możemy się przekonać zapoznając się ze Wskazówkami dla Webmasterów.

Może wydawać się to bardzo kontrowersyjne ale pozycja w wynikach wyszukiwania jest wprost proporcjonalna do czasu potrzebnego na jej załadowanie. To jeden z nielicznych czynników wpływających na pozycję w SERP, o którym trąbi samo Google. Wysiłek włożony w optymalizację pod kątem prędkości strony na pewno się opłaci.

Serwer

Aby zapewnić szybkie ładowanie się strony po stronie serwera, należy stosować:

 

  • Kompresja GZIP – najważniejsza rzecz jaką musimy wykonać na naszych serwerach. Włącz tę opcję nawet jeżeli wiąże się to z umieszczaniem na serwerze spakowanych plików i edycją pliku .htaccess. W sieci jest wiele narzędzi, które to ułatwiają. Kompresji GZIP najczęściej są poddawane pliki arkusza stylów CSS, pliki HTML, kody JavaScript i wszelkie inne treści które są wysyłane wprost do przeglądarki odwiedzającego w postaci tekstu. Pakowane w ten sposób pliki są odchudzane o przeszło 80%.
  • Funkcja Expires w .htaccess – za jej pomocą ustalisz datę ważności  opublikowanych plików. Dzięki temu przeglądarka wie po jakim czasie ma pobrać ponownie wcześniej pobrany element i nie będzie musiała tego robić na okrągło przy każdej ponownej wizycie. Plik jest zapisywany w pamięci przeglądarki i nie dość, że zmniejszymy obciążenie serwera, to przyspieszymy ładowanie strony i przechodzenie do kolejnych podstron.
  • Przede wszystkim szybki serwer. O tym jak diagnozować wydajność obecnego serwera wspomniałem w artykule: Optymalizacja stron internetowych.

Wdrożenie tych technik zwykle następuje w momencie publikacji strony lub jej optymalizacji.

Web Development

Sam sposób projektowania witryny ma wpływ na jej szybkość i responsywność. Należy zwrócić uwagę miedzy innymi na:

  • Objętość pliku HTML – zadbaj o to, by plik był stworzony zgodnie z zasadą KISS (Keep It Simple, Stupid) czyli profesjonalnie w jak najprostszy sposób.
  • Objętość pliku CSS – to samo co wyżej tylko dotyczy plików CSS.
  • Ilość skryptów – ogrom plików JavaScript może poważnie wpłynąć na opóźnienia w ładowaniu strony. Stosuj je z umiarem a nawet usuń tam gdzie są niepotrzebne lub można je zastąpić rozwiązaniami, które daje HTML5 i CSS3.
  • Elementy Flash – stosowanie Flasha na stronach biznesowych w obecnych czasach to chyba jakiś żart. Wyrzuć je bez najmniejszego zastanowienia, bo już i tak nie robią na nikim wrażenia.
  • Zewnętrzne źródła – umiesz liczyć, licz na siebie. Zamieszczaj linki do skryptów znajdujących się lokalnie. Skopiuj potrzebny kod na swój serwer o ile pozwala na to licencja.
  • Minifikacja JV i CSS – wcięcia, łamanie linii i nadmiarowe spacje w kodach CSS i JavaScript są niezbędne podczas pisania, jednak kiedy kod jest umieszczony na stronie, zajmują tylko niepotrzebne kilobajty. Cudów nie zdziałamy ale będziemy wzorem do naśladowania.

Bardzo łatwo można sprawdzić czy Twój projektant stosował się do tych technik. Dokonaj analizy Twojej strony internetowej za pomocą takiego lub podobnego narzędzia: Seo SiteCheckup.

Grafika i multimedia

Pliki o dużym rozmiarze mają jednak największy wpływ na szybkość ładowania się witryn WWW.

  • Dźwięk i muzyka – jestem melomanem, mam setki płyt CD i nigdy nie rozstaję się z iPodem jednak uważam, że na stronach biznesowych po prostu nie ma dla nich miejsca.
  • Skalowanie bitmap – skaluj pliki z obrazkami i umieszczaj go w oryginalnym rozmiarze a nie skaluj elementów za pomocą width i height. Przy galerii używaj znacznie odchudzonych miniatur.
  • Format grafiki – dla skomplikowanych zdjęć użyj stratnego JPG zaś dla prostych wykresów bardziej wydajny będzie PNG.

Jak optymalizować grafikę na stronach internetowych opisałem w osobnym artykule: optymalizacja grafiki na stronach internetowych.

Wnioski

Czas w jakim przeglądarka pobiera zawartość witryny internetowej to miarodajny wyznacznik profesjonalizmu webmastera. Duża treść nie jest żadnym wytłumaczeniem. Istnieją obszerne portale, które ukazują swój Front-Page niemal błyskawicznie i pseudo strony z paroma grafikami na których załadowanie nie można się doczekać. Sprawdź swoja stronę w dedykowanej do tego aplikacji: Google Page Speed Insights.

Przyspieszanie stron internetowych
4.83 (96.67%) głosów: 6