Course Content
About Lesson

A favicon (short for “favorite icon”) in HTML is a small icon associated with a website or web page. It is displayed in various places, such as the browser’s address bar, tabs, bookmarks, and in the browser’s history.

  • Tag:
    1. <link> – The <link> tag in HTML is used to define relationships between the current document and external resources. It is commonly used in the <head> section of an HTML document.
  • Attributes:
    1. rel – The “rel” attribute in HTML (Hypertext Markup Language) is used to define the relationship between the current document and the linked document. It is commonly used within the anchor (<a>) element to specify the relationship of the linked resource. The “rel” attribute helps browsers and other user agents understand the nature of the link.
      • rel=”icon” or rel=”shortcut icon”: Specifies the icon that represents the web page in the browser tab or bookmark.
    2. type – The type attribute is used to indicate the type of the linked resource. For a favicon, the type attribute is typically set to “image/x-icon” or “image/png” to specify the file format of the favicon.
    3. href – The href attribute in the HTML <link> tag is used to specify the location of the resource being linked to. In the context of the HTML favicon, the href attribute is used to indicate the path to the favicon file, which is a small icon that represents a website and is typically displayed in the browser’s address bar, tabs, and bookmarks.

<link rel="icon" type="image/png" href="path-to-favicon">

HTML
<!DOCTYPE html>
<html>
  <head>
      <title>HTML Favicon</title>
      <link rel="icon" type="image/png" href="R.png"/>
  </head>
  <body>
    <h1>HTML Favicon</h1>
  </body>
</html>