Ktorý formát je lepší: PNG alebo JPG?

Najpopulárnejšie formáty obrázkov na webových stránkach sú PNG alebo JPG, GIF a čoraz častejšie aj WebP. Aké sú rozdiely medzi týmito formátmi? Ktoré z nich používajú stratovú kompresiu a ktoré bezstratovú? Dnes sa pozrieme na to, ktorý z nich sa oplatí použiť ako najlepší pre grafiku na vlastnú stránku.

Čo je formát PNG?

Obrázkový formát PNG používa pri ukladaní bezstratovú kompresiu, čo znamená, že vytvára väčšie súbory, ale zachováva vyššiu kvalitu grafiky. Podporuje 48-bitovú farebnú hĺbku a alfa kanál – teda podporuje priehľadnosť.

Výhody a nevýhody formátu PNG? Medzi výhody patrí bezstratová kompresia a vysoká kvalita obrazu. V porovnaní medzi PNG alebo JPG je nevýhodou PNG predovšetkým väčšia veľkosť súborov. Tento formát sa využíva na návrh loga, grafy, infografiky či ilustrácie.

PROTIP: Ak chceme uložiť logo vo formáte PNG bez pozadia – použijeme práve tento formát a uložíme ho bezstratovo vo veľkom pôvodnom rozmere. Pri tvorbe finálneho návrhu tento súbor s logom vložíme do projektu a až potom upravíme jeho veľkosť.

JPG – čo je to za formát?

Obrázkový formát JPEG známy ako JPG je zároveň názvom algoritmu, ktorý pri ukladaní súbor komprimuje – vďaka tomu má menšiu veľkosť a rýchlo sa načítava. Nižšia veľkosť sa však prejaví aj nižšou kvalitou a JPG nepodporuje priehľadnosť.

Použitie JPG súborov? Ideálne riešenie pre fotografie, ktoré sa majú rýchlo načítať na webe, pre grafiku na sociálne siete či bannery a veľké pozadia.

Výhody a nevýhody formátu JPG: Medzi výhody patrí nízka veľkosť súborov a vysoká kompresia. Nevýhodou je absencia podpory priehľadnosti a strata kvality pri opakovanom ukladaní.

PROTIP: Ak chceme na web vložiť veľkú fotografiu ako pozadie, skontrolujeme v šablóne požadované rozmery v pixeloch a fotografiu podľa toho orezávame a škálujeme. Následne ju uložíme s JPG kompresiou na úrovni 80 % a 70 %.

Objavte tiež 8 spôsobov, ako zvýšiť predaj na Instagrame.

GIF – čo to znamená?

Na rozdiel od PNG alebo JPG sa formát GIF často používa na jednoduché, opakujúce sa animácie na webových stránkach. Tiež používa bezstratovú kompresiu. Dnes je voľne použiteľný, ale najčastejšie sa využíva na animácie.

PROTIP: Ak máme fotografie produktu z rôznych uhlov, môžeme z nich vytvoriť GIF, ktorý sa bude opakovane prehrávať napríklad každú pol sekundu.

PNG alebo JPG – kedy ich použiť?

Poznáme najpopulárnejšie formáty grafiky, ostáva otázka, ktorý si vybrať – PNG alebo JPG? Odpoveď nie je jednoznačná. Vždy treba zvoliť formát podľa konkrétneho účelu.

• Ak potrebujeme, aby bol veľký súbor ľahký a rýchlo sa načítal – uprednostníme JPG.
  
  
• Ak nám záleží na vysokej kvalite obrazu – zvolíme PNG.
  
  
• Ak chceme použiť grafiku s priehľadným pozadím – vyberieme PNG.
  
  
• Ak potrebujeme animovanú grafiku – GIF bude správna voľba.
  
  

Má formát obrázka význam pre SEO?

Odborníci sa v názoroch rozchádzajú, no väčšina tvrdí, že samotný formát PNG alebo JPG obrázka nie je pre SEO rozhodujúci. Najdôležitejšia je správna optimalizácia: obrázok sa má správne zobraziť, byť kvalitný a korektne vložený v HTML/CSS – teda musí byť responzívny na PC aj mobiloch. Dôležitejšie než samotný formát je správne pomenovanie súboru (podľa obsahu a s kľúčovým slovom) a doplnenie ALT textov.

Výhody a nevýhody formátu WebP

Formát WebP, ktorý vyvinul Google, spája výhody PNG alebo JPG. Podporuje stratovú i bezstratovú kompresiu a zároveň aj priehľadnosť. Vďaka moderným algoritmom umožňuje zníženie veľkosti grafických súborov pri zachovaní vysokej kvality. Preto je v súčasnosti jedným z najlepších riešení na optimalizáciu obrázkov pre web.

Nevýhoda: WebP nemusí byť podporovaný staršími prehliadačmi.

Ak potrebujete poradiť s výberom obrázkovým formátov, obráťte sa na SEO expertov z WeNet SK .