Topic 9: On-page SEO
📖 5 min read · 🎯 beginner · 🧭 Prerequisites: about-seo-types-of-seo, keyword-analysis
Why this matters
You've done the keyword research — you know what your audience is searching for. But here's the thing — just knowing the right words isn't enough. Your pages have to actually use them in the right places, in the right way. That's on-page SEO: making sure every element inside your page — the title tag, headings, URL, images, and your content — clearly signals to Google what that page is about. Get this right, and search engines stop guessing and start ranking you. Let's go through each element so you can optimize any page with confidence.
What You'll Learn
- Understand what on-page SEO is and why it drives relevant traffic
- Write effective title tags, meta descriptions, and heading hierarchies
- Structure clean URLs and optimize content with primary and related keywords
- Apply advanced techniques: internal linking, image optimization, mobile responsiveness, and page speed
- Set up a recurring monitoring routine using Google Analytics and Search Console
The Analogy
Think of your website as a castle, and each web page as a room inside it. The nameplate above the entrance is your title tag — visitors and couriers (search engines) glance at it first to know what's inside. The invitation card slipped under the door is your meta description — it entices guests to step in. Signposts along the corridors are your heading tags, guiding visitors room to room. The pathways between wings are your internal links, letting guests discover the full estate without getting lost. And just as a well-maintained castle with fast drawbridges and tidy galleries keeps visitors happy and coming back, a well-optimized page with quick load times and accessible images keeps both users and search bots satisfied.
Chapter 1: Understanding On-Page SEO
On-page SEO refers to the practice of optimizing individual web pages to rank higher and earn more relevant traffic in search engines. It involves a mix of content optimizations and HTML source code optimizations, making your site both user-friendly and search-engine-friendly.
The scope of on-page SEO is everything you control on the page itself — as opposed to off-page SEO (backlinks) or technical SEO (server configuration, crawl budget). Every change you make here is entirely in your hands and can be deployed today.
Why it matters: If your website is an online bakery, on-page SEO is what ensures that when people search for "best chocolate cake recipe" or "gluten-free cupcakes," your specific recipe pages appear prominently in the results — not just your homepage.
Chapter 2: Essential On-Page SEO Elements
1. Title Tags
The title tag is the nameplate at the entrance of your page. It appears as the blue clickable headline in search results and in the browser tab. It must clearly describe the page content and include the page's primary keyword.
<!-- Too generic — avoid this -->
<title>Home</title>
<!-- Specific and keyword-rich — do this -->
<title>Delicious Homemade Cakes – Sunshine Bakery</title>
Best practices:
- Keep it under 60 characters to avoid truncation in SERPs
- Place the primary keyword near the front
- Make every page's title tag unique across your site
2. Meta Descriptions
The meta description provides a brief summary of your page content and entices users to click through from search results. It does not directly influence rankings, but a compelling description improves click-through rate (CTR), which is a positive signal.
<meta name="description" content="Discover the best homemade cake recipes and order online from Sunshine Bakery. Fresh, delicious, and delivered to your door!">
Best practices:
- Keep it between 150–160 characters
- Include your primary keyword naturally
- Write it like a mini ad — benefit-focused and action-oriented
- Make every page's meta description unique
3. Headings (H1, H2, H3)
Headings structure your content, making it easier to read and navigate. They also signal content hierarchy to search engines.
- Use exactly one H1 per page — this is your main topic statement and should include your primary keyword
- Use H2s to divide major sections
- Use H3s to subdivide content within an H2 section
<h1>Best Chocolate Cake Recipes</h1>
<h2>Ingredients</h2>
<h2>Step-by-Step Instructions</h2>
<h3>Preparing the Batter</h3>
<h3>Baking Tips</h3>
Never skip heading levels (e.g., jumping from H1 directly to H4) — it breaks both accessibility and semantic structure.
4. URL Structure
A clean, descriptive URL tells search engines and users exactly what the page is about before they even visit it.
# Opaque — avoid
https://www.yourbakery.com/page1
# Descriptive and keyword-rich — use this
https://www.yourbakery.com/chocolate-cake-recipes
Best practices:
- Use lowercase letters and hyphens (not underscores) between words
- Keep URLs short — remove stop words like "and", "the", "a" where possible
- Mirror the heading hierarchy when building subfolders (e.g.,
/recipes/chocolate-cake/)
5. Content Optimization
High-quality, relevant content is the core of on-page SEO. Content must be informative, engaging, and naturally include your primary keyword and semantically related keywords (LSI keywords) — without keyword stuffing.
Checklist for optimized content:
- Primary keyword appears in the first 100 words
- Related keywords and synonyms are woven throughout naturally
- Content fully answers the search intent behind the target query
- Paragraphs are short and scannable
- Images, videos, and infographics are used to increase engagement and shareability
- Content length matches what the topic genuinely requires — do not pad for padding's sake
Chapter 3: Advanced On-Page SEO Techniques
1. Internal Linking
Linking to other relevant pages on your own site helps users discover more content and helps search engines understand your site's structure and the relative importance of each page.
<!-- On your chocolate cake recipe page -->
<p>Love baking? Try our
<a href="/vanilla-cake-recipe">Vanilla Cake Recipe</a>
or explore our
<a href="/cake-decorating-tips">Cake Decorating Tips</a>.
</p>
Best practices:
- Use descriptive anchor text (not "click here")
- Link to pages that are genuinely relevant to the current page's content
- Avoid over-linking — 3–5 contextual internal links per page is a healthy range
2. Image Optimization
Search engines cannot see images — they read the file name and alt attribute to understand what an image shows. Proper image optimization also improves page speed and accessibility.
<!-- Unoptimized -->
<img src="IMG_1234.jpg">
<!-- Optimized -->
<img src="chocolate-cake.jpg" alt="A slice of rich dark chocolate cake on a white plate">
Best practices:
- Use descriptive, keyword-informed file names with hyphens (e.g.,
chocolate-cake-recipe.jpg) - Write alt text that describes the image naturally — include a keyword where it fits organically
- Compress images before upload (tools: Squoosh, TinyPNG) to reduce file size without visible quality loss
- Use modern formats like WebP where browser support allows
3. Mobile Optimization
Many users access websites from mobile devices, and Google uses mobile-first indexing — meaning the mobile version of your page is the primary version it evaluates for ranking.
Best practices:
- Use responsive design so your layout adapts fluidly to any screen size
- Ensure tap targets (buttons, links) are at least 48×48 px
- Avoid content that requires Flash or other non-mobile-compatible plugins
- Test your pages with Google's Mobile-Friendly Test tool
/* Responsive foundation */
img {
max-width: 100%;
height: auto;
}
body {
font-size: 16px; /* minimum readable on mobile */
}
4. Page Speed
A fast-loading site improves user experience and is a confirmed Google ranking signal. Users abandon pages that take more than 3 seconds to load.
Key optimization techniques:
- Compress images before uploading (see Image Optimization above)
- Leverage browser caching so returning visitors load assets from cache instead of the server
- Minify CSS and JavaScript to remove whitespace and comments that bloat file sizes
- Enable GZIP compression on your server to reduce transfer sizes
- Use a Content Delivery Network (CDN) to serve assets from servers geographically close to the user
Tool: Use Google PageSpeed Insights to analyze your site and receive specific, prioritized recommendations for both mobile and desktop.
Chapter 4: Monitoring and Maintenance
On-page SEO is not a one-time task. Search intent evolves, competitors publish new content, and your own pages grow stale. Regular monitoring keeps your pages competitive.
Recommended monthly review routine:
- Open Google Search Console → check which queries are driving impressions and clicks to each key page
- Open Google Analytics → review bounce rate, time on page, and organic traffic trends
- Identify pages with declining traffic — update content, refresh statistics, and strengthen internal links
- Check for broken internal links and fix or redirect them
- Look for pages with high impressions but low CTR — rewrite the title tag and meta description
- Review Core Web Vitals in Search Console for any pages flagged with poor performance
Monitoring checklist (monthly):
[ ] Search Console: queries, CTR, impressions per page
[ ] Analytics: organic sessions, bounce rate, conversions
[ ] Broken link audit
[ ] Content freshness review on top-10 pages
[ ] PageSpeed Insights on recently published pages
[ ] Mobile usability report in Search Console
🧪 Try It Yourself
Task: Audit a single page on your website (or a page you're building) against the on-page SEO checklist.
- Open the page in your browser and view its source (
Ctrl+U/Cmd+U) - Find the
<title>tag — does it include your primary keyword and stay under 60 characters? - Find the
<meta name="description">tag — is it between 150–160 characters and compelling? - Check that there is exactly one
<h1>and that it contains the primary keyword - Pick one image on the page and verify its
altattribute describes the image with a natural keyword inclusion - Run the URL through Google PageSpeed Insights and note the top three opportunities listed
Success criterion: You should be able to tick at least 4 of the 6 points above. For any that fail, make the fix and re-run PageSpeed Insights to confirm the score improves.
🔍 Checkpoint Quiz
Q1. What is the primary purpose of a meta description in on-page SEO?
A) It directly boosts your keyword rankings in Google
B) It tells Google the publishing date of your page
C) It provides a summary that can improve click-through rate from search results
D) It replaces the title tag when the title is too long
Q2. A developer writes the following HTML for a page about gluten-free muffins. What is the on-page SEO problem?
<h1>Welcome to Our Site</h1>
<h2>Gluten-Free Muffin Recipes</h2>
<p>Here are our top recipes...</p>
A) The H2 tag is not allowed on recipe pages
B) The H1 does not include the primary keyword and is too generic
C) There should be an H3 before the H2
D) There is no problem — this is correct
Q3. Which of the following URL structures best follows on-page SEO best practices?
A) https://www.bakery.com/p?id=482
B) https://www.bakery.com/Gluten_Free_Muffin_Recipes
C) https://www.bakery.com/gluten-free-muffin-recipes
D) https://www.bakery.com/recipes/the-best-and-most-delicious-gluten-free-muffin-recipes-you-will-ever-find
Q4. Your product page has 5,000 monthly impressions in Google Search Console but only a 1.2% click-through rate. Which on-page element should you prioritize improving first?
A) Add more internal links to the page
B) Compress the page's images
C) Rewrite the title tag and meta description to be more compelling
D) Add an H4 subheading
A1. C — The meta description does not directly affect rankings but a well-written one improves CTR, which is a positive behavioral signal.
A2. B — The H1 says "Welcome to Our Site" rather than referencing the actual topic. The primary keyword ("gluten-free muffins") belongs in the H1.
A3. C — Lowercase letters, hyphens as separators, and a concise descriptive slug are all best practices. Option A is opaque, B uses underscores and mixed case, and D is excessively long.
A4. C — High impressions with low CTR means users are seeing the page in results but not clicking. The title tag and meta description are the two elements users see in the SERP, so rewriting them is the highest-leverage fix.
🪞 Recap
- On-page SEO optimizes individual pages through content and HTML elements to rank higher and attract relevant organic traffic.
- Title tags (under 60 chars, keyword-forward) and meta descriptions (150–160 chars, benefit-driven) are the first things users and search engines evaluate in SERPs.
- A single H1 with your primary keyword, logical H2/H3 hierarchy, clean hyphenated URLs, and naturally keyword-rich content form the structural backbone of every optimized page.
- Advanced techniques — internal linking with descriptive anchor text, descriptive image file names and alt text, mobile-responsive design, and fast load times — compound your on-page gains.
- On-page SEO requires monthly maintenance: use Google Search Console and Google Analytics to monitor performance, refresh stale content, fix broken links, and re-optimize underperforming pages.
📚 Further Reading
- Google Search Central — How Google Search Works — the source of truth on how Google crawls and indexes pages
- Google PageSpeed Insights — analyze and improve page speed with actionable recommendations
- Moz — On-Page SEO Guide — comprehensive breakdown of every on-page factor with examples
- Google Search Console Documentation — learn how to read performance data and act on it
- ⬅️ Previous: Keyword Analysis
- ➡️ Next: Technical SEO