On-page SEO is the practice of optimizing individual web pages in order to rank higher and earn
more relevant traffic in search engines. On-page refers to both the content and HTML source code
of a page that can be optimized, as opposed to off-page SEO which refers to links and other external
We are talking about creating an html page.
We know, there are 3 sections.
Head, Body & Footer
Head section is like a mind which users can’t see. It contains tags like
Title tag, Meta description, Meta keyword, Meta keyword, Meta author tag, Canonical tag &
Body section consists of Heading tag, Anchor tag & Alt tag.
Whatever image, text or videos we’re posting on our site, it has to be converted to html. So
that the crawler can understand.
Crawler plays a vital role as it is of google. Google has max. Traffic and gives information
on the basis of keyword. At the end, making your website is very important.
For ranking, crawler has to read your website.
Crawler sees the full information but if you haven’t put some tags, it will be able to read half
It means that if we provide only partial information, google will show only partial
information to the user. You will not be able to get proper relevancy score. So it is necessary
to give the whole information in terms of image, text, tags and everything which you’re
mentioning on your webpage right now.
We can do that by giving to every text, image and videos. As a result crawler will be able to
read the same and will save the same in its database.
User comes and searches, google will provide the information on the basis of keyword.
Unless and until we do not put tags in our source page, it will not be reflected on the
We follow the guidelines set by google.
Head (Invisible) – Will not reflect on website.
Body (Visible) – Will reflect on website.
Footer (Visible + Stagnant) – Will reflect on website and will be same on every page.
Meta description tag
Meta keyword tag
Meta author tag
Purpose of putting all these tags on the website is to educate the crawler in order to achieve
Tags in the body part defines the content of webpage.
Tags in the head section defines relevancy with webpage.
Therefore whatever content you’re putting in the body part, it should be relevant to the tags
in the head section.
Eventually it defines your relevancy score.
Creation of sample pages via WordPress.
Text – Coding
Visual – Reflection of the coding
WordPress is a CMS (Content Management System)
Whatever content you put in the visual column, it will automatically be converted into html
and will be seen in the text section.
We do not have to write extra coding
With the help of tools & settings we can write the coding. These options are for those who
do not know html.
Author tag to be used on when you write a blog. Else, no need for that.
In wordpress, we work on body section.
To work in head section, we use a plug-in named SEO Yoast.
HTML Coding for tags
Title tag: <title>HTML Elements Reference</title>
Meta description tag: <meta name=”description” content=”Free Web tutorials”>
Meta author tag: <meta name=”author” content=”John Doe”>
Canonical tag: <link rel=“canonical” href=“https://example.com/sample-page/” />
Robots tag: <meta name=”robots” content=”noindex” />
Heading tag: <h1>Heading 1</h1>
Alt tag: <img src=”img_girl.jpg” alt=”Girl in a jacket” width=”500″ height=”600″>
Anchor tag: <img src=”img_girl.jpg” alt=”Girl in a jacket” width=”500″ height=”600″>
A title tag is an HTML element that specifies the title of a web page. Title tags are displayed on
search engine results pages (SERPs) as the clickable headline for a given result, and are important
for usability, SEO, and social sharing.
A title should accurately describe the page’s content.
Create unique title for each page. So that, the google gets to know how the page is distinct
from other pages.
Use brief but descriptive title i.e. short & informative. If the title is too long, google will
show only a part of it.
Title should be of 50 – 60 characters or 600 pixels.
Do not use title that does not have any relevancy with the page.
Do use title for every page.
Do not use extremely lengthy title that is not helpful to users.
Do not do keyword stuffing.
Formula for title tag
1. Primary keyword | Secondary keyword | Company name
2. Company name | Primary keyword | Secondary keyword
3. Closer the keywords, better it is – Company name
The meta description is an HTML attribute that provides a brief summary of a web page. Search
engines such as Google often display the meta description in search results, which can influence
Description tag is also know as snippet.
• Crawler reads the description tag.
• Length of meta description tag should be of 120 – 158 characters or up to 920 pixels.
• Description should accurately summarize the page content.
• It should be informative and of user interest.
• We should avoid no relation description tag.
• Avoid keyword stuffing.
• It should be meaningful.
• Don’t use generic words like page 1, page 2 instead of proper description.
• Each page should have their own description.
• Same description for all pages should be avoided.
• If description tag is not given, google will automatically create one. It can be right or wrong.
Meta keywords are types of meta tags in the HTML source code of a webpage. They describe the
content of a website shortly and concisely, and are therefore important indicators of a website’s
content to search engines.
Keyword tags are those tags which tells the crawler about the targeted keywords i.e. on what
keyword your content is all about and on which keyword you wanted ranking.
We have to put all our primary and secondary keywords in the keyword tag.
When we write content on our website, we should consider all those keywords which we
have mentioned in our keyword tag. Based on which our relevancy score will be calculated.
Also, on the basis of our keyword tag we have to make our title and description tag.
This tag is used to name the author of the page. It’s just not necessary on the page.
A canonical tag (aka “rel canonical”) is a way of telling search engines that a specific URL
represents the master copy of a page. Using the canonical tag prevents problems caused by identical
or “duplicate” content appearing on multiple URLs.
Canonical tag comes under head section because it does not effect our page relevancy. It’s
only to give information to google.
We compare canonical with URL. It means that the URL which we put on our source page,
that reflects on SERP.
In other words we can say that google fetches our URL information from our canonical tag.
If we do not use this tag, then also will be able to create our website but will fail to create an
SEO friendly website.
So, google will still be able to read it which means the canonical tag has nothing to do with
the structure of the website.
It’s main work is to provide information to google about the right version of URL.
For eg. We have different URLs such as hhtp://www.xyz.com & http://xyz.com. We know
that our website can be opened with both the URLs but google will take it as two different
entities and saves both in its database as URLs of two different websites despite of the fact
that both the URLs are redirected on one hosting.
Therefore, there can be copyright issues which will result in dipping in authority and will
impact the ranking of the website.
If we have provided the wrong version of URL in our canonical tag, there is one coding we
can use to correct it ie.e 301 redirection.
The 301 status code means that a page has permanently moved to a new location. 301
redirects are particularly useful in the following circumstances: You’ve moved your site to a
new domain, and you want to make the transition as seamless as possible. People access
your site through several different URLs.
We put 301 redirection in htaccess.html file. It is a protocol file. Protocols refers to set of
Htaccess file will us the location to where our URL is being redirected.
To see the htaccess file, download a plug-in named SEO Yoast. Click on tools. Click on file
editor. We’ll be able to see the htaccess file.
Whatever coding we use on our source page, that is to give information to google whereas
through htaccess file we give redirection to the crawler so that the user can be redirected to
the right location.
As a digital marketer, we should be able to recognize the tags and their work. However to
put redirection coding, we’ll take help of our web developers as they have better
understanding of the coding languages.
In redirection coding, we give the different versions of our URL along with the version we
want our users to be redirected.
Crawler enters our website through this htaccess file only. It serves as a door or entrance to
Different pages of our website will have different URLs.
Now, there is 302 redirection as well which is used for temporary redirection from one URL
When we use 301 redirection, google will automatically removes the authority of the old
URL. Whereas, in 302 redirection google knows that this is temporary and the authority of
the old URL remains the same.
Meta robots tag is a tag that tells search engines what to follow and what not to follow. It is a piece
of code in the <head> section of your webpage. It’s a simple code that gives you the power to
decide about what pages you want to hide from search engine crawlers and what pages you want
them to index and look at.
The robots exclusion standard, also known as the robots exclusion protocol or simply robots.txt, is a
standard used by websites to communicate with web crawlers and other web robots. The standard
specifies how to inform the web robot about which areas of the website should not be processed or
The Sitemaps protocol allows a webmaster to inform search engines about URLs on a website that
are available for crawling. A Sitemap is an XML file that lists the URLs for a site.
An HTML sitemap allows site visitors to easily navigate a website. It is a bulleted outline text
version of the site navigation. This Sitemap can also be created in XML format and submitted to
search engines so they can crawl the website in a more effective manner.
Schema.org (often called Schema) is a semantic vocabulary of tags (or microdata) that you can add to your
HTML to improve the way search engines read and represent your page in SERPs. Schema markup, found at
Schema.org, is a form of microdata. Once added to a webpage, schema markup creates an enhanced
description (commonly known as a rich snippet), which appears in search results.
Top search engines – including Google, Yahoo, Bing, and Yandex – first started collaborating to create
Schema.org, back in 2011.
Schema markup is especially important in the age of Hummingbird and RankBrain. How a search engine
interprets the context of a query will determine the quality of a search result.
Schema can provide context to an otherwise ambiguous webpage.
“Most webmasters are familiar with HTML tags on their pages. Usually, HTML tags tell the browser how
to display the information included in the tag. For example, <h1>Avatar</h1> tells the browser to display the
text string “Avatar” in a heading 1 format. However, the HTML tag doesn’t give any information about
what that text string means—“Avatar” could refer to the hugely successful 3D movie, or it could refer to a
type of profile picture—and this can make it more difficult for search engines to intelligently display relevant
content to a user.”
What is Schema.org Structured Data?
Schema.org is the result of collaboration between Google, Bing, Yandex, and Yahoo! to help you provide the
information their search engines need to understand your content and provide the best search results possible at
this time. Adding Schema markup to your HTML improves the way your page displays in SERPs by enhancing
the rich snippets that are displayed beneath the page title.
Does Schema Improve Your Search Rankings?
There is no evidence that microdata has a direct effect on organic search rankings.
Nonetheless, rich snippets do make your webpages appear more prominently in SERPs. This improved
visibility has been shown to improve click-through rates.
According to a study by acmqueue, less than one-third of Google’s search results include a rich snippet with
Schema.org markup. This exposes a huge opportunity for the rest.
Very few things in SEO, today, can move the dial quickly. This can.