Qu; е WebP и как да използвам този формат d; изображение в Wordpress - Zen Devs
С изображенията, които обикновено представляват 50% от теглото на средната уеб страница, всичко, което можете да направите, за да оптимизирате вашите изображения, не само ще спести място на вашия сървър, но и ще обслужва вашите страници по-бързо.
За щастие, с формата на изображението WebP можете да създавате по-малки, по-богати изображения, които са средно с 26% по-леки от PNG и с 25-34% по-малко в сравнение с JPEG - като същевременно запазвате същото качество.
В тази статия ще разгледаме какво е WebP и как да използваме този формат на изображението на вашия сайт на WordPress, за да намалим драстично размера на изображението си.
Какво е WebP ?
WebP е формат на графичен файл, създаден от екипа на Google Web, разработен да замени форматите JPEG, PNG и GIF, като същевременно поддържа компресия, прозрачност и анимация.
За първи път беше обявен през септември 2010 г. като нов отворен стандарт за компресирани цветни изображения със загуба в мрежата, създавайки по-малки размери на файловете и сравними по качество с JPEG.
Поддръжката за изображения без загуби и прозрачност е обявена през 2012 г., което прави WebP алтернатива на PNG формата.
Компресирането със загуби на WebP използва кодиране с предсказване за кодиране на кадър - същия метод, използван от видео кодека VP8 за компресиране на ключови кадри във видеоклипове. Предсказуемото кодиране работи, като използва стойностите на съседните пикселни блокове, за да предскаже стойността на блок, след което само кодира разликата.
Компресията без загуба на WebP използва по-рано видяни фрагменти от изображения, за да реконструира нови пиксели и може да използва локална палитра, ако не бъде намерено съвпадение.
Както можете да видите в примерите по-долу от WebP галерията на Google, няма забележима разлика в качеството между JPEG изображенията вляво и WebP версиите вдясно. Това, което не виждате, освен ако не проверите размера на файла, е, че WebP изображенията са с над 30% по-малки от JPEG изображенията.
Но както казах преди тук, когато става въпрос за теглото на страницата, размерът има значение. В крайна сметка, колкото по-малък е размерът на файла на уеб страница, толкова по-бързо ще се зареди. Толкова е лесно 😉
Така че, като намалите размера на файла на вашите изображения, използвайки формат като WebP, в комбинация с други техники, като например функцията за мързеливо зареждане, можете да обслужвате изображения, които са по-малки и гарантират, че вашите страници се доставят по-бързо на посетителите на вашия сайт.
Поддръжка на WebP формат в браузърите
Може би се чудите, тъй като WebP съществува вече осем години, защо не е по-популярен? Защо все още използваме JPEG и PNG, когато WebP може да създава файлове с по-малък размер и с подобно качество ?
Е, както много технологии в мрежата, които се борят да намерят краката си, не всички съвременни браузъри поддържат WebP. Според Мога ли да използвам ..., браузърите, които поддържат WebP, включват Chrome, Opera, Opera, Opera Mini, Android браузър и Chrome за Android.
Microsoft обяви, че ще поддържа WebP в своя браузър Edge миналия октомври, а Mozilla направи подобно съобщение малко след това за Firefox. Сега просто Safari на Apple изостава без съвместимост.
След като за първи път прояви интерес към поддръжката на формат на изображението, когато добави поддръжка на WebP в iOS 10 и MacOS Sierra, Apple по-късно го замени с HEIF, формат на изображението, базиран на стандарта за компресиране на видео HEVC (известен също като H.265 и MPEG-H, част 2 ).
Въпреки че в последно време няма индикации, че Apple ще поддържа WebP в бъдеще, компанията всъщност няма избор сега, когато всички други основни браузъри и софтуер за редактиране на изображения го правят.
Използване на WebP - с JPEG/PNG като резервно решение
Това, че Apple не поддържа WebP, не означава, че не трябва да използвате формата. Възможно е да предоставяте WebP файлове на посетители, използващи поддържани браузъри, докато разглеждате JPEG и PNG файловете като резервен вариант за потребителите на Safari.
По този начин, вместо да доставяте WebP на всички потребители и да рискувате потребителите на Safari да виждат счупени изображения, можете да се уверите, че всички посетители на вашия сайт виждат вашите изображения - докато потребителите с поддържани браузъри получават по-бързо изживяване.