• Register

In, this article we will learn how to add icon logo in html title bar before we start we should learn about title and logo/icon.in this article we will also discuss approach and code.


What is the title?

The HTML Title is an element of HTML which we define as this <title> and the <title> defines the title of the document that is shown in the browser’s title bar or we can say page’s tab.

What is Icon?

You may see that most of the websites have their own logo for their websites which we can see just on the left side of the title in the title bar or page’s tab.The logo which we can see in the form of images and icon.another name of logo is favicon. fevicons are  being good for the SEO of the websites. We use the link attribute to add the favicon.


Approach

For adding the icon in HTML we  have to code a syntax in the HTML code that syntax is

<link rel="icon" href="icon_path" type="image/icon type">
First, we have to save and generate icon file in our website and root directory or image under the name that is favicon then copy that tag which is already mentioned above and pass it by making no changes in between <head> opening and </head> closing tag.

Program

<!DOCTYPE html> 
<html> 
    <head> 
        <meta charset = "utf-8" /> 
          
        <title> 
            website icon 
        </title> 
          
        <!-- add icon link -->
        <link rel = "icon" href =  
"https://i.pinimg.com/originals/00/50/71/005071cbf1fdd17673607ecd7b7e88f6.png" 
        type = "image/x-icon"> 
          
    </head> 
      
    <body> 
        <h1 style = "color: blue;"> 
            website 
        </h1> 
          
        <p> 
            website icon added in the title bar <br> icon looks like this <br><img src="https://i.pinimg.com/originals/00/50/71/005071cbf1fdd17673607ecd7b7e88f6.png" height="150px" width="150px">
        </p> 
    </body> 
</html>

output

image

hope this will help.

More Posts

How to remove underline from hyperlink in html Prasandeep Gautam - Oct 22, 2020
How to reduce image size in HTML kunal verma - Oct 17, 2020
HTML code to send email with attachment kunal verma - Nov 1, 2020
Marquee tag in HTML for multiple images kunal verma - Oct 21, 2020
How to make a background image fit the screen in html Tania - Jul 16
Use of doctype in HTML kunal verma - Oct 26, 2020
Romove all HTML tags from string PHP kunal verma - Oct 28, 2020
How to embed youtube video wothout using iframe kunal verma - Oct 29, 2020
How to add a caption to a photo in HTML sakshi - May 28
How to add horizontal line in html amna - Oct 22, 2020