You finished the edit. Now there are four format options, output dimensions, and — for JPG, WebP, and PDF — a quality slider. The choice affects file size, transparency, compatibility, and whether text and fine edges remain crisp.
The short version
| You are exporting… | Use | Why |
|---|---|---|
| A photo for a website | WebP | Often smaller than JPG at comparable visual quality, with broad support in current browsers |
| A photo for someone else’s system | JPG | Usually the safest choice when compatibility matters more than transparency |
| A screenshot or UI capture | PNG | Lossless — text and thin lines stay crisp instead of turning mushy |
| Anything with transparency | PNG or WebP | JPG has no alpha channel and fills transparency with white |
| A single image that needs to travel as a document | Wraps the image in a one-page document that is convenient to open or print |
What actually differs between them
JPG — the default that is still hard to beat
Lossy compression tuned for photographs, discarding detail the eye is least likely to miss. It works well for continuous-tone images but poorly for sharp edges: text, logos, and UI screenshots can pick up visible ringing artifacts. JPG has no transparency. Every lossy re-save removes a little more information, so avoid repeatedly editing and saving the same JPG.
PNG — lossless, and honest about it
Nothing is discarded, so screenshots, diagrams, logos, and pixel art survive intact. PNG also supports alpha transparency. The cost is size: a photograph saved as PNG can be several times larger than a good JPG, often with no visible delivery benefit. Use it primarily for graphics rather than photographs on a web page.
WebP — the sensible default for the web
The WebP format supports both lossy and lossless encoding as well as transparency. visdraw exposes the browser’s quality-controlled WebP export; it does not offer a separate lossless-mode switch. At comparable visual quality, WebP is often smaller than JPG. Current browsers support it broadly, but some upload forms, older desktop tools, and marketplaces still reject it — use JPG when the destination requires it.
PDF — a page, not an image
visdraw places a JPEG-encoded copy of the image on a single PDF page. That is convenient when a recipient expects a document rather than a standalone image. It is not a multi-page layout tool and does not set a paper size or print DPI, so use a dedicated publishing tool when a printer gives you exact production specifications.
What the quality slider is really doing
It is not a linear dial for "how good this looks". In visdraw, the quality control applies to JPG, WebP, and the JPEG image embedded in PDF; PNG is lossless and has no quality slider. For those lossy encodings, it changes how aggressively fine detail is discarded, and the file-size curve is not linear.
| Quality | Result | Use for |
|---|---|---|
| 95–100 | Often difficult to distinguish from the source, while file size climbs steeply | Large delivery copies when size matters less |
| 80–90 | A common sweet spot with little visible loss at normal viewing size | Many web and social publishing uses |
| 60–75 | Artifacts may appear in flat gradients such as skies | Thumbnails, background images |
| Below 60 | Visible blocking and color banding become more likely | Only when a hard size limit forces it |
A practical method is to start at 85, inspect both the exported file and its size, and adjust from there. Moving from 100 to 85 can reduce the file substantially with little visible difference, but the result depends on the image and the browser encoder. Check gradients first — skies, soft shadows, and out-of-focus backgrounds often reveal compression before textured areas do.
Choosing export dimensions
Dimensions can matter as much as format. A 4000-pixel-wide photo displayed in an 800-pixel column contains far more pixels than the layout can show, whatever format it uses.
| Destination | Long edge | Notes |
|---|---|---|
| Blog body image | 1200–1600 px | Covers standard content widths on high-density screens |
| Full-width hero | 1920–2400 px | Match the actual container width and high-density display needs |
| Social post or card | 1200 px | Most platforms re-encode, so send a clean source and do not over-compress |
| Product listing | 1500–2000 px square | Zoom features need the resolution; check the marketplace requirement |
| 600–800 px | Email clients usually render images small, so keep dimensions and file size modest | |
| Calculate pixels from the final size | At 300 ppi, a 10 cm-wide print needs about 1180 px; visdraw sets pixel dimensions, not print DPI |
Before you export
- Does the destination accept this format? Marketplaces and older systems are the usual holdouts.
- Does the image need transparency? If so, JPG is out.
- Is it a delivery photo or a graphic? Photos usually favor a lossy format for delivery, while graphics usually favor lossless output.
- Is the pixel size close to the display size, or are you shipping four times what is needed?
- Have you checked the gradients at 100% zoom rather than the sharp areas?
- Is the file name something you are happy for a stranger to read?
Frequently asked questions
Is WebP better than JPG?
For many website images, WebP is a strong choice because it is often smaller at comparable visual quality and can preserve transparency. JPG remains useful when an uploader, marketplace, or older tool does not accept WebP.
Should I use PNG for photographs?
Usually not for delivery. PNG stores a photograph losslessly but often produces a much larger file than a high-quality JPG or WebP with a similar appearance. Save PNG for screenshots, logos, diagrams, and work that needs transparency or a lossless intermediate.
What quality setting should I export at?
Start around 85 for JPG, WebP, or PDF, then inspect the result at its intended viewing size. Many images look very close to the maximum setting while producing a smaller file, but gradients and fine edges should decide whether you move higher or lower.
Does repeatedly saving a JPG degrade it?
Yes. Each lossy save discards more detail, and the loss compounds. Keep the original or a lossless working copy, then create fresh JPG delivery files from that source instead of repeatedly re-saving the same JPG.
Can I convert an image to WebP without uploading it?
Yes. Open a browser-supported image and export it as WebP; visdraw performs that encoding in the current tab rather than sending the image to a conversion server. The same local export path supports PNG, JPG, and PDF. See how on-device editing works.
Why is my exported file larger than the original?
Usually one of three reasons: you exported a photo as PNG, you exported at a higher quality than the source was saved at, or you upscaled the dimensions. Check format first, then quality, then size.
Written by
The visdraw team
Product & engineering