uBlur
Use Cases

How to Compress Images for Websites Without Quality Loss

Use Squoosh, TinyPNG, and ImageOptim for fast, crisp web assets.

By Sarthak KuchhalFounder, uBlurPublished 18/02/20256 min read
Editorial review

Reviewed by Sarthak Kuchhal

Builds and maintains uBlur's privacy-first screenshot editor and reviews core product guides against the live web app before major updates.

  • Product-first guides are reviewed against the current uBlur web editor.
  • We update workflows when the UI or export behavior changes.
  • If you spot drift, email [email protected] and we will review it.

Optimised images load faster, boost Core Web Vitals, and improve SEO. The goal: reduce file size while keeping pixels crisp. Here's how to pick the right format, compression level, and tooling for spotless web performance.

Choose the Right Format

  • PNG: For UI and transparency. Optimise with lossless compression.
  • JPG: For photos; use quality 75-85 to balance fidelity and size.
  • WEBP / AVIF: Modern formats offering ~30-50% smaller files. Ideal for modern browsers.

Browser Tools

  • Squoosh: Visual comparison sliders plus advanced codecs (MozJPEG, WebP, AVIF).
  • TinyPNG / TinyJPG: Drag-and-drop simplicity with smart lossy compression.
  • Image Compressor: Batch conversion and resizing in one go.

Desktop Automation

  • ImageOptim (macOS): Drop folders to strip metadata, convert to WEBP, and apply lossless compression.
  • FileOptimizer (Windows): Highly configurable with plugin-based optimisations.

Workflow Tips

  • Resize before compressing--don't ship 4000 px images for a 1200 px container.
  • Strip EXIF metadata unless you need location or capture info.
  • Keep an original backup for future edits.

Test Your Results

Use PageSpeed Insights or web.dev Measureto confirm faster load times and diagnose any remaining weight.

Annotate in uBlur

Before sharing optimised assets with stakeholders, open them in uBlur to blur private data, add highlights, or insert quick notes--all without compromising the compression work you just did.

Support uBlur

Enjoying this guide? Buy us a coffee.

uBlur stays free and privacy-first because readers like you pitch in. Every coffee keeps the editor fast, improves these tutorials, and helps us ship new blur and highlight tools.