What are next-gen image formats?

By Dillon Smart · · · 0 Comments

IKnowThatNow

Google Page Insights is a useful tool used to report on the performance of webpages on both mobile and desktop devices and provide suggestions on how the page can be improved. A common suggestion many websites are given is ‘Serve images in next-gen formats’, but what are next-gen image formats?

Next-gen image formats provide superior lossy and lossless compression with higher quality for smaller file sizes. Next-gen image formats are preferred for the web because the files consume less data, therefore leading to faster page speeds. In 2021, Googles search algorithm will begin taking into account page speed and user experience as stronger factors for their ranking system. Having a web page slowed down by older image formats will soon affect your websites SEO.

What is WebP?

Released in 2010 by Google and a sister project of WebM video formats, WebP offers both lossless and lossy image compression for smaller file sizes with no affect to image quality. WebP is supported by 94% of web browsers (as of May 2021) and is proving to be the most popular next-gen image format used for the web.

JPG – 28.4kB

JPG vs WebP Compression

WebP – 10.9kB

WebP vs JPG Compression

What is JPEG 2000?

Developed between 1997 and 200 by a Joint Photographic Experts Group committee to improve upon JPEG, JPEG 2000 provides a modest increase of compression over JPEG with a flexible codestream. JPEG 2000’s efficient code-stream organization allows for progressive pixel accuracy and image resolution allowing a lower quality image to be display first before a higher quality image has been downloaded.

What is JPEG XR?

JPEG XR offers higher compression over JPEG with equivalent quality. JPEG XR also offers tile regions, resulting in parts of the image being decoded separately enabling rapid access to parts of the image without needing to decode the entire file.

 

0 Comment

Was this helpful? Leave a comment!

This site uses Akismet to reduce spam. Learn how your comment data is processed.

DRY: What is DRY in Development

Updated 16th August 2022

DRY stands for Don’t Repeat Yourself. It’s a principle in software development that aims to reduce the repetition of code and favor abstraction and avoid redundancy. Let’s learn the meaning of DRY. The DRY principle is stated as “Every piece of knowledge must have a single, unambiguous, authoritative representation within a system”, but what does

5 Reasons to Use an IDE for Programming

Updated 3rd August 2022

If you’re a programmer, then you know how important it is to have the right tools for the job. And one of the most important tools for any programmer is an IDE, or integrated development environment. Let’s look at some reasons to use an IDE. What is an IDE? An IDE is a suite of

Laravel php artisan make:auth command not defined

Updated 11th August 2022

Laravel 6.0 LTS came with a lot of changes to the framework, apart from moving the the new Semantic Versioning, Laravels famous php artisan make:auth command was dropped. php artisan make:auth Before the Laravel make:auth command would create all the Migrations, Models, Controllers and Routes needed to easily setup an authenticatable application in seconds. However,