Prosty sposób na zmniejszenie rozmiaru zdjęć dla stron internetowych

rysiuSzybkość komputerów i łącz internetowych wzrasta, dlatego coraz mniej osób zwraca uwagę na wielkość zdjęć umieszczanych na swoich stronach. A warto, ponieważ rośnie także ilość użytkowników korzystających z urządzeń mobilnych do przeglądania stron internetowych. Internet mobilny z reguły jest znacznie wolniejszy od stacjonarnego.

Jest jeszcze drugi ważny powód – już od 2010 roku Google daje znać na swoim oficjalnym blogu, że na pozycje w wynikach szukania tej największej wyszukiwarki wpływ ma także szybkość ładowania stron internetowych.

Oczywiście ciężar obrazków jest jedną ze składowych szybkości ładowania stron, jednakże warto poświęcić chwilę na dopracowanie tego aspektu swojej witryny internetowej. Proces optymalizacji dużo czasu nie zajmie a plusy mogą być znaczące. Mam tu na myśli „user experience” czyli wrażenia użytkownika podczas przeglądania strony internetowej. Jeśli witryna wolno się ładuje zniechęca to do dalszych jej odwiedzin.

irfanikonDo optymalizacji plików JPG polecam program Irfan View. Jest darmowy do użytku domowego, natomiast jeśli chcesz wykorzystywać go w firmie należy zakupić licencję. Kosztuje niewiele jak na swoje możliwości – 45,2 zł netto. Można skorzystać ze sklepu polskiego dystrybutora. I jest to jedyna wada programu jeśli chodzi o użytek komercyjny, no może prócz jego ikonki przypominającej rozjechanego kota ;-)

Proces zmniejszania wielkości obrazków w formacie JPG przebiega niesamowicie prosto.

  • Otwieram obrazek, następnie w menu wybieram: Plik / Zapisz jako.
  • Jeśli nie jest wybrany format JPG klikam w „Zapisz jako typ” i wybieram JPG.
  • Obok dużego okna powinienem zobaczyć mniejsze okienko, z zaznaczonymi ptaszkami. Jeśli go nie widać klikam w „Pokaż okno opcji” na samym dole dużego okna.
  • W małym okienku z opcjami odznaczam wszystkie ptaszki i ustawiam jakość na 80. Kliknij na obrazku poniżej, tam zaznaczyłem wszystkie kluczowe pola.
  • Teraz pozostało już tylko kliknąć w „Zapisz”.

irfan1

Jakość 80 jest wystarczająca na potrzeby Internetu, zdjęcia będą ostre, z niewielką ilością zniekształceń. Tak, będą małe artefakty, ponieważ format JPG to tak zwana stratna kompresja obrazu. Czyli zyskujemy na mniejszym ciężarze obrazka kosztem jego jakości. Tak więc warto zostawiać oryginały do dalszej obróbki.
Przy ustawieniach zapisu jakie wyżej podałem wielkość obrazka spada średnio o 5 razy, to jest bardzo dużo.

Omówiłem sposób optymalizacji plików JPG, ale w użyciu są jeszcze pliki PNG. Korzysta się z nich rzadziej, ale i je warto zoptymalizować. Do tego celu służy program PNGOUT. Jest to mikroskopijna aplikacja obsługiwana linią komend, tak więc dla przeciętego użytkownika komputera jest niezrozumiała. Ale jest i pomoc. Także do tego celu przyda się Irfan View!
Co prawda trzeba poklikać trochę więcej, ale niezbyt wiele. Należy pobrać paczkę z pluginami ze strony IrfanView i zainstalować. Domyślnie PNGOUT nie jest zainstalowany, a szkoda.

Jeśli PNGOUT z jakiegoś powodu nie trafi do właściwego katalogu, a taki miałem sygnał od znajomego, który instalował go na nowym komputerze, należy wtedy pobrać sam plik PNGOUT ze strony jego autora i wgrać go do podkatalogu „plugins” w katalogu w którym jest zainstalowany Irfan View. W zależności od wersji (32 lub 64 bity) może to być folder „pliki programów (x86)” lub „program files”.

Następnie:

  • Otwieram plik PNG.
  • Klikam w menu: Plik / Zapisz zoptymalizowany (moduł).
  • Pojawi się dodatkowe okienko, w nim wybieram „PNG”.
  • W opcjach ustawiam:
    » Color reduction: 128 lub więcej, można poeksperymentować jaki efekt przyniesie ograniczenie ilości kolorów, ponieważ mamy podgląd na żywo,
    » Color quantization algorithm: NeuQuant neural-net (slow).
    » Externals Optimizers: PNGout Xtreme (very slow).
  • Pozostało już tylko zapisać plik i tu ważna sprawa – zapisuję wchodząc w menu w okienku optymalizacji PNG, a nie w okienku głównym w którym otworzyłem obrazek. Dodatkowe okienko pomimo spolszczenia IrfanView posiada angielskie napisy. W nim wybieram: File / Save us.

irfan2

Przy okazji Irfan View to doskonała przeglądarka obrazków, osobiście z niego korzystam od lat.
Program posiada też spolszczenie oraz wiele użytecznych pluginów. I wszystko instalowane jest automatycznie po uruchomieniu pliku EXE pobranych ze strony twórcy aplikacji.

A kotek na zdjęciu to obywatel ZOO z Myślęcinka. Wygląda znacznie sympatyczniej niż ikonka Irfan View, choć przy zdjęciach nie pomoże. Zaraz, zaraz, no przecież ryś pięknie pozował, a to też pomoc! ;-)

11 maja 2016, Tomasz Bartosiewicz, komentarze 3

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

3 myśli nt. „Prosty sposób na zmniejszenie rozmiaru zdjęć dla stron internetowych”

  1. dzięki za receptę na mniejsze fotki
    skutecznie skorzystałem
    i pogłaskał rysia z podziękowaniem :-)

  2. Miło słyszeć, że moja paplanina do czegoś się przydaje :-)
    A rysia łapałem z daleka, teleobiektywem. W ZOO do drapieżników nie da się podejść blisko, to oczywiście ze względów bezpieczeństwa.

  3. Dziękuję! Skutecznie zmniejszyłam swoje fotki, których jest dużo na stronie. Potem zrobiłam testy z wyczyszczoną pamięcią w przeglądarce i faktycznie zauważyłam wyraźny wzrost szybkości ładowania stronki. Super!
    Rysiu jest śliczny, żeby mieć taki portret chyba blisko podszedłeś?