Image Processing
The theme relies solely on Hugo’s image-processing capabilities.
Many different-sized versions of every image are generated automatically, so every client browser finds a near-optimal size to display. We only need to supply an original image which is large enough for the intended layout.
Resolution
For crisp images on high-density screens, we should at least provide images for double-density.
Image type | 2×density | 3×density |
---|---|---|
block (default) | 1400px | 2100px |
large block | 2100px | 3150px |
extra-large block | 2800px | 4200px |
embedded (default) & small block | 660px | 990px |
small embedded | 330px | 495px |
When we build a project with more than a hundred images — like this project — we have to show a little patience on the first Hugo run. Image processing may take a few minutes. The generated images are cached by Hugo and we don’t have to wait again in subsequent runs.
In case we can’t provide a large enough version of an image, Perplex uses an excellent interpolation filter provided by Hugo to enlarge its size smoothly. Those interpolated images may look blurry nonetheless, there is no way to get missing information back. A high resolution of the original is always preferable.
Manipulation
TODO
- Improve templates
- Document resource parameters