Vaizdo formatai: WebP, PNG, JPG ir SVG palyginimas
Netinkamo vaizdo formato pasirinkimas gali pailginti puslapio įkėlimo laiką arba sugadinti grafiką. Štai kaip šiuolaikiniai žiniatinklio formatai lyginami pagal glaudinimą, permatomumą ir ryškumą.
Jūsų failai apdorojami tik jūsų interneto naršyklėje naudojant HTML5 Canvas ir WebAssembly. Jokie duomenys niekada nepalieka jūsų įrenginio.
Praleiskite įkėlimo ir atsisiuntimo eiles. Konvertavimas vyksta lokaliai visu įrenginio aparatinės įrangos greičiu be jokių serverio apribojimų.
Atitinka oficialias ISO, W3C ir IETF specifikacijas, užtikrinančias išvesties suderinamumą šiuolaikinėse operacinėse sistemose.
Formatų palyginimas ir techninės specifikacijos
| Išvesties formatas | MIME tipas | Specifikacija | Tipas |
|---|---|---|---|
| PNG paveikslėlis | image/png | W3C-PNG | Nešiojamoji tinklo grafika |
| JPG JPEG paveikslėlis | image/jpeg | ITU-T-T81-JPEG | Jungtinė fotografijos ekspertų grupė |
| WebP paveikslėlis | image/webp | RFC-6386-VP8 | „Google" WebP modernus vaizdo formatas |
| SVG vektorius | image/svg+xml | W3C-SVG | Keičiamo mastelio vektorius grafika |
| HEIC nuotrauka | image/heic | ISO-IEC-23008-12-HEIF | Didelio efektyvumo vaizdo konteineris |
| AVIF paveikslėlis | image/avif | AOMEDIA-AV1-AVIF | AV1 vaizdo failo formatas |
| PSD Photoshop Document | image/vnd.adobe.photoshop | ADOBE-PSD-SPEC | Adobe Photoshop Document |
| PSB Photoshop Large Document | image/vnd.adobe.photoshop | ADOBE-PSD-SPEC | Adobe Photoshop Large Document |
| WMF Windows Metafile | image/x-wmf | MS-WMF-SPEC | Windows Metafile Vector Format |
| EMF Enhanced Metafile | image/x-emf | MS-EMF-SPEC | Enhanced Metafile Vector Format |
| JFIF Image | image/jpeg | ITU-T-T81-JPEG | JPEG File Interchange Format |
| TGA Truevision | image/x-tga | TGA-SPEC | Truevision pažangusis rastras |
| PCX ZSoft | image/x-pcx | PCX-SPEC | ZSoft Paintbrush PCX Bitmap |
Techninės specifikacijos ir kodekų apžvalga
Greitojo formato pasirinkimo taisyklė
Šiuolaikinėse svetainėse naudokite WebP arba AVIF (30% mažesni nei JPEG su permatomumo palaikymu). Naudokite JPG nuotraukoms, kuriose maži, nepastebimi glaudinimo defektai neturi reikšmės. Naudokite PNG ekrano kopijoms, naudotojo sąsajos grafikai ir iliustracijoms, kurioms reikia ryškaus teksto. Naudokite SVG logotipams ir piktogramoms, kurioms reikalingas begalinis mastelio keitimas.
Rastriniai ir vektoriniai vaizdai: kodėl SVG niekada neišsilieja
Rastriniai vaizdai (JPG, PNG, WebP) yra fiksuotų spalvų pikselių tinkleliai - pernelyg priartinus jie tampa neryškūs arba pikseliuoti. SVG yra gryna matematika: joje saugomos matematinės linijos, kreivės ir spalvos, todėl piktogramos ir iliustracijos atrodo itin ryškiai visur - nuo mobiliųjų ekranų iki 8K ekranų - ir užima nedaug vietos.
Mitas: „Didesnė DPI reikšmė reiškia geresnę vaizdo kokybę internete"
DPI (taškai colyje) yra tik fizinio spausdinimo instrukcija, kurios interneto naršyklės visiškai nepaiso. Telefonuose ir kompiuterių monitoriuose vaizdo ryškumą lemia tik pikselių matmenys (pvz., 1920x1080) ir ekrano tankis, o ne įterptieji DPI metaduomenys.
Alfa permatomumas: PNG ir WebP palyginimas
Tradicinis JPG visiškai nepalaiko permatomumo - permatomi fonai tampa visiškai baltais arba juodais. PNG pradininkas buvo švarus 8 bitų alfa permatomumas, tačiau dabar WebP užtikrina identišką permatomumo kokybę ir iki 40 % mažesnį failo dydį.
0 baitų įkelta į išorinius serverius. Visas apdorojimas vyko vietoje, jūsų naršyklės smėlio dėžėje (sandbox).