Codeskill

Learn to code, step by step

SEO Fundamentals

Optimising HTML for search engines

SEO fundamentals for HTML matters once your pages get past the basics. The markup choices that help search engines understand your pages and show them to the right people. Good SEO starts in your HTML structure, not just in keywords sprinkled through the text.

What SEO means for web development

SEO (Search Engine Optimisation) is about improving your site’s visibility in search results. That means understanding what people search for, the words they use, and the kind of content they want – then structuring your HTML so search engines can match your pages to those queries.

Why SEO matters

  • Increased visibility: Well-optimised sites get more traffic.
  • Credibility and trust: Higher rankings often confer a perception of credibility.
  • User experience: SEO is not just for search engines – it pushes you towards clearer, better-structured pages.

Key SEO principles for HTML

1. Title tags

The <title> tag, inside <head>, is one of the most important elements for SEO. It appears in search results and browser tabs.

Best practices for title tags
  • Concise and descriptive: Keep it under 60 characters and make sure it describes the page content accurately.
  • Unique titles for each page: Every page on your site should have its own title.
Example
<head>
    <title>Beginner's Guide to Gardening - GreenThumb</title>
</head>

2. Meta descriptions

Meta descriptions summarise your page content. They are not a direct ranking factor, but they do affect click-through rates from search results.

Best practices for meta descriptions
  • Descriptive and relevant: Around 155 characters that summarise the page clearly.
  • Include keywords: Work in terms people might actually search for, naturally.
Example
<head>
    <meta name="description" content="Explore our beginner's guide to gardening, covering essential tips and tools for first-time gardeners.">
</head>

3. Header tags

Header tags (<h1> through <h6>) structure your content and help search engines understand the hierarchy of information on the page.

Best practices for header tags
  • One <h1> per page: Use it for the main title.
  • Descriptive subheaders: Use <h2>, <h3>, and so on for subsections, with relevant keywords where they fit naturally.
Example
<h1>Essential Gardening Tools for Beginners</h1>
<h2>Hand Tools</h2>
<h3>Garden Fork</h3>

4. Image optimisation

Images help engagement, and they can contribute to SEO too – if you set them up properly.

Best practices for images
  • Descriptive alt text: Helps search engines understand what the image shows.
  • Optimised file sizes: Smaller files load faster, which search engines prefer.
  • Relevant file names: Descriptive file names help in image search.
Example
<img src="garden-fork.jpg" alt="Stainless steel garden fork">

5. Semantic HTML

Semantic elements like <article>, <nav>, <footer>, and <section> help search engines understand how your content is organised.

Example
<article>
    <section>
        <h2>Gardening Basics</h2>
        <!-- Content -->
    </section>
</article>

6. URLs and link building

Clear URLs and a sensible network of internal and external links both help SEO.

Best practices for URLs and links
  • Clear and descriptive URLs: Easy to read, with relevant keywords where appropriate.
  • Internal linking: Link to other pages on your site where it makes sense.
  • Quality external links: Linking to reputable sources can add credibility.
Example
<a href="/blog/gardening-basics">Read more about gardening basics</a>

Beyond HTML: technical and content SEO

HTML is only part of the picture. These factors matter too:

  • Mobile responsiveness: A mobile-friendly site is essential for good SEO.
  • Site speed: Faster sites rank better and keep visitors happier.
  • High-quality content: Useful, original content is what people (and search engines) actually want.

SEO is ongoing

SEO is not something you set up once and forget. Search engines update their algorithms, your content changes, and competitors move. Keep reviewing your pages, fixing problems, and improving structure over time.

Get the HTML basics right – titles, headings, alt text, semantic structure, sensible links – and you have a solid foundation. The rest is content quality and keeping your site in good technical shape.

PreviousHTML5