Zalecane formaty obrazów na stronę internetową przez Google!
Tematem o jakim chce dziś napisać są zalecane przez Google formaty plików graficznych (next-gen formats). Czyli formaty graficzne, które zdaniem Firmy Google mają największy potencjał.
Temat sam wpadł mi w ręce kiedy aktualizowałam moje portfolio. Bo jak sami wiedzie mówi stare przysłowie – szewc bez butów chodzi. A w dużym skrócie było co robić (sprawdzać, aktualizować i wprowadzać nowe rozwiązania)! Dlatego aktualizacja mojego portfolio przynajmniej dla mnie była sporym wyczynem! Choć dla osoby z zewnątrz, bez wiedzy o specyfikacjach już tak średnio.
Tak naprawdę jakoś nigdy specjalnie na to nie miałam czasu, w końcu zawsze jest coś innego do robienia – każdy to zna. Jednak skoro już się zmusiłam do pracy to postanowiłam zrobić to dobrze, a przynajmniej w miarę poprawnie. Jedną z czynności jakie wtedy wykonałam było sprawdzenie wydajności strony. Dużo osób na to uwagi nie zwraca a to spory błąd mogący istotnie wpłynąć na ocenę zawartości strony przez odbiorcę.
Do weryfikacji wykorzystałam narzędzie PageSpeed Insights. Służy ono do analizy szybkości ładowania się rożnych elementów na stronie, ale nie tylko. Ogólny wynik dla mojej strony okazał się całkiem niezły i nie odbiegał od tego co oczekiwałam (mam problemy z serwerem).
Aplikacja również doradziła mi bym zastąpiła ilustracje na mojej stronie obrazami następnej generacji (next-gen formats) – gdyż mają one dużo lepszą kompresję (szybciej się ładują na stronę internetową). Takimi formatami są:
Jeszcze jakiś temu formatów tych było więcej jednak nie wszytki z nich były poprawnie obsługiwane przez przeglądarki internetowe. Nie zdziwiła bym się gdyby ta lista za jakiś czas również uległa zmianie.
Na początek warto też tu wspomnieć, że tak naprawdę nie są to nowe formaty (np. WebP – powstał w 2010 roku, czyli format ten już liczy sobie kilka lat). Nie mniej jednak są to inne formaty niż te z których na co dzień korzystamy. Czyli formaty takie jak JPG, PNG! Były one też jeszcze niedawno praktycznie nie obsługiwane przez większość przeglądarek.
Zapewne większość z was miała okazję już natknąć się na obrazy w formacie AVIF i WebP. Aktualnie na stronach najczęściej można spotkać pliki w formacie WebP. Właściwie to nie wiem czy z AVIF miałam do czynienia kiedykolwiek.
Ten format z kolei został stworzony przez Google. Obsługiwany jest więc przez większość ich produktów (np. systemy android, Chrome ). Wydaje mi się, że aktualnie jest to też najpopularniejszy typ plików z całej tej grupy.
Zdjęcia generowane w tym formacie jakościowo przypominają te w JPG jednak są dużo od nich lżejsze. Istotną rzeczą jaką warto o nich wiedzieć jest że:
Wygląda na to, że ten plik to taka mała rewolucja. Niestety póki co nie jest obsługiwany przez większość przeglądarek. ?
Jeszcze kilka lat temu Google Polecał także inne formaty takie jak: JPEG 2000, JPEG XR
Jest to nieco lepsza wersja standardowego rozszerzenia JPG. Chociaż trudno mi to ocenić bo mój komputer nie rozpoznaje plików tego formatu.
Do otwarcia potrzeba:
Zaletą plików typu JPEG 2000 jest nieco lepsza jakość obrazu w stosunku do JPG przy zachowaniu tego samego stopnia kompresji. Obrazy zapisywane w tym standardzie stanowią również konkurencję dla PNG. Ponieważ obraz może zostać skompresowany bezstratne.
Pliki w tym standardzie wykorzystywane są głównie do przechowywania skompresowanego obrazu bitmapowego nie są więc przynajmniej na na razie powszechnie używane.
Standard ten posiada kila wersji rozszerzeń – .JPF, .JPX, .JP2, .J2C, .J2K, .JPC
JPEG XR znany również pod nazwami HD Photo, Windows Media Photo to jak nietrudno się domyślić format stworzony przez firmę Microsoft w celu zastąpienia JPEG i JPEG 2000.
Format ten ma dużo lepszą konwersję. W związku z tym, że jest to dość nowy format nie jest on jednak obsługiwany przez wszystkie przeglądarki internetowe.
O tym formacie możecie poczytać nieco szerzej na stronie https://docs.microsoft.com/en-us/windows/desktop/wic/jpeg-xr-codec
Zestawianie na 24.06.2019
| Format | Przezroczystość | Animacja | Przeglądarka |
|---|---|---|---|
| GIF | Tak | Tak | Wszystkie |
| PNG | Tak | Nie | Wszystkie |
| JPEG | Nie | Nie | Wszystkie |
| JPEG XR | Tak | Tak | IE |
| WebP | Tak | Tak | Chrome, Opera, Android |
Obsługa formatów przez przeglądarki
Na pewno pliki „nowej generacji” są dosyć ciekawe jednak ja bym je osobiście zaczęła wprowadzać z lekką rezerwą. W końcu nie każda przeglądarka je jeszcze obsługuje (przypominam, że tak naprawdę to nie są nowe formaty). Co w efekcie może mieć różne skutki jak np. brak zdjęcia na stronie. Dlatego jeśli nie czujecie się przekonani i wolicie pozostać przy sprawdzonych formatach warto byście przeczytali ten wpis.
Oczywiście nikomu nie zabraniam testowania tych formatów samą mnie one kuszą. W końcu lepsze jest wrogiem dobrego. A nam zależy na szybkości strony. Warto tu także wspomnieć, że ostatnimi czasy dużo większą popularnością cieszy się format SVG. Pliki tego typu wyświetlają się we wszystkich nowych przeglądarkach. Z pewnością daje to więc temu formatowi przewagę.
źródła:
Jak w przypadku wielu różnych tematów tak i w przypadku marki osobistej pojawiło się przez…
Choć zabrzmi to może nieco dziwnie to wprowadzenie AI (sztucznej inteligencji) do naszego życia było…
Widmo Brockenu to dość rzadko spotykane zjawisko optyczne, najczęściej widywane w wysokich partiach gór. Można…
Zacznę może od tego, że relikwia, relikwii nie równa. Wiem jeśli nie ma się pojęcia…
Logo stanowi jeden z ważniejszych elementów tożsamości wizualnej praktycznie każdej firmy, marki czy projektu. Logo…
Budując własną markę osobistą lub chcąc ją zbudować trzeba liczyć się z wieloma wyzwaniami. Jednym…
