https://embed.app.guidde.com/playbooks/5TYEz2ht5rDWoVPjH6soub
As you may already know from Introduction to image transformations, Macula.Link provides two options for image editing: in-place and on-the-fly editing. Moreover, they can be combined together, meaning you can, for example, create a slightly compressed version of the original image and enable on-the-fly transformations for this version to save bandwidth and computation time.
The ultimate decision of which option to pick will depend on a number of considerations: how and where do you plan to share, how often will the image be seen, do you need to allow others to reuse the image, etc.
With in-place transformations, the copy of the image is saved with the original remaining intact. All copies are connected to the original and carry the same metadata. However, you can choose different license for each published transformation. This is useful, for example, to cover the high-resolution original file with “All rights reserved” while allowing smaller, lower-resolution transformation to be used under a Creative Commons license.
Use in-place transformations when the image will be requested often or in high volumes to save the processing time and bandwidth, for example: for websites and portfolios, thumbnails, or publishing on third-party sites.
On-the-fly transformations allow doing the same things but each modification is applied every time the image is requested before showing it. The modified copy is then discarded. This gives a great degree of flexibility but takes time to process, especially for computationally-heavy operations, such as reformatting or sharpening.
Use on-the-fly transformations when the image will be used differently, perhaps by different people, for example: for complicated websites that require dynamic image sizes, media-rich applications, to encourage other people to reuse your images on their websites without downloading the file itself.
<aside> 💡 Learn more about working with on-the-fly transformations in On-the-fly image transformation and content delivery section.
</aside>
To publish a transformation, check how to publish and share an image.
Transformation | Accepted values | Description |
---|---|---|
Resize | Values for width and height in pixels | Set a specific width, height, org both. |
Fitting | cover : The image is cropped to fully fill the frame without stretching it. |
|
contain : Preserves the aspect ratio of the image, fitting it into the frame completely, using letterboxing if necessary. |
||
fill : Stretches an image to specified dimensions, ignoring its aspect ratio. |
||
inside : Preserving the original aspect ratio makes the image as large as possible while ensuring that image dimensions are less than or equal to the frame. |
||
outside : Preserving the original aspect ratio makes the image as small as possible while ensuring that image dimensions are greater than or equal to the frame. |
Set how the image should fit into the frame. | |
Position | Top |
|
Right |
||
Left |
||
Bottom |
||
Center |
||
Right top |
||
Left top |
||
Right bottom |
||
Left bottom |
Position of the image when cropping | |
Sharpening | A number between 0.000001 and 10 |
Make the image sharper. |
Blurring | A number between 0.3 and 1000 |
Make the image blurrier. |
Flipping | Check/Uncheck | Flip the image vertically. |
Reduce | Check/Uncheck | Prevents scaling down if the width or height are already greater than the target dimensions. |
Enlarge | Check/Uncheck | Prevents scaling up if the width or height are already less than the target dimensions. |
Lossless | Check/Uncheck | Activates lossless compression mode. |
Compress | A number between 0 and 100 |
Compress to a certain quality threshold. |
Reformat | Auto (the best format will be selected based on the browser), WebP , JPEG/JPG , PNG , Avif |
Change the format of the image. |