Image formats cheat sheet for marketers

Marketers pick image formats under deadlines: a CMS upload, an email hero, a marketplace listing, a slide deck. JPG still carries most photos. PNG keeps sharp graphics and transparency. WebP shrinks many web assets when the stack accepts it. GIF, SVG, and HEIC show up as edge cases you cannot ignore. This cheat sheet maps each format to the job, then points you to converters and compressors on Toolsy. For the deeper WebP decision, read WebP for websites: when to use it. For UI captures, see PNG vs JPG for screenshots.

Why marketers get stuck on formats

Campaign assets travel through more systems than a designer’s laptop. Design exports PNG. Email wants JPG. The storefront CDN prefers WebP. The marketplace form rejects everything except JPEG under two megabytes. Each hop adds a format rule you did not write.

Wrong format usually looks like a failed upload, a white box where transparency lived, or a page that crawls on mobile data. Fixing it late means re-exporting from a compressed social download, which already lost detail.

A simple rule helps: keep a master (PNG or high-quality JPG), then convert copies for each destination. Do not overwrite the master with a lossy upload copy.

JPG for photos, email, and picky portals

JPEG (often named .jpg) uses lossy compression tuned for continuous tone. Product shots, lifestyle photos, and blog heroes usually belong here when the destination wants a common photo type.

Email clients and many compose windows still prefer JPG. Open Graph images often ship as JPG so scrapers stay predictable. Seller portals frequently list JPEG in their photo rules; see seller photo specs: complete guide before you standardize a catalog.

JPG cannot keep transparency. Soft edges and logos with clear backgrounds turn into a solid matte (often white) when you force JPEG. That failure mode is covered in transparent PNG to JPG: white background issues.

When JPG is the default

Use JPG for camera-like photos on sites that still whitelist JPEG, for email heroes, and for any form that only lists JPG/JPEG. Convert from PNG with PNG to JPG when you need a smaller attachment and do not need alpha.

Keep quality in a mid-high range for heroes. Drop quality for thumbnails after you already resized to the display size.

When JPG fights you

Logos with hard edges, screenshots with small type, and any asset that must stay lossless under repeated edits. JPG ringing around text shows up first. Prefer PNG or SVG for those jobs.

PNG for logos, UI, and transparency

PNG stores pixels with lossless compression. Flat color, thin type, and one-pixel borders stay exact. Alpha channels keep see-through areas for badges and overlays.

Marketers reach for PNG for logos on slides, app store graphics that allow PNG, documentation screenshots, and any asset that sits over a colored background. File size grows on photographic scenes; PNG is not the default for a full-bleed lifestyle hero on the homepage.

Convert a JPEG logo only when a tool demands PNG and you accept that JPEG damage already baked into the pixels will remain. JPG to PNG changes the container; it does not invent a true vector or missing alpha. The logo-focused walkthrough is JPG to PNG for logos with sharp edges.

Transparency and email signatures

Transparent PNG signatures work in many HTML emails when the client supports them. Some clients still flatten oddly. Test your exact stack; related notes live in the PNG signature guide on the blog index when you need that path.

If a system forces JPG for a formerly transparent mark, flatten onto brand white (or brand color) before convert so you control the matte.

Screenshots and docs

Default to PNG when the capture must prove UI state. Switch to JPG only when upload caps force it. Details: PNG vs JPG for screenshots.

WebP for modern website delivery

WebP often lands smaller than similar-looking JPEG or PNG for on-page images. Modern browsers decode it. Many CDNs negotiate WebP from a master automatically.

Use WebP for site photos and many graphics when the CMS accepts the upload. Keep JPG or PNG for email, some social preview images, and older allowlists. Convert with Convert to WebP. Decision depth: WebP for websites: when to use it.

WebP is a delivery format. Keep masters in PNG or high-quality JPG in your archive so future crops start clean.

GIF, SVG, and HEIC as edge cases

GIF: short loops and simple graphics. For ads and landing motion, short MP4/WebM usually weighs less and looks cleaner. Still GIF when a channel only accepts GIF stickers or legacy embeds.

SVG: true vector logos and icons when the stack allows SVG upload and sanitizes it. Prefer SVG over PNG for scalable brand marks on the web. Rasterize to PNG only when a form rejects SVG.

HEIC: iPhone camera default. Recipients on Windows, many CRMs, and older tools want JPG. Convert before share; do not treat HEIC as a web delivery format for most marketing sites.

Animated WebP and AVIF appear in advanced pipelines. Treat them as CDN features unless your team already ships them with fallbacks.

Resize and compress before you ship

Format choice does not fix a 4,000-pixel hero scaled down in CSS. Resize to the display width first with resize image, then compress with compress image. Email size caps need both steps; see compress images before email.

Lossy versus lossless in plain language: lossy vs lossless compression in plain English. Blog hero pixel workflow without Photoshop: resize images for blog heroes without Photoshop.

Double compression from social downloads plus another heavy compressor muddies color. Start from the master when you can.

Quick picker by marketing channel

Website on-page photos: WebP when accepted; JPG fallback. Email: JPG or PNG. Open Graph / many social scrapers: JPG or PNG after you test. Marketplaces: follow the channel’s JPEG/PNG rules and dimensions. Slides: PNG for logos; JPG for photos. Docs and bug reports: PNG for UI text.

When two formats both work, pick the smaller file that still looks sharp on a phone. When a portal names one format, obey the portal.

Convert copies; never delete the master after a successful upload.

Limits and honest non-goals

Toolsy converters and compressors run on a free daily quota with brief server processing. Uploads are not kept after the response. Huge camera files may need resize before convert.

This cheat sheet does not replace marketplace policy pages or your ESP’s image rules. Specs change; verify in the product when a campaign depends on exact crops.

Format conversion cannot restore detail lost in an earlier lossy save. Background removal and vector redraw are separate jobs from a simple JPG↔PNG swap.

Frequently asked questions

What image format should marketers use for websites?

Use WebP for many on-page photos and graphics when your CMS and audience path support it, with JPG or PNG as fallbacks where needed. Keep JPG or PNG for email and picky social preview images. Convert delivery copies with Convert to WebP and keep a master file in your archive. Test one template page on phone and desktop before you bulk-replace a library.

Is JPG or PNG better for product photos?

JPG usually wins for photographic product shots on size and compatibility. PNG wins when you need a transparent cutout or pixel-perfect packaging graphics with hard edges. Marketplace listing rules often force JPEG regardless of preference. Check seller photo specs: complete guide for channel-level rules.

When should I use WebP instead of JPG?

Prefer WebP for modern site delivery when uploads succeed and you have verified the live page. Keep JPG for email, many OG images, and forms that reject WebP. Full decision guide: WebP for websites: when to use it. If a portal rejects WebP, reverse convert that copy rather than fighting MIME errors.

Does PNG keep transparency that JPG cannot?

Yes. PNG can store an alpha channel; JPEG cannot. Converting a transparent PNG to JPG fills empty pixels with a solid matte, often white. Plan the background color before you convert for shops or email that demand JPG. Details: transparent PNG to JPG: white background issues.

Should logos be SVG, PNG, or JPG?

SVG is the best web logo when your stack allows safe SVG. PNG is the practical raster for slides, many CMS libraries, and print-adjacent handoffs. JPG is a poor logo default because hard edges pick up compression artifacts. If you only have a JPEG logo, convert to PNG for tools that require it, knowing artifacts may remain.

What format works best for email marketing images?

JPG for photo heroes and PNG for sharp graphics or signatures that need transparency, after you test major clients. WebP support in email remains uneven, so treat WebP as a website format first. Shrink attachments with compress image and the workflow in compress images before email. Oversized heroes still bounce even in the “right” format.

Is GIF still useful for ads in 2026?

GIF still works for simple loops and platforms that only accept GIF stickers. For paid social and landing pages, short video often looks better at a smaller weight. Export a GIF only when the channel or creative brief requires it. Do not animate a large photographic scene as GIF when MP4 is allowed.

How do I handle HEIC photos from iPhones in campaigns?

Convert HEIC to JPG (or PNG when you need lossless graphics) before CRM uploads, Windows handoffs, and most web CMSs. Do not publish HEIC as the primary web hero for general traffic. Keep the HEIC master in the photo library if you still edit on Apple devices. Use the HEIC conversion tools on Toolsy when recipients cannot open the original.

Do I resize or compress first?

Resize to the pixel size you need, then compress. Compressing a huge camera file first still leaves excess pixels for the browser to download. Use resize image then compress image. For blog heroes, follow resize images for blog heroes without Photoshop.

Will converting formats fix a blurry image?

No. Conversion changes how pixels are stored, not missing detail. Start from the highest-quality master you have, crop carefully, and avoid stacking multiple lossy saves. If the source is already soft, sharpening and redraw are design tasks outside a format swap.

For screenshot format choice, continue with PNG vs JPG for screenshots. For marketplace dimensions and rules, use seller photo specs: complete guide. When you need many files through the browser rather than a desktop folder job, see Batch image format conversion without install.