SEO into the bigger picture

There are thousands of websites on the internet and while I am writing this hundreds of new websites are getting created. In a pool of thousands of websites, it is very easy for search engines to skip your website. This is where we actually realize the importance of SEO.

SEO stands for “Search Engine Optimization”. It is undoubtedly one of the best ways of gaining visibility and having a strong web presence by boosting a site’s rank in SERP(Search Engine Result Pages). There was a time when good content with enough text, keywords and placement of internal and external links would do the job. In that era, if you wanted to outrank a website that uses a keyword 10 times you’d use the same keywords 20 times but those days are long gone.

In a world where people hardly visit second page of search engines – SEO becomes even more critical. A good SEO practice improves user experience(it is evident that the users will not even visit websites that do not appear on the top 5 in a SERP, ever experienced?). So, it becomes really important for businesses to use all the weapons for SEO. One of those weapons is HTML5.

The real power of HTML5

There are a lot of sites which may not be semantically coded due to which search engines do not recognize them and hence users find it difficult to visit such sites.

This is where HTML5 plays a vital role. HTML5(Semantic HTML) is better know for its semantics.It refers to syntax that makes HTML more structured.A well structured data always finds its value in SERP. When it comes to reaching your target audience, the way your website communicates with search engines becomes very crucial.

Getting the most out of HTML and HTML5

HTML tags are hidden keywords that makes a page’s content more informative to the search engines.With the launch of HTML5 , several new semantic tags were introduced, thus prioritizing our content in a more effective manner.This has helped improve web page segmentation.

HTML5 Flow Chart
HTML5 Flow Chart 

A non-semantic HTML page would look like this:

On the other hand,semantic HTML page would look like this:

The clear difference in both the pages is the use of HTML tags. Lets have a closer look at the tags that existed earlier as well as the new HTML5 tags that will help in SEO ranking.

Tags under <head> section :

  1. The Title tag– It offers a preview about our content. A unique and descriptive title always catches the user’s attention.

    <title>Your fantastic title</title>

    SEO Importance-Title appears in SERP and this is where user makes a choice of clicking it(when you have millions of tabs open on your browser,isn’t it useful?).Its visibility is also seen when pages are shared. One should optimize the title by keeping a check on its length and keywords used.

  2. The Meta description tag– Its a snippet that gets displayed after the site’s title and URL.

    <meta name="description" content="Your outstanding description">

    SEO Importance– It will not add to boost up your page ranking but will definitely allow searchers to match their query results with the subject on SERP. One best practice to make snippets more appealing is by adding customer ratings,related images,some additional product info etc.


  3. The Canonical tag – It is used to prioritize a page when many duplicates are present.

    <link href="URL" rel="canonical">

    SEO Importance– When search engines try to rank a page, it becomes really important to specify search engines which page has higher importance among similar ones and also that the content is original.It also helps prevent cannibalization.

Tags under <body> section :

  1. The Heading tag– Header tags(h1 to h6) helps structure the page.

    <h1>Heading 1</h1>

    SEO Importance-It helps level each section according to its importance.A level-structured page offers users with better visibility, readability and quicker accessibility.<h1>(much bigger and noticeable) denotes the page title and subsequently other tags denote subheadings.One should tactically use this tag instead of overusing it.

  2. <main>tag – This new HTML5 tag encapsulates the most dominant content in the page.It may include <article> content and other supporting <section> content.

    	<h2>Web Browsers</h2>
    	<p>Chrome, Firefox, and Edge are the most used browsers today.</p>
    		<h3>Google Chrome</h3>
    		<p>Chrome is a free, open-source web browser developed by Google, released in 2008.</p>

    SEO Importance– Main content inside a page is always appreciated over other content and thus search engines always finds its way to go through the main content and give it importance over other content in the same page.

  3. <article> tag– This new HTML5 tag represents a self-contained block which is reusable.It can have many <section> tags inside it.

    <article class="forecast">
    	<h1>Weather forecast for Seattle</h1>
    	<article class="day-forecast">
    		<h2>03 March 2018</h2>
    	<article class="day-forecast">
    		<h2>05 March 2018</h2>
    		<p>Heavy rain.</p>

    SEO Importance– As it describes the main content on the page, search engines put more emphasis on the content that is present inside it.

  4. <section> tag – This new HTML5 tag represents logically grouped content.

    	<h2>03 March 2018</h2>

    SEO Importance– A well structured and segmented flow of information gives search engines a clear picture of logical relation between different sections.

  5. <header> tag – This new HTML5 tag defines the header of a document or a section.

    	<img src="img.jpg" alt="logo" />
    		<a href="about.html">About Us</a>
    		<a href="contact.html">Contact Us</a>
    &nbsp; &nbsp; </nav>

    SEO Importance– With this tag,the search engines know where the navigation links,logos or site names would be present.

  6. <footer> tag – This new HTML5 tag defines the header of a document or a section.

    	<p>Posted by: Mary Smith</p>
    &nbsp; &nbsp; <p>Contact information: <a href="mailto:someone@example.com">someone@example.com</a>.</p>

    SEO Importance- It contains information regarding copyright,licensing,terms of use,social media links,privacy policy,contact us etc.This is something which the user would not find on the main menu. So how one revolves around useful resources in the footer will determine user experience.The more one promotes their past or upcoming events,the more audience gets attracted.

  7. <nav> tag – – This new HTML5 tag provides navigation inside the main site.

    	<a href="about.html">About Us</a>
    	<a href="contact.html">Contact Us</a>

    SEO Importance-Connected pages with smooth navigation provides users with greater search visibility. Search engines can thus crawl to destination pages with the better understanding of the content and context of the landing pages.

  8. <aside> tag– This new HTML5 tag is not important for understanding the pages’s content but it contains some relatable information. For example advertisements,viewers of the page, author information etc.

    	<p>Viewed by 200 people</p>
    	<p>Author: Mary Smith, Software Developer at Google</p>

    SEO Importance– The <aside> can stand on its own.It makes easier for search engines to fetch data based on author,number of viewers etc. It thus enclosed data relating to the entire page and not just to a particular section.

  9. <figure> tag– This new HTML5 tag is an independent block(does not affect the main flow of page) which contains images, illustrations etc. <figcaption> is used to give an appropriate caption to the image.

    &nbsp; &nbsp; <img src="flower.jpg" alt="flower" >
    &nbsp; &nbsp; <figcaption>Fig.1 - Lotus Flower</figcaption>

    SEO Importance- SEOs take image and video content and convert into its corresponding text for easier understanding.Earlier “alt” attribute was used for the purpose. With this new HTML5 tag, it gave a much clear picture of what the image is all about.


There is nothing as pleasing as being on the top in a SERP , be it any kind of business. It takes a lot of effort and sound time to achieve the goal and accomplishing this requires the use of correct HTML tags.

<div> is not everything. There’s almost always a semantically sound tag to make our code more descriptive. This world deserves better code. The bubble of web is huge and to get the maximum out of your website make sure you use HTML5 to its fullest.

HTML5 thus provides easy algorithms for SEOs and the better the life of search engines, the better it will be. Such efforts put into improving user experience and helping search engines categorize the material , not immediately but will definitely pay off in the long run.

Hope that you will  find the blog content useful !

About The Author