Google Partner arturkosinski.pl
Skontaktuj się
Wyszukaj na stronie...
Zamknij wyszukiwarkę

Czym są obrazy w formatach nowej generacji i dlaczego warto je stosować?

Ostatnia aktualizacja treści Ostatnia aktualizacja: 1 lutego 2023

W ostatnich latach popularność w temacie optymalizacji stron internetowych zyskują obrazy w formatach nowej generacji. W tym artykule wyjaśniam czym są te formaty, dlaczego warto je stosować i jak wdrożyć taką optymalizację obrazów na stronie internetowej opartej na platformie WordPress. Zapraszam do lektury.

Czym sa obrazy w formatach nowej generacji i dlaczego warto je stosowac

Z tego artykułu dowiesz się:

  • czym są formaty nowej generacji?
  • dlaczego warto stosować obrazy w formatach nowej generacji na stronach www?
  • jak wdrożyć formaty nowej generacji na stronie opartej na WordPress?

Czym są formaty nowej generacji?

Standardowe obrazy, jakie znamy, mają zwykle rozszerzenie typu JPG, PNG, czy BMP. Formaty nowej generacji mają z kolei rozszerzenia np. AVIF lub WebP. Mówiąc w skrócie – tego typu formaty obrazów mają lepsze parametry kompresji i jakości i są zalecane do stosowania na stronach internetowych.

Obrazy w formacie WebP

Format WebP został opracowany przez firmę On2 Technologies (został zaprezentowany w 2010 roku), która została wykupiona przez Google, a sam format od czasu wykupu jest rozwijany właśnie przez giganta z Mountain View. Pierwszą przeglądarką obsługującą ten format był Chrome, zaś obecnie obsługuje go każda nowoczesna przeglądarka. Co ciekawe, cytując Wikipedię, „Rozmiar obrazów PNG przy kompresji bezstratnej WebP zmniejsza się o 26%. Przy kompresji stratnej obrazów JPG rozmiar zmniejsza się zależnie od jakości takiej kompresji. Przy zachowaniu jakości na poziomie 80% WebP rozmiar obrazów JPG zmniejsza się nawet o 85%”.

webp wsparcie przegladarek

Obrazy w formacie AVIF

Format AVIF został opracowany przez Alliance for Open Media (AOMedia) – organizację non-profit skupiającą się na rozwoju otwartego oprogramowania. W porównaniu do WebP to dość świeży projekt, bo opracowany w 2019 roku. Podobnie jak w WebP, format AVIF zapewnia lepszą kompresję plików graficznych. Wsparcie przeglądarek dla AVIF wygląda nieco gorzej (na moment pisania tego artykułu):

avif wsparcie przegladarek

Dlaczego należy stosować formaty nowej generacji na stronach internetowych?

Obrazy w formatach nowej generacji są lżejsze i lepiej zoptymalizowane. Pozwalają na szybsze wczytywanie strony internetowej, co jest jednym z kluczowych parametrów w takich działaniach jak pozycjonowanie stron, czy poprawa wyniku jakości kampanii Google Ads. Jeśli zweryfikujesz wydajność swojej strony internetowej w narzędziu typu PageSpeed Insights, prawdopodobnie natrafisz na taki komunikat:

formaty nowej generacji

W tym momencie warto zainteresować się wdrożeniem formatów nowej generacji na swojej stronie internetowej. Prawdopodobnie wykonanie tego działania poprawi nieco Twoje pozycje w wyszukiwarce Google, być może sprawi że obniży się średni koszt kliknięcia w reklamy Google Ads, a z pewnością pozytywnie wpłynie na UX strony (doświadczenie użytkownika z korzystania z niej).

Jak wdrożyć formaty nowej generacji na WordPressie?

Na szczęście wdrożenie formatów nowej generacji w przypadku platformy WordPress nie jest skomplikowane i przy odrobinie wysiłku możesz zrobić to nawet samodzielnie. Jeśli jednak nie czujesz się na siłach lub obawiasz się zepsucia strony, skontaktuj się ze mną, a pomogę Ci to wdrożyć.

webp avif

  • Wykonaj kopię zapasową serwisu i bazy danych
  • Przejdź do panelu administracyjnego WordPress do zakładki Wtyczki
  • Upewnij się że nie masz już zainstalowanej wtyczki do obsługi formatów nowej generacji – być może już ją masz, ale nie została skonfigurowana
  • Jeśli nie znalazłeś w swoim panelu zainstalowanej już wtyczki, kliknij przycisk Dodaj nową w górnej części panelu
  • W wyszukiwarce wtyczek wpisz np. frazę „webp”
  • Sprawdź jakie są aktualnie polecane wtyczki, zainstaluj i włącz jedną z nich. Do celów instruktażowych wykorzystam wtyczkę o nazwie „Converter for Media – Optimize images | Convert WebP & AVIF”.
  • Po instalacji wtyczki przejdź do jej ustawień (Ustawienia / Converter for media) – uwaga, inne wtyczki niż omawiana mogą mieć ustawienia w innym miejscu panelu
  • Wybierz strategię formatowania (np. Optymalną) oraz rodzaj pliku wyjściowego (np. WebP), po czym zapisz zmiany guzikiem poniżej
  • Uruchom masową optymalizację obrazów w całej bibliotece mediów
  • Po pozytywnej optymalizacji sprawdź czy obrazy na Twojej stronie wyświetlają się poprawnie (najlepiej w trybie incognito)

formaty nowej generacji wordpress

To już wszystko, co należy zrobić aby wdrożyć formaty nowej generacji na stronie WordPress. Gratulacje!

woohoo yeah

Masz pytania na ten lub inny temat?

Skontaktuj się

Zobacz także

Jak wykonuję projekt strony internetowej? Praktyczny przykład.

Kategorie: Strony internetowe

Jak przebiega u mnie projektowanie strony internetowej? Pozwól, że pokażę ci na praktycznym przykładzie na ekranie. Z tego filmu...

Czytaj więcej

Instrukcja Google Analytics 3 (podstawy)

Kategorie: Strony internetowe E-commerce Przydatne narzędzia

Ten film i artykuł dotyczy starej wersji Google Analytics 3 (Universal Analytics). Zapraszam do obejrzenia instrukcji Google Analytics 4...

Czytaj więcej

Przegląd treści na stronie internetowej – dlaczego i kiedy warto go robić?

Kategorie: Strony internetowe

W tym artykule chciałbym zwrócić Twoją uwagę na ważne zagadnienie, jakim jest przegląd i aktualizacja treści na stronie internetowej....

Czytaj więcej

Zakup strony internetowej – krok po kroku

Kategorie: Strony internetowe

Jeśli planujesz założyć stronę internetową to z tego filmu dowiesz się czego możesz się spodziewać w trakcie współpracy z...

Czytaj więcej

Masz czat / Messenger na stronie? Sprawdź ten częsty błąd

Kategorie: Strony internetowe E-commerce

Cześć, jeśli masz (lub planujesz mieć) na swojej stronie internetowej wtyczkę czatu np. Messenger lub inny to koniecznie sprawdź,...

Czytaj więcej
strony www olsztyn

Rozważasz współpracę ze mną?

Sprawdź, dlaczego warto.

Bezpośredni kontakt
Rozwiń informację
Współpracowałeś kiedyś z agencją i wiesz jak ciężko się komunikować z supportem? U mnie jest inaczej. Wykonuję osobiście większość prac i kontaktujesz się tylko ze mną.
Działania, które przynoszą efekty
Rozwiń informację
Przez lata testowałem (i nadal to robię) różne rozwiązania by skupić się na tych, które po prostu działają.
Szybkie terminy realizacji
Rozwiń informację
Większość zleceń wykonuję przed zadeklarowanym terminem. Nie obiecuję gruszek na wierzbie!
Transparentność
Rozwiń informację
Przekazuję wszelkie dostępy do stron internetowych, kont reklamowych, analityki. Rozliczenia ze mną są klarowne, każda oferta opisana jest w sposób, z którego jasno wynika podział mojego wynagrodzenia oraz opcji dodatkowych (jak płatne wtyczki do stron internetowych, czy budżety reklamowe w kampaniach marketingowych).
Jakość agencji w cenie freelancera
Rozwiń informację
Wąska specjalizacja w konkretnych rozwiązaniach internetowych (tworzenie stron i sklepów internetowych WordPress, marketing online w ekosystemie Google, marketing wideo w internecie) pozwala realizować skuteczne usługi niższym kosztem niż duże firmy.
Ciągły rozwój
Rozwiń informację
Od 2010 roku, kiedy wykonałem pierwsza stronę internetową, stale podnoszę kwalifikacje w obszarach swojej specjalizacji poprzez najróżniejsze kursy, szkolenia, grupy branżowe, itd.
Darmowa dawka wiedzy
Rozwiń informację
Dzielę się wiedzą, doświadczeniem i przydatnymi wskazówkami na blogu i kanale YouTube za darmo - sprawdź i subskrybuj kanał oraz newsletter. Zobacz także kurs płatny - wykład mp3 na temat podstawowych form zdobywania klientów przez internet.
Certyfikowany ekspert
Rozwiń informację
Moja wiedza z zakresu prowadzenia kampanii reklamowych potwierdzona jest certyfikatami Google Ads z różnych kategorii oraz statusem Google Partner.
Bogate doświadczenie
Rozwiń informację
Współpracowałem łącznie z kilkoma setkami firm i osób prywatnych, organizacjami małymi i dużymi, ministerstwami, związkami sportowymi, firmami zagranicznymi, itd.
Wszystko w jednym miejscu
Rozwiń informację
Od budowy strony internetowej, przez skuteczne formy marketingu po analitykę i optymalizację działań - wszystko u jednego, solidnego dostawcy.

Skontaktuj się

 

Zapisz się na mój newsletter i otrzymuj darmowe porady oraz informacje o promocjach.

function ml_webform_success_1807946(){try{window.top.location.href="https://arturkosinski.pl/newsletter/potwierdz-swoj-adres-e-mail/"}catch(o){window.location.href="https://arturkosinski.pl/newsletter/potwierdz-swoj-adres-e-mail/"}} .

Poznaj opinie moich Klientów

referencje Artur Kosiński 2

Z przyjemnością rekomenduję firmę Pana Artura jako bardzo profesjonalnego dostawcę rozwiązań internetowych opartych na WordPress. Rozpoczęliśmy od prostych stron typu landing page. Byliśmy tak bardzo zadowoleni z każdego kolejnego projektu, że zdecydowaliśmy się współpracować gdziekolwiek jest to możliwe, m.in. przy optymalizacji, utrzymaniu, projektowaniu, itd.

Filip, crescendoapp.com
referencje artur kosinski

Z firmą Pana Artura prowadzimy stałą współpracę przy promocji naszych gabinetów kosmetycznych. Od czasu rozpoczęcia współpracy widzimy znaczny wzrost ilości nowych klientów. Polecam wszystkim firmom, które chcą rozwinąć skrzydła.

Kasia, chimera.olsztyn.pl
referencje Artur Kosiński 1

Współpraca między naszymi firmami rozpoczęła się w 2015 roku, trwa do dzisiaj i odbywa się online. Zakres współpracy obejmuje tworzenie wielu stron www, pozycjonowanie strony i projekty graficzne. Wszystkie usługi były realizowane terminowo i cechowały się wysoką jakością.

Steve, treatmed.pl
referencje-miejskie-ziele

Pan Artur nigdy nie użył słów “nie da się”, sam zaproponował najbardziej optymalne rozwiązania i możliwości. Współpracując miałam poczucie pełnego wsparcia i bezpieczeństwa.

Małgorzata, miejskieziele.pl

Masz pytania? Skontaktuj się ze mną.

Przejdź do kontaktu
Zamknij okno

Zapisz się na mój newsletter i otrzymuj więcej darmowych materiałów.

Dostępność WCAG