How to Optimize Images for SEO on Ghost CMS

Last Updated: February 2026

Image optimization on Ghost CMS involves choosing the right format (WebP or AVIF over JPEG/PNG), compressing files below 200 KB, writing descriptive alt text, and using Ghost's built-in responsive image processing. These steps reduce page load times by 40-60%, directly improving Core Web Vitals scores and search engine rankings for your Ghost blog.

Why Does Image Optimization Matter for Ghost SEO?

Images account for roughly 50% of total page weight on most websites, according to the HTTP Archive's annual report. On Ghost CMS, where content-heavy blog posts often include multiple screenshots, diagrams, and feature images, unoptimized visuals become the single biggest performance bottleneck.

I've been running this Ghost blog since 2022, and one of the first things I noticed was how dramatically image optimization affected page speed scores. After compressing and converting images across 15 posts, my average Lighthouse performance score jumped from 62 to 89. That's not a marginal improvement — it's the difference between Google flagging your site as "needs improvement" and marking it "good."

Google's Core Web Vitals directly factor into search rankings. Largest Contentful Paint (LCP) — the metric measuring how fast your main content loads — is heavily influenced by image size. Ghost already handles responsive image generation, but you still need to feed it properly optimized source files.

Which Image Format Should You Use on Ghost?

Choosing the right image format is the highest-impact decision you can make. Each format serves a different purpose, and using the wrong one wastes bandwidth without improving visual quality.

Format	Best For	Compression	Transparency	Browser Support
WebP	Most blog images, photos, graphics	25-35% smaller than JPEG	Yes	97%+ global (all modern browsers)
AVIF	High-quality photos where size matters	50% smaller than JPEG	Yes	92%+ (Chrome, Firefox, Safari 16.4+)
JPEG	Fallback for older browsers, email	Good, but larger than WebP	No	100%
PNG	Screenshots, logos, text overlays	Lossless, larger files	Yes	100%
SVG	Icons, diagrams, vector graphics	Tiny for simple shapes	Yes	100%

WebP is the best default choice for Ghost blogs in 2026. According to Can I Use, WebP support has reached over 97% of global browsers, making compatibility concerns effectively obsolete. When I switched my feature images from JPEG to WebP, file sizes dropped from 180-350 KB to 60-120 KB with no visible quality loss.

AVIF offers even better compression, but Ghost CMS doesn't natively convert uploads to AVIF yet. If you pre-convert images to AVIF before uploading, Ghost will serve them correctly. For most bloggers, WebP strikes the best balance between compression and workflow simplicity.

How Do You Resize and Compress Images Before Uploading to Ghost?

Ghost automatically generates responsive image variants (300w, 600w, 1000w, 1600w, 2000w) from your uploaded source file. However, uploading a 4000x3000 pixel, 5 MB photograph forces Ghost to process unnecessarily large files and still serves the original at the largest breakpoint.

Resize your source images to a maximum width of 2000 pixels before uploading. For most Ghost themes, the content area is 700-800 pixels wide, meaning 2000px provides sharp rendering on high-DPI (Retina) displays without excess bloat.

Recommended Compression Tools

Tool	Type	Best For	Pricing
Squoosh	Browser-based	Quick one-off compression with visual comparison	Free (Google Chrome Labs)
TinyPNG	Browser-based / API	Batch processing, WordPress/API integration	Free (500/month) or $25/year
Sharp (Node.js)	CLI / Library	Automated pipelines, Ghost theme integration	Free (open source)
XnConvert	Desktop app	Bulk batch conversion with format options	Free for personal use

My workflow for this blog: I run images through Squoosh with WebP output at quality 80, which consistently produces files under 100 KB for standard blog images. For batch processing, Sharp's CLI handles entire directories in seconds.

Target File Sizes

• Feature images: Under 200 KB (these load above the fold and impact LCP)
• In-content images: Under 150 KB
• Thumbnails and icons: Under 30 KB
• Total page images: Aim for under 1 MB combined per post

What Makes Effective Alt Text for SEO on Ghost?

Alt text serves two distinct purposes: it tells search engines what an image contains, and it provides context for screen readers used by visually impaired visitors. Ghost makes adding alt text straightforward — click any image in the editor and fill in the "Alt text" field that appears.

Good alt text is descriptive, specific, and naturally incorporates relevant keywords without stuffing. According to Google's image SEO guidelines, alt text should describe the image accurately while being useful in the context of the page content.

Alt Text Examples

Image	Bad Alt Text	Good Alt Text
Screenshot of Ghost editor	"ghost" or "image1"	"Ghost CMS editor showing the image upload dialog with alt text field highlighted"
PageSpeed Insights score	"pagespeed score"	"Google PageSpeed Insights showing 92 performance score after image optimization"
WebP vs JPEG comparison	"comparison"	"Side-by-side comparison of WebP at 80KB versus JPEG at 210KB showing identical visual quality"

Keep alt text between 10 and 125 characters. Avoid starting with "image of" or "picture of" — screen readers already announce that it's an image. For decorative images that add no informational value (background patterns, spacers), use empty alt text (alt="") to signal that the image can be skipped.

How Does Ghost Handle Responsive Images Automatically?

One of Ghost's strongest SEO features is its built-in responsive image processing. When you upload an image, Ghost automatically generates multiple sizes using the srcset attribute in the rendered HTML. This means browsers download only the appropriately sized version for the user's screen.

Ghost generates these breakpoints from your uploaded image: 300w, 600w, 1000w, 1600w, and 2000w. The browser picks the smallest version that fills the image container at the user's device pixel ratio. A visitor on a mobile phone receives a 600w image instead of the full 2000w version, saving significant bandwidth.

You don't need to configure anything for this to work — Ghost handles it automatically. However, there's an important caveat: Ghost only generates smaller versions, never larger ones. If you upload a 900px wide image, Ghost creates 300w and 600w variants but can't generate 1000w, 1600w, or 2000w. This is why uploading at 2000px width matters.

Should You Enable Lazy Loading for Ghost Blog Images?

Lazy loading defers the downloading of images that are below the fold (not visible when the page first loads) until the user scrolls near them. This directly improves initial page load time and LCP scores.

Most modern Ghost themes include native lazy loading using the loading="lazy" HTML attribute, which is supported by all major browsers. Check your theme's image rendering — if it doesn't include this attribute, you can add it through a Ghost theme customization or code injection.

One common mistake: don't lazy-load your feature image or any image visible in the initial viewport. Lazy loading above-the-fold images actually hurts LCP because the browser waits for scroll triggers before fetching them. Ghost's default behavior handles this correctly for feature images, but verify with your specific theme.

How Do You Optimize File Names Before Uploading?

Search engines read image file names as a relevance signal. A file named IMG_20231015_143022.jpg tells Google nothing, while ghost-cms-image-optimization-settings.webp provides clear topical context.

Follow these file naming rules:

1. Use hyphens as word separators — Google treats hyphens as spaces (ghost-seo-guide, not ghost_seo_guide)
2. Include relevant keywords naturally — describe what the image actually shows
3. Keep names concise — 3 to 6 words is the ideal range
4. Use lowercase only — avoids potential URL encoding issues
5. Remove dates and camera codes — strip auto-generated prefixes before uploading

Ghost preserves your original file name in the image URL path (/content/images/2026/02/your-file-name.webp), so the name you choose persists in the live URL that search engines crawl and index.

How Do You Create and Submit an Image Sitemap for Ghost?

Ghost automatically generates a sitemap at /sitemap.xml that includes your posts and pages. However, Ghost's default sitemap does not include dedicated image entries with <image:image> tags. This means Google discovers your images primarily through crawling page content rather than a dedicated image feed.

For most Ghost blogs, this is sufficient — Google's crawler finds and indexes images embedded in your content during regular page crawling. If you rely heavily on image search traffic (photography blogs, visual portfolios), you can generate a supplementary image sitemap using tools like XML-Sitemaps.com and submit it through Google Search Console.

Make sure to verify your Ghost site in Google Search Console if you haven't already. Beyond sitemaps, Search Console provides image-specific performance data showing which of your images appear in Google Image search, how often they're clicked, and what queries trigger them.

How Can You Monitor Image Performance on Ghost?

After optimizing your images, measure the results. Two free tools give you actionable data:

Google PageSpeed Insights analyzes your page and flags specific images that need optimization. It reports LCP timing, total image payload, and whether images are properly sized for their display dimensions. Run this on your highest-traffic posts first.

GTmetrix provides a waterfall chart showing exactly when each image starts and finishes loading. This reveals bottlenecks — if one oversized hero image blocks everything else, you'll see it clearly in the waterfall.

I test every post after publishing by running PageSpeed Insights on both mobile and desktop. Mobile scores matter more for SEO because Google uses mobile-first indexing, meaning the mobile version of your page is what Google primarily evaluates.

Performance Benchmarks to Target

Metric	Good	Needs Improvement	Poor
Largest Contentful Paint (LCP)	Under 2.5s	2.5s - 4.0s	Over 4.0s
Cumulative Layout Shift (CLS)	Under 0.1	0.1 - 0.25	Over 0.25
Total Image Weight (per page)	Under 500 KB	500 KB - 1.5 MB	Over 1.5 MB
Lighthouse Performance Score	90+	50-89	Under 50

What About Image Captions and Figure Elements?

Ghost supports image captions natively — click on any image in the editor and type in the caption field below it. Captions display as <figcaption> elements wrapped in <figure> tags in the rendered HTML, which is the semantically correct way to associate descriptive text with an image.

Captions aren't a direct ranking factor, but they serve two indirect SEO purposes. First, they add contextual text near the image that search engines use to understand relevance. Second, readers actually read captions — eye-tracking studies show captions are among the most-read text elements on a page.

Use captions when they add genuine value: explain what a screenshot demonstrates, credit a data source, or highlight a key takeaway. Skip captions on decorative images where they'd feel forced.

How Does Image SEO Connect to Overall Ghost Performance?

Image optimization doesn't exist in isolation. It connects directly to your Ghost blog's broader performance stack. If you're serious about Ghost SEO, pair image optimization with these complementary practices:

• Cloudflare caching — serves cached image versions from edge servers worldwide, reducing origin server load and latency (see our Cloudflare caching guide for Ghost)
• Proper meta tags — set feature images as Open Graph and Twitter Card images for social sharing (learn how to edit meta titles and descriptions on Ghost)
• Ghost tags for categorization — organize image-heavy content into relevant tag clusters (Ghost tags SEO best practices)
• Theme selection — choose a theme with built-in lazy loading and optimized image rendering (best Ghost themes)

After running this blog on Ghost for over three years, I've found that image optimization delivers the single biggest performance improvement per hour of effort. A 30-minute session converting and compressing your top 10 posts' images can improve site-wide Lighthouse scores by 15-25 points. No other optimization technique gives you that kind of return.

Quick Reference: Image Optimization Checklist for Ghost

1. Convert images to WebP format before uploading (use Squoosh or Sharp)
2. Resize source images to maximum 2000px width
3. Compress to under 200 KB for feature images, under 150 KB for in-content images
4. Write descriptive, keyword-relevant alt text (10-125 characters)
5. Use hyphenated, lowercase, descriptive file names
6. Verify your theme supports lazy loading for below-fold images
7. Don't lazy-load above-the-fold or feature images
8. Add captions where they provide genuine context
9. Test with PageSpeed Insights after publishing (mobile first)
10. Monitor image search performance in Google Search Console