Prepare images for the web
Turn a 4000 × 3000 JPEG into a 1600 × 1200 WebP, with an optional LQIP for your website.
Guide based on source version 2.0.1-rc.7. Screenshots show the English interface of a prerelease edition; their values illustrate examples, not necessarily defaults. Packages on Downloads may differ: review their release notes and saving options before processing.
On this page
Prepare your working folders
Keep the original in originales/. Use redimensionadas/ for resized copies and web/ for delivery files. The dimensions and quality below are example values, not universal settings.
For every sizing or conversion operation, choose Create copies under Saving. Review the folder and confirmation before continuing to preserve each step’s input.
1. Choose the framing
To keep the whole photo, preserve its aspect ratio without cropping. If the website needs 16:9, use Crop and check that its center crop keeps the subject. Use Canvas when the entire image must fit inside a fixed frame.
A Resize preset forces exact dimensions and may distort a photo with a different ratio.
2. Resize the photo
- Open Resize and load the JPEG.
- Choose pixels, enter a width of 1600, and leave height empty with aspect ratio preservation enabled.
- Process the image and choose
redimensionadas/. - Check the output dimensions. A 4000 × 3000 original should become 1600 × 1200 unless you cropped it first.
3. Convert the resized copy
- Open Convert and load the actual file exported into
redimensionadas/. - Select WEBP and start with Quality 85.
- Convert into
web/. - Compare file size, fine detail, and compatibility with the destination.
For another test, return to the higher-quality working copy and use a different output folder. Repeatedly compressing the last lossy result can accumulate damage. Savings depend on the image. For logos with transparency, check PNG or WebP alpha and inspect the edges.
4. Generate an optional LQIP
- Open LQIP / Base64 and load the final WebP.
- Use width 20, blur 2, and JPEG quality 40 as a starting point.
- Click Generate, then Copy code for the Data URI or export JSON.
- Give the developer both the final image and the placeholder code.
LQIP is an opaque JPEG. Yagua does not automatically integrate progressive loading into a website.
5. Check before publishing
- Check the delivered width and height against the actual display size.
- Inspect thin text and fine details at the intended size.
- Do not assume conversion removed all metadata; use the metadata tools when needed.
- Write suitable alternative text for the website.
- Keep the original and a working copy.
Resize and Convert accept batches of up to 100 images; LQIP handles one image at a time. Test a small sample before processing a whole folder.