quartz/docs/features/Web Image Optimization.md

title	tags
Web Image Optimization	feature/transformer

Quartz uses sharp to optimize images for web serving at build time.

When optimizeImages in configuration#General-Configuration is set to true:

• JPEG and PNG images will be stripped all metadata and converted to WebP format, and associated image links in <img> tags, wikilinks#embeds and CustomOgImages#frontmatter-properties frontmatter config socialImage will be updated with the new file extension.

• A resized preview image will replace every local image that has custom dimensions defined either in its wikilink or <img> tag. The original image (optimized or not) will still be assessable as a link on the preview image.

[!note]+ Example usage

The following markdown:

![[images/engelbart.jpeg | 200]]<br/>
_An example optimized preview image of [Douglas Engelbart](https://awards.acm.org/award_winners/engelbart_5078811). Clicking on it opens an originally sized optimized image._

generates the following HTML:

!images/engelbart.jpeg
An example optimized preview image of Douglas Engelbart. Clicking on it opens an originally sized optimized image.

Details

See documentation for the Images#web-image-optimization transformer plugin for more information.