Każdego dnia przeglądamy w internecie tysiące zdjęć – od śmiesznych kotów, po fotografie ślubne czy w celu kupna ulubionej odzieży. Wzrokiem wybieramy produkty, usługi i artykuły na stronach internetowych. Dobre zdjęcie jest nieodzownym aspektem marketingowym – a w branżach “wizualnych” jest to wręcz kluczową kwestią zakupową. Ale czy dobre zdjęcie musi zajmować dużo miejsca na twoim dysku? Przekonajmy się!
Wstęp czyli dlaczego warto zmniejszać wielkość zdjęć poprzez kompresje
Każdy sklep internetowy czy fotograf dąży do tego by jego zdjęcia, były w jak najlepszej jakości i rozdzielczości, jednak większość właścicieli stron www nie zdaje sobie sprawy z tego, że ich zdjęcia są ogromne i mogą wczytywać się dla użytkownika nawet kilkanaście sekund – a duże zdjęcie nie jest wcale synonimem super jakości!
59,80 procent wszystkich odsłon www w Polsce pochodziło z ruchu mobilnego – smartfonów i tabletów!
Dane Statcounter
Luty 2019 rok
Co oznaczają te dane? Użytkownicy mobilni nie zawsze posiadają szybki internet. Przeglądają internet w autobusie, pociągu, innym środku transportu. W ich przypadku optymalizacja zdjęć poprzez kompresje stratną jest kluczowa, by uzyskać konkretny wynik biznesowy z ruchu mobilnego.
Wyszukiwarka Google a optymalizacja zdjęć
Prędkość strony jest jednym z czynników rankingowych, który ustala pozycje strony www w wyszukiwarce. Kompresja jest kluczowym, łatwym do zrealizowania elementem, który może przynieść ogromny zysk poprzez zmniejszenie wagi zdjęć na twojej stronie internetowej. Nie wierzysz? Zobacz różnicę pomiędzy współczynnikiem odrzuceń twojej strony internetowej przed i po optymalizacji zdjęć!
Oprócz szybszego wczytywania się strony serwer, na którym znajduje się twoja strona, wygeneruje mniej transferu danych – tym samym, jeżeli masz limit transferu w planie hostingowym to identyczny hosting, pozwoli Ci na obsługę większej liczby klientów i internautów.
Jak dobrze zmniejszyć rozmiar pliku zdjęcia?
Pierwszym pytaniem przed optymalizacją zdjęcia, które musisz sobie zadać, jest to czy wybierasz opcje kompresji bezstratnej, czy kompresji stratnej. Drugim pytaniem jest jaki format zdjęcia – jpg, png, gif, webp, jfif wybrać do jakiego zdjęcia? Formatów zdjęć jest bardzo dużo i zostaną one opisane w oddzielnym artykule blogowym.
Po odpowiedzi na te dwa pytania należy zadać sobie ostateczne pytanie – ile jesteś w stanie poświecić jakości celem uzyskania lepszej kompresji zdjęcia? Jeżeli nie chcesz myśleć nad tymi pytaniami – po prostu ściągnij odpowiedni program, wykonaj kopię zapasową zdjęć, skompresuj je aplikacją i porównaj wyniki oraz jakość.
W skrócie:
:- Kompresja bezstratna oznacza zmniejszenie wielkości zdjęcia bez straty jakości za pomocą użycia lepszych algorytm przechowującej dane dotyczące pikseli w pliku.
- Kompresja stratna oznacza zmniejszenie rozmiaru kosztem jakości zdjęci. Zdjęcie nie jest tak ostre, jak przed kompresją, a w zależności od procentu kompresji może być również nieczytelne i rozmazane, ewentualnie z mniejszą liczbą kolorów!
Kompresja stratna – mimo nazwy niekoniecznie oznacza widoczną utratę jakości!
Bazując na moim doświadczeniu, zdjęcie jpg skompresowane do
nie posiada utraty jakości wizualnej i jest bez różnicy dla i zostanie to udowodnione w przykładzie znajdującym w artykule!Jak nie ma różnicy to po co przepłacać? Porównanie jakości zdjęcia do ich rozmiaru!
Poniższe zdjęcie oraz porównanie pokazuje, dlaczego warto zmniejszać zdjęcia poprzez użycie odpowiedniej kompresji. Aktualne algorytmy i nowe formaty plików graficznych pozwalają znacząca ograniczyć wagę plików na twojej stronie internetowej.
Krok po kroku – aplikacje do kompresji zdjęć i jak z nich korzystać
Poniższe narzędzia pozwalają na zmniejszanie wagi (rozmiaru) zdjęcia poprzez kompresje zdjęć w formacie JPG, PNG, oraz animacji GIF. W zależności od wybranej opcji możliwa jest kompresja bez utraty jakości, jak też z ich stratą. Klikając w logotyp bądź nazwę dowiesz się więcej na temat konkretnego narzędzia.
Aplikacje konsolowe są przeznaczone dla użytkowników zaawansowanych, dla osób początkujących bądź mniej interesujących się zagadnieniami technicznymi zalecam korzystanie ze stron internetowych, bądź aplikacji posiadających instalacje w postaci pliku instalacyjnego systemu Windows.
Programy i aplikacje do zmniejszania wielkości zdjęć bez utraty jakości, bądź z kompresją stratną
Aplikacje oznaczone 🔥 polecam dla początkujących do kompresji i optymalizacji zdjęć.
Nazwa | Krótka informacja | Zastosowanie i Możliwość? |
---|---|---|
![]() ImageOptim (Mac) / File Optimizer (Windows)🔥 (Aplikacje) | FileOptimizer kompresuje również już skompresowane pliki bez zmiany formatu pliku i jest całkowicie kompatybilny. Zachowuje nienaruszone zachowanie pliku, ale dzięki zmniejszeniu jego rozmiaru dzięki kilku technikom rekompresji i optymalizacji | ✔️Automatyczna optymalizacja przez kilkanaście algorytmów ✔️ Wspiera bardzo duża ilość formatów graficznych jak i filmowych a nawet pliki stron internetowych! ✔️ Kompresja dowolnej ilości plików nie tylko graficznych |
![]() Squoosh (Strona WWW)🔥 | Narzędzie do optymalizacji zdjęć o przeznaczaniu do wykorzystania w Internecie | ✔️ Pojedyncze zdjęcie ✔️Możliwość porównania dwóch ustawień |
![]() (Strona WWW)🔥 | Narzędzie umożliwia sprawdzenie prędkości wczytywania się danego URL oraz generuje skompresowane elementy (js, css, grafiki) | ✔️Pojedyncza strona internetowa (adres URL) ✔️ Kompresja plików znajdujących się na stronie internetowe |
![]() pngquant (Aplikacja bash) | Pngquant to biblioteka do kompresji stratnej obrazów w formacie PNG. Jest one wykorzystywane przez wiersze poleceń (bash). Pngquant znacząca zmniejsza rozmiary plików (nawet do 70%) oraz zachowuje kanał przezroczystości. | ✔️Optymalizacja plików PNG (kompresja automatyczna) ✔️ Kompresja plików znajdujących na dysku, serwerze (ssh) |
![]() (Aplikacja bash) | MozJPEG redukuje rozmiary plików obrazów JPEG, zachowując jednocześnie jakość i kompatybilność zdjęć. Można go zastosować do dowolnego pliku JPEG (z jpegtran), aby bezstratnie zmniejszyć rozmiar pliku. | ✔️Optymalizacja plików JPG, JPEG (kompresja automatyczna) ✔️ Kompresja plików znajdujących na dysku, serwerze (ssh) |
![]() Ezgif.com/optimize/ (Strona WWW)🔥 | Ezgif.com to prosty serwis internetowy zawierający zestawy narzędzi do kompresji i edycji plików GIF, JPG, PNG, WebP, APNG. Możesz tworzyć, zmieniać rozmiar, przycinać, odwracać, optymalizować i stosować niektóre efekty do obrazów i animacji | ✔️Kompresja plików graficznych ✔️Konwersja formatów ✔️ Kompresja pliku z dysku twardego lub adresu URL |
![]() Libwebp (Aplikacja bash) | Kodek WebP: biblioteka do kodowania i dekodowania obrazów w formacie WebP. Ten pakiet zawiera bibliotekę, której można użyć w innych programach, aby dodać obsługę WebP, jak również narzędzia wiersza poleceń „cwebp” i „dwebp”. | ✔️Optymalizacja plików PNG, JPG, GIF, MP4 (kompresja automatyczna) do formatu webP ✔️ Kompresja pliku, plików do formatu webP ✔️ Tworzenie animacji w formacie .webP |
![]() (Aplikacja bash) | Fmpeg to projekt wolnego oprogramowania składający się z ogromnego pakietu bibliotek i programów do obsługi wideo, audio i innych plików multimedialnych i strumieni. Przeznaczony jest do pracy z plikami video i audio w oparciu o wiersz poleceń | ✔️ Optymalizacja plików MP4 ✔️ Konwersja plików do formatu MP4 (np. z gif) ✔️ Praca z plikami Video oraz GIF |
Programy do zmniejszania rozmiaru zdjęcia i ich kompresji (optymalizacji)
Opisane poniżej aplikacje polecam – używam większości z nich przy pracy jako Specjalista SEO.
File Optimizer (Windows),
ImageOptim (Mac)
Poziom obsługi: początkującyPrzeznaczenie: Kompresja plików w WindowsFile Optimizer to program komputerowy przeznaczony na systemy Windows, który polecam każdej osobie czytającej ten artykuł. Idealny do kompresji i łatwy w obsłudze, dodatkowo znacząca potrafi zmniejszyć wagę zdjęcia.
Aplikacja przetwarza plik graficzny przez wiele algorytmów (np. pliki png przez 16 aplikacji). Wystarczy dodać odpowiedni folder bądź pliki do programu i rozpocząć kompresje. Program jest dostępny na licencji open source i pozwala na optymalizacje ponad 50 formatów graficznych, audio, video, a nawet pdf! ImageOptim jest odpowiednikiem programu na systemy Mac.
GTMetrix
Poziom obsługi: początkującyPrzeznaczenie: Optymalizacja strony www
Optymalizacja prędkości z wygenerowaniem odpowiednich zdjęć.
Aplikacja w postaci strony internetowej, która rozpoczyna pracę po wejściu na adres URL podany przez użytkownika.
GTMetrix analizuje witrynę pod kątem prędkości i generuje wskazówki oraz zoptymalizowane pliki graficzne, które można pobrać i podmienić na serwerze FTP.
Jest to świetne rozwiązanie dla blogerów, którzy mogą sprawdzić, czy ich nowy wpis blogowy zawiera zdjęcia odpowiednio zoptymalizowane pod wyszukiwarkę internetową.
Squoosh
Poziom obsługi: początkującyPrzeznaczenie: Kompresja plików i porównanie jakości.Narzędzie Google, które pozwala na porównanie dwóch plików i wpływu optymalizacji na jakość. Pozwala na kompresje w najlepszym (moim zdaniem!) algorytmie MozJPEG oraz umożliwia zapis zdjęcia w formacie .webp.
Minusem aplikacji jest to, że zamiast korzystać z pngquant, korzysta z optipng – co nie daje najlepszej optymalizacji rozmiaru pliku w formacie .png. Aplikacja umożliwia kompresje pojedynczo zdjęcia – nie można masowo kompresować zdjęcia.
pngquant
Poziom obsługi: zaawansowanyWymaga: konsoli linii poleceńNajlepszy algorytm do kompresji obrazów w formacie png. Pozwala znacząca zmniejszyć rozmiar plików, zachowując przy tym format przezroczystości. Mimo że jest to kompresja stratna, to spadek jakości nie jest znaczący. Jeżeli masz program Adobe Photoshop to, jest możliwość instalacji oficjalnego plug-inu, który wprowadza funkcje zapisu za pomocą tego narzędzia. Umożliwia masowe zmniejszanie rozmiaru plików png.
Instalacja za pomocą linii poleceń (bash) na systemach uniksowych – sudo apt-get install pngquant
MozJPEG i JPEG recompress
Poziom obsługi: zaawansowanyWymaga: konsoli linii poleceńMozJPEG jest świetnym narzędziem do kompresji plików jpg, stworzonym przez firmę Mozilla. Jest w stanie obsługiwać pliki wejściowe bmp, ppm, jpg i targa. Instalacja jest problematyczna – należy pobrać odpowiednie repozytorium git i je skompilować. Umożliwia masowe zmniejszanie rozmiarów zdjęć jpg.
MozJPEG, jak i inne biblioteki korzystające z linii poleceń są przeznaczone dla osób, które potrafią zainstalować linie poleceń UNIX w systemie Windows lub korzystają z systemów uniksowych.
EZGIF.COM
Poziom obsługi: początkującyPrzeznaczenie: Kompresja i edycja plikówStrona WWW umożliwiająca kompresje zdjęć i animacji do różnych rozszerzeń online! Pozwala oprócz kompresji na edycje i optymalizacje animacji gif. Przyjazny interfejs pozwala na łatwą optymalizację plików multimedialnych. Polecam ją dla osób początkujących.
Umożliwia: Stworzenie i optymalizacje animacji gif, konwersje formatu wideo do gif, zmniejszenie obrazu, jego kadrowanie, optymalizacje, dodanie efektów, tekstów i konwersje.
LibwebP
Poziom obsługi: zaawansowanyWymaga: konsoli linii poleceńJest to biblioteka do obsługi formatu WebP, która umożliwia konwersje plików graficznych i animacji do tego formatu bądź też dekodowanie z WebP do innego rozszerzenia. Libwebp można zainstalować w Ubuntu bezpośrednio z repozytorium komendą w terminalu: sudo apt-get install webp
.
Po instalacji umożliwia skorzystanie z następujących komend: cwebp, dwebp, gif2webp, img2webp, vwebp, webpinfo, webpmux
.
FFmpeg
Poziom obsługi: zaawansowanyWymaga: konsoli linii poleceńFFMpeg to pakiet programów i bibliotek do obsługi multimedialnych plików (od audio do video i grafik). Przetwarza pliki za pomocą linii poleceń – w Ubuntu instalacja odbywa się poprzez terminal za pomocą komendy sudo apt-get install ffmpeg
.
Podsumowanie
Uważam, że łatwość, z jaką można optymalizować zdjęcia, jest elementem, dlaczego warto ją stosować – wystarczy zainstalować jedno z wyżej wymienionych narzędzi, bądź skorzystać ze stron online, które to umożliwiają.
Pojemność danych można zmniejszyć wielokrotnie bez znaczącej utraty jakości. Wariantów kompresji i algorytmów jest wiele, i naprawdę nie musisz iść w „maksa”, wystarczy, chociażby kompresja na 75% która może, spowodować spadek rozmiaru zdjęcia o 80% – spowoduje to gigantyczne przyśpieszenie strony www dla internauty!
Jeżeli posiadasz sklep internetowy bądź stronę internetową – i długo nad nią pracowałeś to powinnieneś rozważyć optymalizacje. Automatyczna kompresja może spowodować że twój folder przechowujący zdjęcia (np. folder uploads w WordPress) zostanie diametralnie zoptymalizowany. Moim rekordem jest odchudzenie tego folderu z 20 GB do 11 GB.
Kompresja zdjęć
13 stycznia, 2020Hej, ciekawy artykuł. Kiedyś napisałem podobny tekst. Przy czym bardziej skupiłem się na wartościahc liczbowych dotyczących oszczędności przy zmianach rozmiaru i kompresji zdjęć. Polecam serdecznie [spam]
Wojciech
18 stycznia, 2020Aż taka słaba pozycja w Google, że trzeba męczyć o link nofollow exact match? 🙂