✍️ Blog Image Optimization

JPG to WebP for Bloggers

Your blog's hero image is almost certainly the LCP element — the metric Google cares about most for rankings. Switching from JPG to WebP cuts image weight 25–35%, improving load times and Core Web Vitals scores without changing visual quality.

Works on WordPress, Ghost, Webflow Free, unlimited No account needed Batch convert entire posts

Convert Blog Images to WebP — Free

Drop your JPG hero and in-post images. Convert. Upload to your blog.

Convert JPG to WebP →

Recommended Blog Image Sizes

Image TypeRecommended SizeTarget File Size (WebP)Notes
Hero / Featured image1200 × 630 pxUnder 120 KBog:image standard — used by all social platforms
In-post content images800 px wideUnder 80 KBKeep height proportional; add loading="lazy"
Infographics800 × 1200 pxUnder 200 KBTall format ranks better in Google Image Search
Author headshot200 × 200 pxUnder 20 KBUse WebP or PNG; often displayed at 48–80px
og:image (social share)1200 × 630 pxKeep as JPG for og:image; use WebP for the <img> tag
og:image tip: Serve WebP for the actual image in your post's <img> tag. But set your og:image meta tag to a JPG URL — some social media crawlers and Slack unfurls don't handle WebP og:image well.

Blog Platform WebP Support

WordPress
Native (5.8+)

Upload WebP directly to Media Library. Generates all thumbnails automatically.

Ghost
Native

Ghost CDN accepts and serves WebP. Drag into post editor directly.

Webflow
Native

Upload WebP in Assets panel. Webflow's CDN serves it to all modern browsers.

Medium
Auto-optimized

Medium's CDN converts all uploads to WebP automatically. No action needed.

Substack
Accepts WebP

Upload WebP directly. Substack serves it via their CDN to subscribers.

Squarespace
Auto-optimized

Squarespace auto-converts uploaded images to WebP via their CDN (Squarespace 7.1+).

Image Optimization Workflow for Bloggers

1
Size before convert

Resize your hero to 1200×630 px and in-post images to 800 px wide. Don't upload oversized originals — that wastes storage and conversion time.

2
Convert to WebP

Drop all blog post images into Convertlo. Enable batch mode, set quality to 85, convert all at once.

3
Name your files well

Rename: how-to-bake-sourdough-starter.webp. Google Image Search indexes filenames as a ranking signal.

4
Upload & add alt text

Upload to your blog platform. Add descriptive alt text to every image — it's both an accessibility requirement and an SEO signal.

Blogger Image SEO Tips

LCP
Hero image = LCP element

In most blog posts, the hero/featured image is the Largest Contentful Paint element. Cut its file size with WebP and add fetchpriority="high" to tell the browser to load it first.

Lazy Loading
Lazy-load all images below the fold

Add loading="lazy" to every in-post image. Do NOT add it to the hero — that delays the LCP element and hurts your score.

Filenames
Descriptive filenames = free Image SEO

Before uploading, rename images to describe the content: sourdough-starter-day3.webp. Google reads filenames as context for image ranking.

Alt Text
Alt text doubles as image SEO copy

Write alt text that describes what's in the image, not keyword stuffing. "A sourdough starter in a glass jar on a wooden counter" beats "sourdough bread recipe blog post."

Social Sharing
Keep og:image as JPG for wider compatibility

Use WebP for <img> tags in your post. Set your og:image meta tag to a JPG — Twitter, LinkedIn, and some Slack versions prefer JPG for link preview images.

File Size Target
Under 100 KB per in-post image

A WebP at quality 80–85 typically reaches under 100 KB for a 800 px wide image. If it's still over 150 KB, run it through Convertlo's compressor after converting.

Frequently Asked Questions

What is the best image format for blog posts?
WebP for all in-post images. JPG as og:image for social sharing metadata. PNG only for screenshots containing text or graphics requiring pixel-perfect clarity. WebP at quality 85 produces files 25–35% smaller than equivalent JPGs at the same visual quality — directly improving page load times and LCP scores.
What size should blog hero images be?
1200 × 630 px — the og:image standard used by Facebook, Twitter/X, LinkedIn, and Slack when your post is shared. This exact ratio (1.91:1) fills the link preview card on all major platforms. As a WebP at quality 85, a 1200 × 630 image should be under 120 KB.
Does WebP work on WordPress blogs?
Yes, since WordPress 5.8 (July 2021). Upload WebP directly to your Media Library — no plugin needed. WordPress generates thumbnail variants from the WebP original automatically. For older WordPress versions, either update WordPress or use a plugin like WP Rocket to handle WebP serving.
Will converting to WebP affect my blog's social share images?
Only if your og:image URL points to a .webp file. Set og:image to a JPG URL, and use WebP for the actual post image. This way your in-post images are fast WebP, and your social share thumbnails use the universally compatible JPG format.
How do I check if my blog images are hurting SEO?
Run your blog post URL through Google PageSpeed Insights (pagespeed.web.dev). Look for "Serve images in next-gen formats" and "Properly size images" under Opportunities. These two flags are fixed by converting to WebP and resizing before upload. Also check your LCP score — it should be under 2.5s for a "Good" rating.

Related Tools