Optymalizacja obrazów (Konwersja do WebP)

Usługa dodatkowa Konwersja do formatu webp i zmiana wielkości obrazów nawet kilkakrotnie zmniejsza rozmiar plików graficznych przesyłanych z hostingu do przeglądarki osoby wchodzącej na zoptymalizowaną za jej pomocą witrynę internetową. Dzięki temu konwersja do WebP skraca czas potrzebny na wczytanie zoptymalizowanej za jej pomocą strony WWW. Korzystanie z tej usługi jest szczególnie polecane w przypadku witryn zawierających dużą liczbę grafik - na przykład sklepów internetowych, galerii czy rozbudowanych blogów. Wielkość obrazów przesyłanych z hostingu do przeglądarki jest dynamicznie dostosowywana do rozdzielczości ekranu urządzenia lub monitora, na którym wyświetlana jest strona. Zoptymalizowane w ten sposób obrazy zużywają mniej transferu, a sama witryna działa szybciej. Korzystanie z automatycznej konwersji obrazów do formatu WebP wymaga posiadania na hostingu aktywnej usługi CDN nazwa.pl (1).

Jak zamówić usługę optymalizacji obrazów dla serwera w nazwa.pl?

Usługa optymalizacji obrazów rozliczana jest w Modelu Abonamentowym. Możesz dokonać jej zamówienia w chwili zamawiania serwera hostingowego lub w dowolnym momencie korzystania z serwera. W tym celu, zaloguj się do Panelu Klienta, a następnie przejdź do zakładki Moje usługi -> Hosting (1) i kliknij odnośnik Szczegóły (2), widoczny poniżej identyfikatora serwera.

W Szczegółach serwera wybierz kartę Usługi dodatkowe, a następnie w sekcji Usługi rozliczane w Modelu Abonamentowym odnajdź Konwersja do formatu webp i zmiana wielkości obrazów i kliknij przy niej przycisk AKTYWUJ (1).

Zostaniesz przeniesiony na stronę płatności. Po jej dokonaniu, usługa kompresji obrazów zostanie uruchomiona.

Jak włączyć lub wyłączyć optymalizację obrazów na serwerze w nazwa.pl?

Włączenie lub wyłączenie optymalizacji obrazów na serwerze CloudHosting możliwe jest poprzez Panel Klienta.

Aby zmienić aktualne ustawienia kompresji obrazów, należy zalogować się do Panelu Klienta, a następnie przejść do zakładki Moje usługi -> Hosting (1) i kliknąć odnośnik Szczegóły (2), widoczny poniżej identyfikatora serwera.

W Szczegółach serwera należy wybrać kartę CDN nazwa.pl, a następnie kliknąć przycisk WŁĄCZ KOMPRESJĘ OBRAZÓW (1) lub WYŁĄCZ KOMPRESJĘ OBRAZÓW. Opis przycisku będzie zależny od dotychczasowego stanu modułu.

Optymalizację obrazów można aktywować, włączyć lub wyłączyć również z poziomu panelu zarządzania serwerem CloudHosting Panel. Sprawdź jak to zrobić: Automatyczna konwersja obrazów do formatu WebP.

Nagłówki CDN nazwa.pl informujące o optymalizacji

Przy włączonej optymalizacji obrazów, węzły CDN nazwa.pl wysyłają odpowiednie nagłówki informujące o działaniu funkcji:

1. mod_pagespeed jest włączone i obrazki zostały poprawnie przekonwertowane
   Do węzłów CDN oraz do przeglądarki wysyłane są nagłówki:
   x-mod-pagespeed: enabled
   X-CDN-nazwa.pl-policyused: cdn=czas przechowywania pliku w CDN nazwa.pl
   cache-control: max-age=czas przechowywania pliku w CDN nazwa.pl
2. mod_pagespeed jest włączone ale obrazki nie zostały poprawnie przekonwertowane
   Do węzłów CDN oraz do przeglądarki wysyłane są nagłówki:
   x-mod-pagespeed: enabled
   X-CDN-nazwa.pl-policyused: cdn=0
   cache-control: max-age=0

Jeśli optymalizacja obrazów jest wyłączona, powyższe nagłówki nie są wysyłane.

Możliwe problemy z działaniem optymalizacji obrazów

Może się zdarzyć, że pomimo włączenia optymalizacji obrazów na serwerze, niektóre grafiki na stronie WWW nie będą optymalizowane. Oto najczęstsze przyczyny takiej sytuacji:

• Obrazy mają za dużą rozdzielczość - maksymalna rozdzielczość obrazu, która umożliwia optymalizację to 4 MP, a więc obraz nie może być większy niż 4000000 pixeli, czyli np. 2000x2000px, 1000x4000px, 500x8000px, itd.
• Obrazy posiadają warstwę przezroczystą - przykładem mogą być niektóre pliki GIF lub PNG, które posiadają warstwę przezroczystości i przez to nie będą optymalizowane.
• Obrazy JPEG z kompresją progresywną mają za mały rozmiar - minimalna wielkość obrazów progresywnych JPEG to 10000 bajtów.
• Rozmiar obrazów w kodzie strony (parametry height i width) podane są procentowo, a nie w formie stałych wartości.

Jak wyeliminować problemy, które powodują brak optymalizacji obrazów?

Istnieje wiele aplikacji zewnętrznych, które służą do obróbki obrazów. Dzięki ich zastosowaniu możliwe jest wyeliminowanie braku optymalizacji obrazów na stronie WWW. Jedną z takich aplikacji, które przeznaczone są na komputery z systemem operacyjnym Windows jest IrfanView, którą można pobrać ze strony https://www.irfanview.com/.

1. Zmiana rozdzielczości obrazu.
   
   W przypadku zbyt dużych obrazów, o rozmiarze ponad 4 MP, konieczne jest ich zmniejszenie, do akceptowalnego przez system rozmiaru. Zalecamy, przed zmianą rozmiaru obrazu, zachować na komputerze kopię oryginalnego pliku. Aby dokonać zmian przy pomocy programu IrfanView, wykonaj poniższe czynności:
   • Uruchom program IrfanView i otwórz w nim obrazek, w którym chcesz wykonać zmiany.
   • Z górnego menu wybierz opcję Obraz (1), a następnie Zmień Rozmiar obrazu (2).
     
   • W sekcji Nowy rozmiar (1) zaznacz jednostkę piksele i wpisz nowe wartości w polach Szerokość i Wysokość. Pamiętaj przy tym, aby wartości te nie były większe niż 2000x2000, 1000x4000 lub 500x8000.
   • Jeśli opcja Zachowaj pierwotne proporcje boków (2) będzie zaznaczona, to wpisanie wartości w jednym z pól, np. Szerokość, spowoduje automatyczne proporcjonalne uzupełnienie drugiej wartości.
     
   • Możesz skorzystać również z sekcji Gotowe rozmiary (w pikselach) znajdującej się po prawej stronie otwartego okna. Pamiętaj przy tym, aby rozmiary te nie przekraczały maksymalnych umożliwiających optymalizację obrazków.
   • Po ustaleniu nowego rozmiaru obrazka, kliknij przycisk OK, a następnie zapisz zmiany dokonane w pliku.
   • Umieść zmodyfikowany obraz na serwerze w katalogu, w którym się pierwotnie znajdował.
   • Wykonaj czyszczenie cache CDN nazwa.pl (Sprawdź: Czyszczenie cache).
2. Usunięcie przezroczystości na przykładzie obrazu PNG.
   
   Jeżeli chcesz, aby obrazy, które posiadają warstwę przezroczystą, były optymalizowane, należy tę warstwę usunąć, dokonując edycji obrazu. Musisz pamiętać, że usunięcie przezroczystości z obrazów może spowodować zmianę wyglądu strony. Należy to wykonywać ze szczególną ostrożnością, zachowując na komputerze kopię oryginalnego obrazu. Aby usunąć przezroczystość z obrazu PNG przy pomocy programu IrfanView, wykonaj poniższe czynności:
   
   
   • Uruchom program IrfanView i otwórz w nim obrazek, w którym chcesz wykonać zmiany.
   • Z górnego menu wybierz opcję Plik (1), a następnie Zapisz jako... (2).
     
   • W dodatkowym oknie opcji, które pojawi się obok głównego okna zapisu pliku, odznacz opcje Zapisz kolor przezroczystości PNG (1) oraz Zapisz kolor przezroczystości (2).
     
   • Zapisz nowy plik.
   • Umieść zmodyfikowany obraz na serwerze w katalogu, w którym się pierwotnie znajdował.
   • Wykonaj czyszczenie cache CDN nazwa.pl (Sprawdź: Czyszczenie cache).