Optimization of the Title Tag

What is the title tag?

The title tag is a HTML element that should be placed in the head section of your webpage. It provides a short description of the page it is included on. The Internet of Bots offers a full tutorial about how to correctly implement this title tag, by which users and search engines can make the best use of this essential part of a website.


How is it used?

  1. The title tag should be placed within the <head> section.
  2. As a HTML element, the tag should be opened and closed: <title>Text</title>.
  3. Don´t use HTML elements, such as anchors <a>, paragraph marks <mark>, or highlighting <b> <i> <u> within the title tag.
  4. Make sure there is (only) one title tag per page.

<head>
<title>
Optimization of the title tag - The Internet of Bots</title>
</head>

Why is it important?

  • The title tag is used by search-engines to enlist your website.
  • Users will see your title tag displayed in the search engine results.
  • The title tag is displayed in the top / tabs of a browser window.
  • When your page is linked to in social media, the title tag is shown for all recipients.

What can I do to check if my title tag is good?

  1. Make sure every page of the site has a unique title tag
  2. Try to limit the tag from 50 up to 64 characters
  3. Have the tag give short a description of the page
  4. Have the name of your website / company included (many websites place the name behind the description)
  5. Make the title correspond to the description, keywords, H elements, and / or the text of the page
  6. Make sure the tag is defined correctly (see ´How is it used?´)

What is the exact position to place the tag?

This is a difficult question, since different developers have different opinions. The main thing is to place the title tag in (the top) of the <head> section. The Internet of Bots uses the following order as proposed bij Bootstrap 3:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Optimization of the title tag - The Internet of Bots</title>
[...]

Suggestions:

  • Search for something in Google. Every result starts with a blue line and these are the title tags of the various webpages.
  • Open a website and view its sourcecode. Here you can see how the website has defined its title tag.

External references:

  1. W3.org on title tags
  2. W3schools explaining the title tag
  3. Google on creating good title tags
  4. Google search for HTML title tag