Image Optimization
Image Optimization
IMAGES & IMAGE STYLING
Overview / Intro
Media Library
Slideshows
Page Backgrounds
How Images Are Optimized
< BACK TO OVERVIEW
Optimizing your images will create a better user experience, and it's easier than ever with Readz. Learn how and when to optimize.
Image optimization refers to reducing the file size of your images, and still keeping a great resolution and sharpness. Having lean, smaller size images on your page is important because it helps your page download faster.
Not only will this create a better experience for your users, but it will also give you a higher ranking in search engine optimization.
Image optimization in Readz happens both during editing and during the publishing process.
Image optimization while editing
Newly added images
Often source images are several MB's large. This is by far too large for use on the web. Whenever images are too large, it will be indicated by a red dot on the image in the media library and in the image properties.
In the image properties, for excessive image sizes a message and a button will appear, allowing you to reduce the image size.
When you click the "Click to reduce image resolution', you will be given an option to reduce the image to 3 common pre-set sizes.
- Small (400px x 600px) is typically used for thumbnails, TOC images and so on
- Medium (800px x 1200px) is typically used for in-content images
- Large (1600px x 2400px) would be used for full-screen width images
In the example above, selecting 'Medium' will reduce the image size from 2.68MB to 122KB !
Please note that the image size reductions will always take effect on the next 'save' of your project.
You can also reduce the resolution to a different value manually by entering a lower value in the image resolution fields. The aspect ratio will be maintained, so you can change either width or height to your desired resolution.
Image optimization while publishing
The Readz platform will apply further lossless compression when you publish your project.
When a project is published, the platform will automatically create multiple versions of your image, for use on desktop and mobile.
We highly recommend having the auto-optimization active all the time. In highly exceptional cases, there might be a reason why you would want large-size images on mobile, and then you can turn this option off.
Best practices
Next to the image optimization, there are 2 additional best practices to help keep your page load speed low and your performance smooth.
Use WebP image formats
We support and promote the WebP format, which offers a superior quality with lower file sizes. To convert your image to WebP, you can either:
- select the image in the library and right-click
- an option to convert the image to WebP will appear
OR:
- select the image in the library
- open the more (...) menu in the bottom panel and select 'Convert to WebP'.
Conversion will happen on the next save.
Please note that you can select multiple images (hold down the Command / Ctrl key) to convert to WebP in a single go.
Remove unused media
It is a best practice to remove unused media from your library. To do this, click on the More (...) button in the bottom of the panel and select 'Remove unused media."
Contact Support
STAY IN THE LOOP
Sign up for product updates