HTML Header 



Element

Description

HTML title

use in header

<title>

It defines a title to display in the browser title bar and to use as a title while bookmarking the page. 

Ex:

<!doctype html>

<html lang="en-in">

    <head>

        <title>Amazon Shopping</title>

    </head>

</html>

HTML link

use in header

<link>

It is used to link any external file to your web page. It can be a stylesheet, shortcut icon etc.

 

Rules for defining a favicon:

  • Make sure that icon extension is ".ico" 
  • Make sure that icon has a size between 16 x 16 pixels.

and 32 x 32 pixels.

  • You have to define the path using "href".
  • You have to define the relationship by using "rel".

Create a Favicon and Link to Page:

  • Create a new folder in your project by name "icons"
  • Add a new file into icons folder by name "favicon.ico"
  • Right Click on "icons" folder and open in file explorer.
  • Right Click on "favicon.ico" and open with MSPaint.
  • Set page size between 16 x 16 to 32 x 32.
  • Draw an icon.
  • Save the icon.
  • Go to your HTML page "index.html" and link the file.

 

<!doctype html>

<html lang="en-in">

    <head>

        <title>Amazon Shopping</title>

        <link rel="shortcut icon" href="icons/favicon.ico">

    </head>

</html>

HTML script

use in header

<script>

It is an HTML element used to embed client-side and server-side scripts. JavaScript, jQuery, Angular JS, Node.js, ASP.NET etc. 

Ex:

  <script type="text/javascript">

  </script>


  <script runat="server">

  </script>

HTML style

use in header

<style>

It is an HTML element used to embed styles into the page.

Style will make the page more attractive, responsive. 


Ex:

<style type="text/css">

</style>

HTML meta

use in header

<meta> 
  • Meta stands for "Meta Data".
  • It is information about your page given to browser and SEO. [Search Engine Optimization]
  • Meta is required to make the page more browser friendly and SEO friendly.
  • Meta is defined by using <meta> element