Share on Facebook0Share on Google+0Tweet about this on TwitterShare on LinkedIn0Pin on Pinterest0Email this to someone
Rating: 9.7. From 3 votes.
Please wait...

Sieć jest przepełniona stronami, na których zwykle znajdują się setki stron tekstu. W dzisiejszych czasach coraz mniej osób ma czas lub ochotę na czytanie – o wiele lepiej sprawdzają się treści wizualne, takie jak wideo czy obrazy – jak dobrze wiadomo, obraz wyraża więcej niż tysiąc słów. Stwierdzenie to dodatkowo potwierdzać może popularność stron gromadzących np. memy.

Nie wystarczy jednak bezmyślnie publikować jak najwięcej zdjęć lub obrazów, gdyż może to przynieść więcej szkody niż pożytku. Aby uniknąć czarnego scenariusza, warto zastosować się do kilku poniższych wskazówek i odpowiednio zoptymalizować grafiki przed wrzuceniem ich na bloga lub stronę.

 

Rodzaj pliku i jego format

Cyfrowe grafiki podzielić można na dwa rodzaje – rastrowe oraz wektorowe.

Pliki rastrowe, to klasyczne obrazy, złożone z setek tysięcy (a nawet milionów) pikseli, tworzących np. wysokiej jakości zdjęcie. Zaletą obrazów rastrowych jest wysoka szczegółowość, jednak kosztem dużego rozmiaru pliku, sięgającego nawet kilku megabajtów. Przed publikacją w internecie konieczne jest zatem ich kompresowanie, co prowadzi do znacznego „odchudzenia” pliku, jednocześnie usuwając z niego pewne informacje. Zbyt duża kompresja sprawia, że plik rastrowy będzie co prawda lekki, jednak kompletnie nieczytelny dla oglądającego.

Grafika wektorowa składa się wyłącznie z figur geometrycznych. Trudno za ich pomocą przedstawić np. realistycznie wyglądający zachód słońca, jednak wektory doskonale sprawdzają się w przypadku ikon, logotypów lub innych prostych grafik. Ogromną zaletą obrazów wektorowych jest fakt, że mogą być one dowolnie skalowane (powiększane oraz pomniejszane), bez utraty jakości. Dodatkowo nawet najbardziej skomplikowane obrazy wykonane w technice wektorowej nie zajmują dużo miejsca na dysku lub serwerze.

Do wyboru jest też kilka formatów plików, w jakich zapisane mogą być obrazy – .jpg, .png lub .gif.

Najczęściej spotykane w sieci obrazy to tak zwane „jotpegi” – czyli pliki z rozszerzeniem .jpg. Jest to format stratny, co oznacza, że podczas konwersji część informacji na zdjęciu lub grafice zostanie bezpowrotnie utraconych. Tak jak wspomniano wcześniej – plik taki będzie ważył mniej (już nie kilka megabajtów, a co najwyżej kilkadziesiąt kilobajtów), jednak im większy stopień konwersji, tym bardziej nieczytelny stanie się obrazek. W formacie .jpg najlepiej zapisywać fotografie z dużą ilością szczegółów – np. zdjęcia produktowe.

Pliki w formacie .png oferują bezstratną konwersje, co pozwala na zachowanie na obrazie wszystkich najważniejszych szczegółów – kosztem zwiększonej wagi pliku. W tym formacie najlepiej prezentują się grafiki zawierające tekst lub logo.

Jeśli chcemy zamieścić na stronie ruchomą animację, to zamiast filmu dobrym pomysłem może być plik w formacie .gif – uwaga jednak na jego rozmiar. Skomplikowane animacje mogą zajmować naprawdę dużo miejsca, a czas wczytywania może zniechęcić użytkowników.

 



Wymiary grafik

Ważne z punktu widzenia pozycjonowania oraz użyteczności strony jest zadbanie o właściwe wymiary (a także proporcje) publikowanych na stronie zdjęć. Dla komputerów osobistych najlepszym wyjściem jest używanie proporcji 16:9, czyli na przykład wymiaru 1280 x 720 pikseli – dzięki temu grafika będzie wyświetlana większej części ekranu. W przypadku urządzeń mobilnych, warto stosować proporcje 1:1, a więc wymiaru np. 1080 x 1080 pikseli. Kwadratowe zdjęcia lub obrazy znacznie lepiej wypełniają przestrzeń mniejszych wyświetlaczy telefonów.

 

Nazywanie plików

Częstym błędem jest pozostawianie domyślnych nazw plików graficznych i publikowanie ich bez zmian na stronie. Przez to wyszukiwarki internetowe nie potrafią „odczytać”, co tak naprawdę znajduje się na zdjęciu. Zatem zamiast „IMG_1234.jpg” warto przemianować grafikę na przykład na „pozycjonowanie-grafik.jpg”, co sprawi, że stanie się ona o wiele bardziej widoczna dla robotów Google’a.

Dodatkowo w czasie publikowania zdjęć istnieje możliwość wprowadzenia tak zwanego opisu alternatywnego, który wyświetli się w momencie, kiedy z jakiegoś powodu grafika na stronie nie załaduje się. To spore ułatwienie dla użytkowników, którzy dzięki opisowi alternatywnemu będą mogli domyślić się, co miał przedstawiać obrazek.

 

Zmniejszanie wagi pliku graficznego

Jak już wspomniano – im mniejszy plik obrazu, tym lepiej dla naszej strony, dla jej pozycji w wyszukiwarce i dla użytkowników ją odwiedzających. Wagę pliku zmienić można na kilka sposobów, na przykład zmniejszając jego wymiary (zdjęcie skopiowane bezpośrednio z aparatu w maksymalnej rozdzielczości zajmuje o wiele za dużo miejsca), zapisując w innym formacie (pliki .jpg są znacznie lżejsze od .png) lub poddając go dodatkowej kompresji.

Ten ostatni sposób jest szczególnie polecany, gdyż jest szybki i pozwala naprawdę „odchudzić” spore grafiki, niekoniecznie z dużą stratą na jakości. W sieci dostępnych jest wiele narzędzi on-line, które ułatwiają kompresowanie grafik (np. tinyJPG.com – według twórców waga pliku może być zmniejszona nawet o 70%!), skorzystać też można z darmowych wtyczek do systemów CMS, które automatycznie potrafią zmniejszyć rozmiar przesyłanych na serwer plików.

Warto pamiętać o tych wskazówkach następnym razem, podczas przesyłania na stronę kolejnego zdjęcia. Choć niewątpliwie uatrakcyjni ono pozostałe treści, to postarajmy się również o to, aby nie spowalniało ono czasu wczytywania witryny. W dzisiejszych czasach internauci są bardzo niecierpliwi i nawet kilkusekundowe opóźnienie może sprawić, że odwiedzający darują sobie dalsze przeglądanie naszej strony…

 

Rating: 9.7. From 3 votes.
Please wait...
Share on Facebook0Share on Google+0Tweet about this on TwitterShare on LinkedIn0Pin on Pinterest0Email this to someone

Przeczytaj także

Rafał Szeles

Rafał Szeles

Dyrektor Zarządzający WebDoctor, strateg eMarketingu, Certyfikowany specjalista Google AdWords i Google Analytics.

Projektując strategie łączy doświadczenie z zakresu prowadzenia kampanii eMarketingowych z praktyką w zarządzaniu przedsiębiorstwem. Dzięki temu jego strategie obejmują nie tylko etap pozyskania leadów, ale również optymalizację procesów ofertowania, obsługi sprzedażowej i posprzedażowej. Doświadczenie zbierał prowadząc projekty dla Uniwersytetu Warszawskiego, Miasta Poznań, Subway Polska, Targów Remadays oraz Życia bez Ograniczeń (wizyta Nicka Vujicica w Polsce).

Ekspert ds. analizy i optymalizacji w Akademii eCommerce oraz twórca publikacji na portalu eMarketing.pl. Zwolennik automatyzacji lejków sprzedażowych, dzięki którym klienci osiągają skalę sprzedaży niemożliwą do wygenerowania tradycyjnymi metodami.

Napisz do mnie: r.szeles@webdoctor.pl

Jeden komentarz

  1. Przydatne mini-kompedium dla początkujących 🙂 TinyPNG polecam – sprawdzony serwis do kompresji.

    Odpowiedz

Dodaj komentarz

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