Format WebP - cum să îl utilizați și de ce este necesar. Formatul WebP misterios și convenabil în web design și pentru Photoshop
este un format de imagine dezvoltat de Google în 2010. A fost creat ca o alternativă la formatele PNG și JPG. Folosind WebP, puteți crea imagini mult mai mici decât formatele tradiționale JPG și PNG fără a degrada calitatea imaginii.
De ce este nevoie de WebP?
WebP este un format de imagine foarte util, deoarece oferă atât optimizări de performanță, cât și funcționalitate bogată. Spre deosebire de alte formate, WebP acceptă atât compresia cu pierderi, cât și fără pierderi, precum și transparența și animația.
| WebP | PNG | JPG | GIF | |
| Compresie cu pierderi | + | + | + | — |
| Compresie fără pierderi | + | + | + | + |
| Transparenţă | + | + | — | + |
| Animaţie | + | — | — | + |
Chiar și cu această funcționalitate bogată, formatul WebP oferă fișiere de dimensiuni semnificativ mai mici decât alternativele sale. Într-un studiu comparativ al acestor formate de imagine, s-a constatat că imaginile WebP comprimate cu pierderi erau în medie cu 30% mai mici decât JPG, iar imaginile WebP fără pierderi erau în medie cu 25% mai mici decât PNG.
Cum se convertesc imagini în WebP
Există deja câteva instrumente pentru a converti cu ușurință JPG, PNG și alte formate de fișiere în WebP.
Convertoare online în WebP
- Squoosh- un instrument pentru conversia și compararea formatelor de imagini de la Google
- Online-Convert.com- convertor online
Instrumente de linie de comandă pentru WebP
Deși acest lucru este destul de mult, nu este suficient pentru a evita să faceți o rezervă pentru browsere neacceptate. În caz contrar, unii utilizatori nu vor vedea imaginea.
Imaginile pot fi salvate folosind elementul
Pentru a oferi o sursă alternativă de imagine, folosim
La element
- tip: tip fișier sursă MIME;
- srcset: Calea către fișierul imagine. Pentru a afișa o imagine de dimensiuni diferite, puteți utiliza mai multe fișiere (vezi)
- dimensiuni: Lista dimensiunilor fiecărui fișier sursă (vezi articolul de mai sus)
- media: o interogare media pentru a determina ce sursă va fi folosită pentru afișarea imaginii.
Pe lângă elemente Tuturor ne place să „plimbăm” prin Internet și să vizităm anumite site-uri. Și nu este un secret pentru nimeni că atunci când vizualizați un număr mare de imagini cu mâncare, natură, capturi de ecran din filme sau jocuri video, încărcarea unei pagini de site poate fi întârziată mult timp. Acest lucru este vizibil mai ales pe dispozitivele mobile sau dacă aveți multe file deschise în browserul computerului. Desigur, oricât de frumos și funcțional ar fi designul web, vizitatorii încearcă fie să întrerupă încărcarea imaginilor, fie pur și simplu să părăsească site-ul. Ce se întâmplă dacă imaginile în sine au dimensiuni uriașe (lățime-înălțime)? Sunt puține în sat, dar sunt pur și simplu maiestuoase (formate 2K, 4K). La urma urmei, aproape toți ne dorim să vedem fotografii frumoase sau capabilitățile plăcilor video grafice. Ce putem spune, de multe ori întregul web design este creat în întregime din imagini. Fie acestea sunt dungi, fie pătrate cu textură, fie clipart și așa mai departe. Într-un cuvânt, imaginile în cantități mari sau dimensiuni mari pot fi folosite în moduri diferite și pe o varietate de site-uri. Cum poate fi rezolvată o astfel de problemă și este necesar? Ne vom uita la una dintre metodele care a fost de fapt folosită de multe site-uri în ultimii ani și, desigur, ne vom da seama cum Photoshop poate ajuta în acest sens și dacă este necesar. ÎNCEPE… Soluția la problema compresiei imaginii este variată și fiecare persoană își alege singur ceea ce este mai convenabil pentru el. Există un număr imens de moduri de a reduce dimensiunea unei imagini fără a degrada în mod evident calitatea, dar astăzi vom vorbi despre formatul WebP. A fost creat de Google în 2010 special pentru optimizarea îmbunătățită a imaginii. Funcționează cu toate formatele deja cunoscute și astăzi în 2017 este o alternativă foarte bună la PNG sau JPEG. Pentru a vizualiza despre ce am început conversația, să comparăm calitatea imaginii în JPEG și WebP la același procent de compresie. În exemplul de mai sus, practic nu există diferențe vizuale, sau mai degrabă sunt invizibile la compresie de 70%. Dar in acelasi timp versiunea JPEG cântărește 49,8 Kb, iar versiunea WebP cântărește 15 Kb, în consecință, procentul de compresie în al doilea caz poate fi crescut fără teama de o dimensiune mare a fișierului. Nu prea rău, având în vedere că vizual sunt aproape identice. Apare o întrebare rezonabilă: astfel de imagini se vor deschide și se vor încărca pe pagina site-ului în browsere și care? Deoarece formatul WebP a fost creat de Google, atunci, în consecință, există și suport în Chrome, Yandex și Opera. În general, suportul este oferit în 90% dintre browsere, inclusiv versiunile mobile. Din păcate, nu există suport în IE și Edge în mod implicit. Este important să înțelegeți că WebP nu este și nu poate fi perceput, în nicio circumstanță, ca un înlocuitor 100% pentru PNG și JPEG. Acest format este doar pentru browserele care pot lucra cu el, dar, fără îndoială, va fi necesar să existe un alt format pentru alte browsere. Pe de altă parte, există întotdeauna mici polyfill-uri și biblioteci care permit browserelor să lucreze cu acest sau acel „truc”. Dar mai multe despre asta mai jos. Cel mai simplu mod de a lucra cu WebP este, desigur, Photoshop, pentru care Telegraphics a creat și un plugin special pentru diferite versiuni cu adâncime de biți. După ce îl instalați (copiați-l în folderul cu pluginuri), aplicația va avea o opțiune în meniul „ Salvează ca…» selectați formatul WebP din lista verticală. Caseta de dialog vă permite să reglați calitatea utilizând un glisor, filtrare, zgomot și claritate. Vă rugăm să rețineți că conform fișierului readme atașat în arhivă, se prevede că în versiunea Windows funcționalitatea pluginului este mai mică decât în versiunea pentru Mac OS. În plus, pluginul pentru Photoshop nu vă permite să utilizați „ Salvați pentru web...", și nu există nici o previzualizare a imaginii salvate, așa cum este cazul JPEG. Prin urmare, până când nu salvați fișierul și îl deschideți pentru vizualizare, nu veți ști ce iese sau cât de mare va fi fișierul. O altă opțiune de conversie este utilizarea unui convertor online - Imagine online-convert. Nu funcționează mai rău decât în Photoshop, dar datorită acestuia este mai rapid și mai convenabil să convertești fișiere în loturi. După cum am spus mai sus, aproape toate browserele în prezent (jumătatea lunii mai 2017) acceptă WebP în mod implicit. Cu toate acestea, computerele utilizatorilor pot avea instalate versiuni mai vechi de browsere sau cele care nu acceptă formatul. Există două opțiuni convenabile pentru afișarea imaginilor în WebP. Care este diferența semnificativă dintre ambele biblioteci? In primul caz etichetă img pe pagini nu se schimbă, doar schimbați singur extensia fișierului de la JPEG la WebP. În al doilea caz, formatul WebP este folosit pentru a reprezenta imaginea, dacă este suportat, iar dacă nu, este înlocuit cu JPEG. Cu această opțiune va trebui să vă schimbați etichete img pe Wanderers, conversia automată a formatelor are loc „din mers”, așa că este dificil de spus care dintre ele funcționează mai bine. De asemenea, puteți utiliza cod pentru fișierul .htaccess, care va verifica compatibilitatea browserului pentru WebP și, dacă răspunsul este negativ, va înlocui imaginea cu JPEG. În acest caz, toate imaginile trebuie să fie în același folder și de aceeași dimensiune (lățime + înălțime). Astfel, un web designer și dezvoltatorii pot folosi formatul WebP dacă proiectul, site-ul, este orientat către browsere moderne. Apoi va funcționa și va fi afișat pe pagini. Inițial, Windows nu acceptă acest format și, în timp ce Telegraphics a creat un plugin pentru Photoshop, Google a lansat un plugin pentru posibilitatea de a vedea fișierele de imagine în Windows Photo Viewer obișnuit. Acest plugin creează, de asemenea, previzualizări de imagini în Explorer pentru Microsoft Office Picture Manager. Descărcarea este mai jos. Dezvoltatorii de aplicații PaintShop Pro, IrfanView, Picasa, XnView, Gimp, Paint.NET și alții au creat și suport WebP, care poate fi descărcat direct de pe site-urile lor oficiale. Deoarece am afirmat de mai multe ori că formatul de fișier imagine WebP nu poate fi un înlocuitor cu drepturi depline pentru JPEG, este rezonabil ca mulți dintre noi să avem mai devreme sau mai târziu o întrebare: este necesar acest format și în ce cazuri este utilizat. justificat? Dacă proiectul implică utilizarea unui număr mare de imagini de diferite dimensiuni și rezoluții, atunci, desigur, acest format ar trebui introdus. În ceea ce privește suportul pentru browser, în fiecare an, dacă nu jumătate de an, în întreaga lume, versiunile vechi devin un lucru din trecut, la fel ca versiunile vechi de Windows. XP, Vista și 7 aproape nu mai sunt folosite. Același lucru este valabil și pentru browserele învechite, mai ales că aproape toate se actualizează automat dacă sunt instalate. În consecință, nu există suport WebP în cazuri izolate, care ar putea să nu fie atât de critice pentru proiect. Pe de altă parte, există biblioteci și capacitatea de a utiliza dublarea JPEG și conversia din mers. Cu toate acestea, trebuie să rețineți că acest format nu este utilizat pe scară largă, așa că trebuie să aveți variații JPEG la îndemână. Și aici din nou există o dualitate: dacă browserele vizitatorilor site-ului au suport pentru WebP, atunci de ce să nu le oferim încărcare aproape instantanee a ceva care va dura mult mai mult pentru încărcare pentru alții? La urma urmei, în general, acest lucru va avea doar un efect pozitiv asupra conversiei site-ului. Un alt plus - suport pentru transparență (canal alfa), adică similar cu formatul PNG. Și dacă în PNG imaginea cântărește mai mult de 7 Mb, atunci în WebP este de aproximativ 700 Kb. Prima dată când vizitați un anumit site, este imposibil să spuneți cu certitudine dacă WebP este utilizat sau nu. Chestia este că imaginile pot fi convertite în JPEG. Dar puteți determina unde exact pe pagină există WebP și unde este JPEG prin consola pentru dezvoltatori. De exemplu, un portal de jocuri video Stevivor
Convertește capturi de ecran, hărți și imagini mari în WebP pentru a menține calitatea și dimensiunea mică. Există o mulțime de jocuri video, ghiduri pentru fiecare joc și chiar mai multe imagini - utilizarea este 100% justificată. Telegramă
salvează imaginile autocolante în format WebP, care sunt atât de populare atât pe versiunea desktop a rețelei sociale, cât și pe mobil. WebP este un nou format de compresie a imaginilor dezvoltat de Google pentru a fi utilizat pe web. Mai simplu spus, noul format este conceput pentru a face experiența web mai rapidă și mai bună - atât pe computere desktop, cât și pe dispozitive mobile. Când comparăm JPEG cu WebP, calitatea imaginii lor este aceeași, dar fișierul WebP poate fi cu peste 30% mai mic ca dimensiune. Aceasta înseamnă că proprietarii de site-uri web pot publica în siguranță imagini de înaltă calitate, fără a se teme că site-urile lor se vor încărca lent și vor afecta în mod serios traficul utilizatorilor, în special pe cele care provin de pe dispozitive mobile. Unele site-uri web populare, cum ar fi Facebook și Google, folosesc deja această tehnologie de compresie a imaginii pentru a oferi navigare rapidă pe smartphone-uri și tablete. Google WebP acceptă metadate, comprimarea fișierelor cu pierderi și fără pierderi și transparența găsită în imaginile PNG. În general, din punct de vedere tehnic, noul format poate înlocui animația JPEG, PNG și GIF. Există o problemă pe care o veți întâlni după descărcarea unui fișier WebP pe computer, și anume, pur și simplu nu veți putea să-l vizualizați. Cert este că formatul se află într-un stadiu incipient al dezvoltării sale și nu este încă acceptat peste tot. Acest format nu poate fi deschis utilizând instrumentele standard Windows. Din fericire, Google a lansat deja un codec WebP pentru sistemul de operare Microsoft. Acest codec include tot ce aveți nevoie pentru a deschide fișiere WebP pe Windows 8, Windows 7, Vista și chiar XP folosind vizualizatorul de imagini încorporat. Procesul de instalare este foarte simplu. Descărcați fișierul WebPCodeSetup.exe de pe site-ul Google Developer, faceți dublu clic pe el și urmați instrucțiunile simple ale asistentului de instalare. Acesta este un nou format de imagine de la Google care utilizează atât compresie cu pierderi (compromis între calitate și dimensiune) cât și fără pierderi (reduce dimensiunea fără a compromite calitatea). Google dezvoltă atât formatul, cât și software-ul legat de WebP sub licența BSD. A fost lansat pe 30 septembrie 2010, este un format deschis și folosește extensia de fișier .webp. Mecanism de bază de compresie WebP Algoritmul de compresie cu pierderi al WebP folosește codarea predictivă pentru a prezice valorile de culoare ale pixelilor adiacenți. Apoi codifică doar diferența dintre valorile reale și predicții. Dintre aceste valori codificate sau reziduale, multe sunt zero, fenomen care reduce și mai mult dimensiunea imaginii WebP. Deci compresia cu pierderi a WebP - ca JPEG - se bazează pe predicția blocurilor. Suport și utilizare Google Chrome și Opera au suport încorporat pentru WebP. Printre software-ul de grafică, Picasa, Photoline, Pixelmator, ImageMagick, Konvertor, XnView, IrfanView și GDAL acceptă WebP în mod nativ. Facebook a început să folosească WebP pentru a reduce costurile de rețea și pentru a-și accelera site-ul. Chiar și îmbunătățiri relativ mici ale eficienței încep să se adună la scara Facebook. Când oamenii încarcă imagini JPEG/JPG, Facebook face automat copii în format WebP. Se pare că acum au început să trimită aceste imagini persoanelor care folosesc Chrome și Opera. Telegram a început, de asemenea, să folosească WebP pentru autocolantele sale populare. Previzualizarea instantanee a motorului de căutare Google utilizează WebP intern pentru a reduce spațiul pe disc folosit de previzualizare. Principalele probleme apar atunci când o persoană dorește să vizualizeze sau să facă modificări la o imagine în software, mai degrabă decât într-un browser, deoarece majoritatea aplicațiilor grafice cele mai populare - inclusiv vizualizatorul de imagini din Windows sau OS X și Photoshop - nu pot gestiona WebP în mod nativ. În octombrie 2013, Josh Aas de la Mozilla Research a publicat un studiu cuprinzător despre tehnicile moderne de codare cu pierderi și nu a putut concluziona că WebP a depășit JPEG cu o marjă semnificativă. Cu toate acestea, Telegraphics a lansat un plugin gratuit care oferă suport WebP în Adobe Photoshop, GIMP și suport pentru pluginuri WebP Paint.NET prin. Google a lansat, de asemenea, un plugin pentru Windows care oferă suport WebP pentru Windows Photo Viewer, Microsoft Office 2010 și orice altă aplicație care utilizează componenta Windows Imaging. Beneficii și statistici Documentația Google WebP afirmă: Imaginile WebP comprimate fără pierderi sunt cu 26% mai mici în comparație cu imaginile PNG. Imaginile WebP comprimate cu pierderi sunt cu 25-34% mai mici în comparație cu imaginile JPEG prin indexul SSIM echivalent. WebP acceptă transparența imaginii comprimate fără pierderi (cunoscută și ca canal alfa) cu doar 22% octeți suplimentari. Transparența este susținută și de compresia cu pierderi și de obicei produce o dimensiune a fișierului de 3 ori mai mică decât PNG atunci când compresia cu pierderi este acceptabilă pentru canalele de culoare roșu/verde/albastru. Convertiți în WebP Documentația WebP oferă acces la software precompilat pentru conversia imaginilor PNG și JPEG în WebP. Puteți citi mai multe despre el și îl puteți descărca aici. Iată un link către un convertor online care va realiza sarcina fără a descărca niciun software. Am vorbit destul despre WebP. Să traducem cunoștințele noastre despre WebP în ceva constructiv și creativ. Vom vedea cum să facem autocolante pentru Telegram dintr-o imagine JPEG și să o convertim într-un fișier .webp. Vom crea un autocolant din imaginea următoare. Folosim Photoshop pentru a face imaginea de fundal transparentă. Vom face acest lucru selectând „Background Eraser Tool”. De asemenea, vom decupa imaginea, deoarece este destul de mare! În cele din urmă, folosim un convertor online pentru a converti imaginea în format .webp și stickerul nostru este gata! Puteți crea multe alte autocolante într-un mod similar pentru a comunica cu prietenii dvs. pe Telegram. Concluzie WebP este un nou format de compresie a imaginilor și, susținut de Google, Facebook, Opera și Telegram, a devenit cu siguranță mai popular. Acesta este un format care are deja un număr mare de fani și detractori. Cu toate acestea, capacitatea de a împacheta proprietățile valoroase ale GIF și PNG într-un singur format, cu o dimensiune redusă a imaginii, va continua să ispitească dezvoltatorii web să creeze imagini mai mici, de calitate superioară. Și dacă ajută la accelerarea internetului, toți vom beneficia. O zi bună, prieteni. De curând am descoperit că nu pot salva imagini din browser cu butonul drept al mouse-ului în formate grafice standard (JPG, PNG), dar în același timp imaginile sunt salvate într-un format necunoscut pentru mine. format WebP. Bine, am descărcat fișierul și acum întrebarea este: cum se deschide webp?. In ce program? Despre asta vom vorbi astăzi. După cum spune o Wikipedia înțeleaptă: WebP(pronunțat Weppy) este un nou format pentru comprimarea imaginilor grafice cu și fără pierderea calității fișierului sursă. De ce avem nevoie de ceva nou când există JPG-uri și PNG-uri vechi și familiare? Potrivit dezvoltatorilor (și nu acesta este cine, ci Google Inc însuși), majoritatea imaginilor moderne au fost folosite pe Internet de mai bine de zece ani și se bazează pe tehnologiile secolului trecut. Iată cum se dovedește... Acum, tehnologia a avansat mult și ceva trebuie să se schimbe. Și așa, inginerii Google au decis să verifice dacă este posibil crește raportul de compresie al formatelor grafice
(permițând astfel imaginilor să se încarce și mai repede) chiar mai mult, păstrând în același timp calitatea vizuală existentă. În urma lucrului la proiect, s-a născut unul nou format de imagine grafică - WebP. Potrivit dezvoltatorilor proiectului, noul format reduce semnificativ dimensiunea imaginilor de pe Internet, permițând site-urilor să se încarce și mai repede. Și după cum știți, cu cât un site se încarcă mai repede, cu atât este mai bună atitudinea față de el din partea motoarele de căutare și, desigur, din partea utilizatorilor. De aceea, foarte curând vă voi împărtăși informații secrete :-), cum mi-am accelerat blogul (lucrarea de accelerare este încă în desfășurare). Veți învăța mai multe moduri de a optimiza încărcarea site-ului, așa că nu ratați acest articol. V-am anunțat un articol nou și este timpul să aflați cum și cu ce deschide fișierul webP? Ați descărcat un fișier webp de pe Internet și este deja pe computer? Din cele de mai sus, acum știți că acesta este un format de imagine grafică și îl vom deschide prin vizualizatorul standard Windows. Pentru a implementa această caracteristică, trebuie să instalați un plugin suplimentar în sistemul de operare. Toate acțiunile ulterioare au fost testate de mine personal pe Windows 7 pe 64 de biți. Dar, după cum asigură dezvoltatorii de pluginuri, ar trebui să funcționeze deschide webpși pe Windows XP (SP3), precum și pe Windows Vista. 1 Accesați și descărcați pluginul pentru deschiderea webp de la următorul link, care este afișat în captură de ecran. Derulați puțin în jos în pagină și faceți clic pe următorul link pentru a descărca suplimentul pe computer 2 După ce pluginul este descărcat, trebuie să faceți dublu clic pentru a începe procesul de instalare. Se va deschide următoarea casetă de dialog, unde trebuie să faceți clic pe „Următorul” 4 În caseta de dialog care se deschide, faceți clic pe „Tipic” 5 Și în fereastra finală, faceți clic pe butonul „Instalare” pentru a începe instalarea pluginului După finalizarea instalării, vi se va solicita să mergeți în directorul unde vor exista două fișiere grafice - unul în format JPEG și celălalt în format WEBP. Faceți clic pe ele și bucurați-vă, acum puteți vizualiza cu ușurință și ușor fișierele webp în vizualizatorul standard Windows. Asta e tot pentru mine. Sper că mica lecție de azi să vă fie de folos. P.S. Zilele trecute am fost din nou la poștă, de data aceasta să iau o salopetă de iarnă Oldos pentru fiica mea mică Lisa, care a fost comandată din magazinul online. Comanda a sosit destul de repede. Salopeta este pur și simplu super. Voi fi sigur că voi face o fotografie și ți-o arăt mai târziu. De asemenea, două hidrometre (determină umiditatea aerului) din China ar trebui să sosească în curând. Îl voi agăța în cameră pentru a monitoriza microclimatul, altfel există un umidificator de aer, dar nu arată corect (cred) umiditatea din cameră. Nikolay () a lăsat un comentariu la aniversarea a 500 de ani pe blog. Pentru aceasta, Nikolay primește un mic premiu de 50 de ruble în portofelul său electronic., ca alternativă pentru browserele care nu acceptă mai multe formate de fișiere per element
Google la salvare
JPEG (180 KB)
PNG (213Kb)
WebP (91Kb)
Convertirea imaginilor înWebP
Opțiunea 1 -Photoshop
Opțiunea 2 -Pe netconvertor
Încorporarea fișierelor imagine
Cum să vezi fișiereleWebP pe computerul dvs
Cine are nevoie? Argumente pro şi contra
PNG (124 Kb)
WebP (78Kb)
Unde este folosit?WebP
Lucrul cu WebP pe Windows
Ce este WebP?
Cum se deschide un fișier WebP?
