Getting a Small Coaching Centre onto Google
Mr. and Mrs. Sharma run Ganit Point, a small maths coaching centre in Malviya Nagar, Jaipur. Their teaching is excellent and their students score well. But when a parent nearby searches for “maths tuition class 11 Malviya Nagar”, the big coaching chains appear first, and Ganit Point is nowhere on the first page.
SEO (Search Engine Optimisation) is the work of helping search engines like Google understand your page and show it to the right people. A search engine sends a program called a crawler to read your HTML. It cannot see your design the way a person does. It reads tags, headings, links and text, and decides what the page is about.
In the HTML Head and Meta Tags lesson you met the title, the description and Open Graph tags. In this lesson we go deeper and look at how the structure of your whole HTML helps search engines, and what HTML cannot do on its own.
A Title and Description People Want to Click
The <title> usually becomes the blue clickable heading in the search result, and the meta description is often the grey text under it. They decide whether a parent clicks your result or the one below it.
- Title: say what the page offers, for whom and where. Put the most important words first. Around 50 to 60 characters fits on most screens.
- Description: one or two sentences, around 150 characters, that give a reason to click: small batches, a free demo class, a location.
- Every page gets its own title and description. The fees page and the results page should not both say “Ganit Point”.
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Weak: says nothing useful -->
<title>Home</title>
<!-- Strong: what, where and who it is for -->
<title>Maths Coaching for Class 9 to 12 in Malviya Nagar, Jaipur</title>
<meta name="description" content="Small batches of 15 students, weekly tests and doubt classes for CBSE and RBSE maths. Free demo class every Saturday in Malviya Nagar, Jaipur.">
</head>
(A real page has only one title. The weak one is shown only for comparison.) Search engines may rewrite your title or description if they think another text matches the search better, but a clear, honest one is used most of the time. You may also see the old meta keywords tag in tutorials. Google has ignored it for many years, so you do not need it.
One h1 and Logical Headings
Headings are the outline of your page, like the chapter list of a textbook. Search engines use them to understand the main topic and the sub-topics. Follow simple rules:
- Use one
<h1>that states the main topic of the page, in words people actually search for. - Use
<h2>for the main sections and<h3>for parts inside them. - Do not choose a heading level for its size. Use CSS for size.
<h1>Ganit Point: Maths Coaching in Jaipur</h1>
<h2>Courses</h2>
<h3>Class 9 and 10 Foundation</h3>
<p>Board syllabus with weekly chapter tests.</p>
<h3>Class 11 and 12 Maths</h3>
<p>Calculus, algebra and board exam practice.</p>
<h2>Batch Timings</h2>
<p>Morning: 7:00 to 8:30. Evening: 5:00 to 6:30.</p>
<h2>Visit Us</h2>
<p>Second floor, above the stationery shop, Malviya Nagar.</p>
Read only the headings of this example. You already know what the page is about and what it contains. That is exactly what a crawler sees.
Semantic Tags Show What Each Part Is
You learned about semantic HTML in the Semantic HTML lesson. For SEO, these tags matter because they separate the main content from the repeated parts of the page. <main> tells the search engine “this is the unique content of this page”, while <header>, <nav> and <footer> are the same on every page.
<header>
<p><strong>Ganit Point</strong></p>
<nav>
<a href="#courses">Courses</a> |
<a href="#results">Results</a> |
<a href="#contact">Contact</a>
</nav>
</header>
<main>
<h1>Maths Coaching for Class 9 to 12 in Jaipur</h1>
<section id="courses">
<h2>Courses</h2>
<p>Foundation, board preparation and entrance basics.</p>
</section>
<article id="results">
<h2>Our Students Scored Above 90 in Board Maths</h2>
<p>Last year, 18 of our 40 Class 12 students scored above 90.</p>
</article>
</main>
<footer id="contact">
<p>Malviya Nagar, Jaipur. Open Monday to Saturday.</p>
</footer>
Descriptive Links, Image Alt and File Names
Search engines read the words inside a link to learn what the linked page is about. “Click here” tells them nothing. “Fee structure for Class 11 and 12 maths” tells them exactly what to expect. The same text also helps screen reader users, as you saw in the Accessibility Basics lesson.
Search engines cannot look at a photo the way people do. They use the alt text, the text around the image and the file name. A file named IMG_2034.jpg says nothing. A file named ganit-point-class-11-batch.jpg says a lot. Use small letters and hyphens, as you learned in the HTML File Paths lesson. Adding width and height also stops the page from jumping while the image loads, which search engines measure as part of page experience.
<p>Weak link: For fees, <a href="#fees">click here</a>.</p>
<p>Strong link: See the <a href="#fees">fee structure for Class 11 and 12 maths</a>.</p>
<p>Weak image:</p>
<img src="https://picsum.photos/id/20/400/220" alt="IMG_2034">
<p>Strong image (on your own site, name the file well too):</p>
<img src="https://picsum.photos/id/20/400/220"
alt="Students solving algebra problems at desks in the Ganit Point classroom"
width="400" height="220">
Canonical Links and Open Graph Previews
Sometimes one page can be opened at several addresses, such as example.com/class-11-maths and example.com/class-11-maths?ref=whatsapp. To a search engine these may look like two copies of the same page. The canonical link says “this is the one official address”, so the search engine shows that one.
Open Graph tags control the preview card when someone shares the link on WhatsApp or other apps. A parent who forwards your page to a family group then sees a proper title, a short line and a banner image, instead of a bare link. Use a full web address (starting with https://) for og:image.
<head>
<!-- The one official address of this page -->
<link rel="canonical" href="https://www.example.com/class-11-maths">
<!-- The preview card for WhatsApp and other apps -->
<meta property="og:type" content="website">
<meta property="og:title" content="Class 11 Maths Coaching in Jaipur | Ganit Point">
<meta property="og:description" content="New batch from 1 April. Small groups and weekly tests. Free demo class.">
<meta property="og:image" content="https://www.example.com/images/class-11-batch-banner.jpg">
<meta property="og:url" content="https://www.example.com/class-11-maths">
</head>
Structured Data with JSON-LD
A search engine can read that your page mentions “Jaipur”, but it cannot always be sure that Jaipur is your address. Structured data states such facts in a fixed format that machines understand. The most common format is JSON-LD: a small block of data inside a <script type="application/ld+json"> tag, using the shared vocabulary from schema.org.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "LocalBusiness",
"name": "Ganit Point Maths Classes",
"description": "Maths coaching for Class 9 to 12 students.",
"url": "https://www.example.com/",
"address": {
"@type": "PostalAddress",
"streetAddress": "Second floor, 12 Example Market, Malviya Nagar",
"addressLocality": "Jaipur",
"addressRegion": "Rajasthan",
"postalCode": "302017",
"addressCountry": "IN"
},
"openingHours": "Mo-Sa 07:00-20:00"
}
</script>
Here "@type": "LocalBusiness" says this is a local business, and the other fields give its name, website and address. All details here are made up. On a real site, the data must match what is visible on the page, or search engines may ignore it. Search engines can use structured data to show richer results, but they never promise to. You can test your code with the free Rich Results Test tool from Google.
JSON is strict. Every name and text value needs double quotes, items are separated by commas, and there must be no comma after the last item. One wrong comma and the whole block is ignored.
What HTML Cannot Do for SEO
Good HTML helps search engines understand your page. It does not make them rank it first. These matter just as much, or more:
- Content quality. Useful, original information that answers what people search for. A page that clearly lists courses, fees, timings and results helps parents. A page stuffed with “best maths coaching Jaipur” twenty times does not, and search engines treat this as spam.
- Speed and mobile use. Most searches in India happen on phones. Heavy images and slow pages lose visitors and rankings. You will learn more in the the “Fast Pages: Lazy Loading, Image Sizes and Script Loading” lesson.
- Trust. Other trusted websites linking to yours, real reviews and a free business listing on Google Maps matter for local searches.
- Time. A new page can take days or weeks to appear in search results.
Real-Life Example: The Ganit Point Home Page
Here is a complete home page with everything from this lesson: a clear title and description, a canonical link, Open Graph tags, JSON-LD, semantic tags, one <h1>, logical headings, a described image and descriptive links. The head content does not appear in the result panel, but crawlers and apps read every line of it.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Maths Coaching for Class 9 to 12 in Malviya Nagar, Jaipur | Ganit Point</title>
<meta name="description" content="Small batches, weekly tests and doubt classes for CBSE and RBSE maths. Free demo class every Saturday in Malviya Nagar, Jaipur.">
<link rel="canonical" href="https://www.example.com/">
<meta property="og:title" content="Ganit Point: Maths Coaching in Jaipur">
<meta property="og:description" content="Free demo class every Saturday. New batches from 1 April.">
<meta property="og:image" content="https://www.example.com/images/ganit-point-classroom.jpg">
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "LocalBusiness",
"name": "Ganit Point Maths Classes",
"url": "https://www.example.com/",
"address": {
"@type": "PostalAddress",
"addressLocality": "Jaipur",
"addressRegion": "Rajasthan",
"addressCountry": "IN"
}
}
</script>
<style>
body { font-family: sans-serif; max-width: 680px; margin: 0 auto; padding: 16px; line-height: 1.6; }
nav a { margin-right: 12px; }
img { max-width: 100%; height: auto; border-radius: 8px; }
</style>
</head>
<body>
<header>
<nav>
<a href="#courses">Courses</a>
<a href="#timings">Batch timings</a>
<a href="#visit">How to reach us</a>
</nav>
</header>
<main>
<h1>Maths Coaching for Class 9 to 12 in Jaipur</h1>
<p>Ganit Point is a small coaching centre in Malviya Nagar run by two maths teachers with 12 years of school teaching experience.</p>
<img src="https://picsum.photos/id/20/680/300"
alt="Students working on maths problems in the Ganit Point classroom"
width="680" height="300">
<section id="courses">
<h2>Courses</h2>
<h3>Class 9 and 10 Foundation</h3>
<p>Full board syllabus, a chapter test every Sunday and monthly parent meetings.</p>
<h3>Class 11 and 12 Board Maths</h3>
<p>Calculus, vectors and probability, with past board papers solved in class.</p>
</section>
<section id="timings">
<h2>Batch Timings</h2>
<p>Morning batch: 7:00 to 8:30. Evening batch: 5:00 to 6:30. Maximum 15 students per batch.</p>
</section>
<section id="visit">
<h2>How to Reach Us</h2>
<p>Second floor, above the stationery shop, near the main market in Malviya Nagar.</p>
<p>Read our <a href="#">guide to choosing the right maths batch</a> before your demo class.</p>
</section>
</main>
<footer>
<p>Ganit Point Maths Classes, Jaipur. Open Monday to Saturday.</p>
</footer>
</body>
</html>
Try these changes:
- Add a “Results” section with an
<h2>and a short paragraph, and a link to it in the nav. - Rewrite the title for a different page, such as a Class 10 crash course page, keeping it under 60 characters.
- Add
"openingHours": "Mo-Sa 07:00-20:00"to the JSON-LD. Watch the commas.
Common Mistakes (and How to Fix Them)
- The same title on every page. Search engines cannot tell the pages apart. Fix: write a unique title and description for each page.
- Several
<h1>tags, or none. The main topic becomes unclear. Fix: one<h1>per page, then<h2>and<h3>. - Important text inside images. A banner image that says “Admissions open” cannot be read as text. Fix: write important words as real HTML text.
- Keyword stuffing. Repeating the same phrase again and again makes the page worse for people and search engines. Fix: write naturally for the parent who is reading.
- Broken JSON-LD. A missing comma or quote means the data is ignored. Fix: test it with a structured data testing tool.
Practice Task: Make a Tiffin Service Page Search-Friendly
An Indore tiffin service has a page that search engines cannot understand well. Improve it:
- A clear title under 60 characters and a helpful meta description
- One
<h1>and an<h2>, instead of the styled divs <header>,<main>and<footer>- Useful alt text, with width and height on the image
- Descriptive link text
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- TODO 1: Write a clear title (under 60 characters) -->
<title>Home</title>
<!-- TODO 2: Add a meta description -->
</head>
<body>
<!-- TODO 3: Use one h1, then h2 headings, inside header, main and footer -->
<div class="big">Annapurna Tiffin Service</div>
<div class="medium">Our Menu</div>
<p>Fresh home-style thali, delivered at lunch time in Indore.</p>
<!-- TODO 4: Fix the alt text -->
<img src="https://picsum.photos/id/292/400/220" alt="pic1">
<!-- TODO 5: Fix the link text -->
<p>For the weekly menu, <a href="#">click here</a>.</p>
</body>
</html>
Show one possible answer (try it yourself first!)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Home-Style Tiffin Service in Indore | Annapurna</title>
<meta name="description" content="Fresh vegetarian thali delivered to your office or hostel in Indore every weekday. Monthly plans and a free trial meal.">
</head>
<body>
<header>
<p><strong>Annapurna Tiffin Service</strong></p>
</header>
<main>
<h1>Home-Style Tiffin Service in Indore</h1>
<h2>Our Menu</h2>
<p>Fresh home-style thali, delivered at lunch time in Indore.</p>
<img src="https://picsum.photos/id/292/400/220"
alt="A vegetarian thali with dal, sabzi, rice and chapatis"
width="400" height="220">
<p>See the <a href="#">weekly tiffin menu with prices</a>.</p>
</main>
<footer>
<p>Annapurna Tiffin Service, Indore.</p>
</footer>
</body>
</html>
Key Takeaways
- Search engines read your HTML, not your design, so clear structure helps them understand the page.
- Write a unique, specific title and description for each page. People decide to click from these.
- Use one
<h1>, logical headings, semantic tags, descriptive link text, good alt text and clear file names. - A canonical link names the official address, and Open Graph tags create good WhatsApp previews.
- JSON-LD structured data states facts like your business address in a format machines understand.
- HTML is only the base. Useful content, speed, mobile friendliness and trust decide the ranking.