In website operation, images are important elements to attract users and convey information.However, unoptimized images may also be the culprit behind slow website loading, which can further affect user experience and search engine rankings.AnQi CMS knows the importance of image optimization, and therefore provides a variety of refined image control functions to help you achieve a perfect balance between website performance and visual effects.
One, WebP: The intelligent choice for lightweight and fast image acceleration
WebP is a modern image format that is typically 25-34% smaller than JPEG and 26% smaller than PNG in terms of file size while maintaining the same visual quality.This means faster loading speed and less bandwidth consumption.
In AnQi CMS, enabling the WebP feature is very convenient.You just need to go to the 'Content Settings' page in the website backend, find the 'Enable Webp Image Format' option, and set it to 'Enabled'.From now on, every time you upload JPG, PNG and other image formats, the system will automatically convert them to WebP format, achieving automatic format upgrade for new content.
For existing images on the website, Anqi CMS also provides a solution.In the "Content Settings", you can find the "WebP Conversion Tool", which can be used to batch convert all non-WebP format images uploaded to the website, so that all images on the entire website can enjoy the optimization benefits brought by WebP.
Two, Automatic large image compression: Say goodbye to redundancy and save resources
Many times, the resolution of the images we upload is much higher than the actual display requirements of the website, which not only occupies valuable server storage space but also increases the user's traffic burden.The automatic compression function of AnQi CMS can effectively solve this problem.
In the "Content Settings" page, check the "Whether to automatically compress large images" to enable this feature.The system will automatically compress images larger than the set size to a width of 800 pixels.Of course, you can customize this value according to the specific requirements of the website design in the 'Auto-compress to specified width' input box.For example, if the maximum display width of your article content area is 1200 pixels, you can set this value to 1200.This feature mainly compresses the image based on its width, significantly reduces file size without affecting the visual presentation of the image, thereby saving storage space and further accelerating page loading.
Three, Thumbnail: Fine control, multi-scene adaptation
The thumbnail is an essential element in website content lists, recommendation spots, and other scenarios, as it allows for a quick preview of the image content and optimizes page layout.The Anqi CMS provides a variety of thumbnail generation and management features to meet different display needs.
In the "Content Settings", you can choose the "thumbnail processing method" that best fits your website design style:
- Scale proportionally to the longest side:This method will resize the image proportionally based on the longest side size you set, ensuring that the image is displayed completely without distortion.The thumbnail width or height will be fixed, and the other side will be adjusted proportionally.
- Pad to the longest edge:If you need a thumbnail with a fixed aspect ratio and do not want any part to be cropped, this method is very suitable.The image will be centered, and the insufficient area will be filled with white to make the thumbnail reach the specified precise size.
- Trim to the shortest edge:When you have strict requirements for the thumbnail size, this method can crop the image to the center.The shortest side will be displayed completely, while the longest side will be cropped to match the shortest side, which may result in the loss of original image edges.
After selecting the appropriate processing method, you can enter the required width and height in the 'thumbnail size', for example, set to300x200Pixel. Precise size settings help maintain the consistency of page layout and improve loading efficiency.
Moreover, AnQi CMS also allows you to set a 'default thumbnail'.When the content does not specify a thumbnail, the system will automatically use this default image for display, which is very helpful for maintaining the consistency of the website's overall visual style.
If you adjust the thumbnail size or processing method, the existing thumbnails will not be updated immediately.At this time, you can use the 'Batch Regenerate Thumbnails' feature.This feature will update all thumbnails of the images generated on the entire site according to your latest settings, saving the麻烦 of manual operation.
It is also very convenient to call thumbnails in front-end templates. Usually, you can{{ item.Thumb }}or{{ item.Logo }}Directly obtain the thumbnail address of the article or category. For more flexible scenarios, it can also be combinedthumba filter such as{{ item.Logo|thumb }}to further process and display the image address.
Through these fine-grained image control features, AnQi CMS can not only help you efficiently manage and optimize website image resources, but also significantly improve the user experience, page loading speed of the website, and lay a solid foundation for search engine optimization.Make good use of these tools to make your website both engaging and efficient.
Frequently Asked Questions (FAQ)
Ask: Will the images I uploaded before be automatically converted to WebP after enabling the WebP format?Answer: No. After enabling the WebP feature, only newly uploaded images will be automatically converted to WebP format.For the images already existing on your website, you need to manually go to the background "Content Settings" and the "WebP Conversion Tool" for batch conversion.
Ask: When setting the image to automatically compress the width to 800 pixels, will it only compress the width or will it also proportionally shrink the height?Answer: When you turn on automatic compression of large images and set a specified width (such as 800 pixels), the system will resize the image proportionally based on this width.This means that if the original image width is greater than 800 pixels, it will be resized to 800 pixels wide, and the height of the image will also be reduced in proportion to the original aspect ratio to maintain the visual proportions without distortion.
What is the reason why the thumbnail size I modified in the background did not change on the website front end?Answer: After changing the thumbnail size or processing method settings in Anqi CMS, the thumbnails that have already been generated will not update automatically.You need to go to the "Content Settings" page, find the "Batch Regenerate Thumbnails" feature and click to execute, then the system will regenerate all thumbnails according to your new settings and update them to the website front end.