Image tools for bloggers and content creators

Most blogs are slow because of unoptimized images. Fix yours with browser-based tools that handle batches, multiple formats, and the exact sizes your CMS needs.

The blogger's image problem

You write a great post with relevant images. You upload them straight from your camera or phone. The post publishes. Then visitors arrive and your page takes 8 seconds to load. They bounce. Google penalizes the page. Your traffic drops.

The fix is image optimization. It's not hard, but most bloggers skip it because the tools are either bad, slow, or require uploading files to a service they don't trust.

This guide walks through optimizing blog images properly using pictoolkit's browser-based tools.

The four image tasks every blogger needs

1. Resize to actual display size

If your blog's content column is 800 pixels wide, you don't need a 4000-pixel image. Resize down (or to 2× for retina = 1600px).

Use our resize tool in pixel mode or percent mode. Drop a folder of photos and resize them all in one go.

2. Compress without visible quality loss

A 4000×3000 photo from a phone might be 6 MB. Compressed to 1600px wide WebP at quality 85, it's often under 200 KB. That's 30× smaller for the same visible quality on a web page.

Our compressor handles this with a real-time preview so you can see what quality setting works.

3. Convert iPhone HEIC photos

If you photograph blog content on an iPhone, your photos are HEIC by default. WordPress and many other CMSs can't handle HEIC. Convert with our HEIC to JPG converter — or change your iPhone settings to take JPG natively.

4. Convert to WebP for modern web

Most blog hosting and CMSs now support WebP. Files are 25-35% smaller than JPG at the same quality. Use our JPG to WebP converter for new content.

A complete blog image workflow

  1. Take photos at high quality. Don't pre-shrink at capture; you can always reduce.
  2. Edit in your tool of choice. Crop, color correct, etc. Export at full resolution.
  3. Resize to display width × 2. For an 800px content column, resize to 1600px wide.
  4. Convert to WebP at quality 85. (Or keep as JPG quality 85 if your CMS doesn't handle WebP.)
  5. Upload to your CMS. Give the image a descriptive file name (red-running-shoes-test.webp, not IMG_4523.webp).
  6. Add descriptive alt text in your CMS editor. Briefly describe what's in the image.

Platform-specific tips

WordPress

WordPress 5.8+ supports WebP natively. Set the WordPress image size thresholds so you don't store unnecessary large versions. Use a caching plugin (WP Rocket, W3 Total Cache) and a CDN (Cloudflare, BunnyCDN).

Ghost

Ghost handles image resizing automatically when you upload via the editor. You still want to pre-compress to keep upload sizes manageable.

Substack / Medium / Beehiiv

These hosted platforms do their own image processing. Pre-compressing makes uploads faster and gives you more predictable quality. They'll re-encode but starting smaller is better.

Static sites (Hugo, Eleventy, Astro, Next.js)

Use image processing in your build pipeline (often via plugins). For one-off images and source preparation, use our browser tools or API.

Featured images and OG tags

Every post needs a featured image for social sharing. Recommended size: 1200×630 pixels for Open Graph (Facebook, LinkedIn). Use our resize tool's preset mode to crop to this exact size.

Set this as your og:image meta tag and the post will preview properly when shared on social.

SEO-friendly image practices

  • Descriptive file names — Google reads them
  • Alt text for every content image
  • Captions where they add value
  • WebP format for smaller files
  • Set width/height attributes to avoid layout shift
  • Lazy load below-the-fold images

Privacy bonus

If you photograph things for your blog that have any sensitive backdrop (your home, work, family), our browser-based tools mean no one sees your raw photos except you. Convert and crop locally; upload only the final versions.

Start fixing your blog images

Pick a recent post with heavy images. Run them through our compressor and resize tool. Re-upload. Measure page load time before and after. The improvement will surprise you.