Optymalizacja grafiki internetowej

Słownik kwalifikacji INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych

Optymalizacja grafiki internetowej

Optymalizacja grafiki internetowej polega na przygotowaniu plików graficznych tak, aby miały możliwie mały rozmiar, ale nadal akceptowalną jakość wizualną. Jest to ważne, ponieważ zbyt duże obrazy spowalniają ładowanie strony, zwiększają transfer danych i pogarszają wygodę użytkownika.

Najważniejsze sposoby zmniejszania rozmiaru pliku

  • Zmniejszenie rozdzielczości obrazu — jeśli grafika ma np. 4000 px szerokości, a na stronie wyświetlana jest jako 800 px, warto ją przeskalować przed publikacją.
  • Dobór odpowiedniego formatu:
  • JPG/JPEG — dobre dla zdjęć, kompresja stratna,
  • PNG — dobre dla grafik z przezroczystością i prostych elementów,
  • GIF — proste animacje i ograniczona paleta kolorów,
  • WebP — nowoczesny format o dobrej kompresji.
  • Kompresja obrazu — zmniejszenie rozmiaru pliku przez usunięcie części danych lub lepsze ich zapisanie.
  • Usunięcie zbędnych danych — np. metadanych EXIF ze zdjęcia.

Czego nie robić?

Nie należy zapisywać grafiki internetowej w formacie BMP, ponieważ zwykle tworzy bardzo duże pliki i nie jest praktyczny do publikacji w sieci. Zwiększenie głębi kolorów lub dodanie kanału alfa może dodatkowo powiększyć plik.

Przykład

Jeżeli zdjęcie ma rozdzielczość 3000 × 2000 px, a na stronie ma być wyświetlane jako miniatura, można zmniejszyć je np. do 900 × 600 px. Taki obraz będzie znacznie lżejszy i szybciej się załaduje.

Wniosek egzaminacyjny

Gdy plik graficzny jest zbyt duży do publikacji w sieci, jedną z podstawowych czynności jest zmniejszenie jego rozdzielczości.