When building a blog or static site, Search Engine Optimization (SEO) is a critical step in attracting organic traffic. Although Jekyll is a lightweight and efficient static site generator, it doesn’t offer complex SEO features out of the box. Fortunately, with proper configuration and structure, you can achieve excellent SEO performance.
This article walks you through how to optimize your Jekyll site for SEO.
1. Enable the jekyll-seo-tag Plugin
This is the official SEO plugin for Jekyll. It automatically adds meta tags such as title, description, Open Graph, Twitter Card, and more.
Installation
Add the plugin in your _config.yml:
plugins:
- jekyll-seo-tag
Then include the following in your site’s <head> section:
{% seo %}
Example Output:
<title>The Complete Guide to SEO Optimization with Jekyll | My Blog</title>
<meta
name="description"
content="A guide on using jekyll-seo-tag and structural optimization to build an SEO-friendly Jekyll site."
/>
<meta
property="og:title"
content="The Complete Guide to SEO Optimization with Jekyll"
/>
<meta name="twitter:card" content="summary" />
...
2. Set Up robots.txt and sitemap.xml
robots.txt
This file tells search engines what they are allowed to crawl:
User-agent: *
Disallow:
Sitemap: https://yourdomain.com/sitemap.xml
Place it in the root of your site.
sitemap.xml
Use the official plugin to generate it automatically:
plugins:
- jekyll-sitemap
A sitemap.xml file will be generated at the root of your site, listing all pages for search engines to crawl.
For multilingual sites, consider using a custom sitemap. Example below:
👉 See multilingual sitemap example: Link to your article
3. Add Page Descriptions (excerpt)
By default, Jekyll doesn’t include a meta description. You can add one manually at the beginning of each post:
---
title: The Complete Guide to SEO Optimization with Jekyll
excerpt: A guide on using jekyll-seo-tag and structural optimization to build an SEO-friendly Jekyll site.
---
When combined with jekyll-seo-tag, the excerpt will be used as the meta description.
4. Semantic HTML and Clear Structure
- Use semantic tags like
article,section,nav, etc. - Only use one
<h1>per page, and follow hierarchy with<h2>to<h4> - Use
<nav>for navigation and breadcrumbs - Add
titleattributes to links andaltattributes to images
5. Multilingual SEO (e.g., jekyll-polyglot)
If you’re using a multilingual plugin like jekyll-polyglot, keep these in mind:
- Use
<link rel="alternate" hreflang="xx">to indicate language versions - Generate language-specific URLs in your sitemap.xml
- Keep consistent folder structures like
/and/en/to avoid confusion
Example:
<link rel="alternate" hreflang="zh" href="https://yourdomain.com/" />
<link rel="alternate" hreflang="en" href="https://yourdomain.com/en/" />
6. Image Optimization
- Use WebP format (or compressed JPEG/PNG)
- Add
altattributes for image search - Use semantic file names like
jekyll-seo-example.webp
7. Social Media Previews (Open Graph / Twitter Cards)
jekyll-seo-tag handles most of this, but you can also customize in front matter:
image: /assets/images/jekyll-seo-preview.png
twitter:
card: summary_large_image
This ensures your post displays nicely when shared on Twitter, Weibo, Telegram, etc.
8. Analytics Integration (Optional)
Recommended tools:
- Google Search Console (crawl and indexing reports)
- Bing Webmaster Tools
- Baidu Webmaster Tools (for Chinese traffic)
- Umami / Cloudflare Analytics / Plausible (privacy-friendly analytics)
Summary Checklist ✅
| Item | Done |
|---|---|
Install jekyll-seo-tag |
✅ |
Configure robots.txt |
✅ |
Configure sitemap.xml |
✅ |
Add excerpt descriptions |
✅ |
| Optimize images | ✅ |
| Set social share images | ✅ |
| Add hreflang for languages | ✅ |
| Use semantic HTML5 | ✅ |
A well-structured and SEO-optimized Jekyll blog can bring you long-term organic traffic and improve your visibility in search results. To further improve performance, consider external SEO strategies like backlinks, content marketing, and social sharing.