How to define Head in HTML – HTML Kick


How to define Head in HTML?

Head elements are containers for elements that define a page?s style, metadata, and references to external resources like the Cascading Style Sheet (CSS) files with additional styling properties that you might want to apply to your webpages. Some of the tags that a developer might want to include in the head section of his document are <tittle>, <base>, <style>, <link>, <meta>, <script>, and <nonscript>.

Tittle Element:

Defines the tittle of a document. It is a mandatory requirement for all HTML documents. Some of its uses include, displaying a tittle in a browser?s tittle bar and task bar, provide a default label for bookmarked pages, and to provide a label for the page on a Search Engine Results Page (SERP). Typically, a good title should not be more than 65 characters long.

HTML5 Elements

Base Element:

Developers use the <base> element to assign a base URL for all relative links that are contained in a document. Once the base URL is set at the top of a document, subsequent pages will use it as a starting point for their URLs.

Link Element:

This tag is used to attach external documents including CSS files by pointing in their paths.

Style Element:

Used to specify embedded style information for HTML documents. Note that external style sheets are more efficient than embedded styles because they can be applied to several pages.

<!DOCTYPE html>
  <title>Page Title</title>

<p>The content of the body element is displayed in the browser window.</p>
<p>The content of the title element is displayed in the browser tab, in favorites and in search engine results.</p>


Meta In HEAD

<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="John Doe">

Define the character set used:

<meta charset="UTF-8">

Define a description of your web page:

<meta name="description" content="Free HTML Web tutorials">

Define keywords for search engines:

<meta name="keywords" content="HTML, CSS, XML, JavaScript">

Define the author of a page:

<meta name="author" content="John Doe">

Refresh document every 30 seconds:

<meta http-equiv="refresh" content="30">

viewport in HTML5

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

Add Analytics in Head Section

<script async src=""></script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-141260284-1');

Google Analytics is provided by Google. Google Analytics is not a product of Pair Networks, Inc., and Pair Networks provides no warranty for Google Analytics.

Please note that there are many levels of website analytics products available. Please consult with your IT professional for advice and guidance on an appropriate analytic tracker. This specific product may or may not meet your needs. Pair Networks, Inc. is providing support for this analytics tracker for your convenience and is not responsible for Google Analytics’ performance.

Please read carefully the terms and scope of services for any online service or product you are considering purchasing or using.

Add Analytics in Head Section

<script data-ad-client="ca-pub-6130383729373611" async src=""></script>


Terry White

Terry White is a professional Drupal & WordPress developer, Web developer, Web designer, Software Engineer, and Blogger. He strives for pixel-perfect design, clean robust code, and a user-friendly interface. If you have a project in mind and like his work, feel free to contact him

View all posts by Terry White →