how to add an image to the website's title in html

Question

<head>
  <title><!--i want to add a picture into the title--></title>
</head>

plz help me guys I'm creating a website only using html. I want to know how to add a picture into the title which is shown in the browser

A title tag is an HTML element that specifies the title of a web page. That is used to briefly and accurately describes the topic and theme of an online document. Having images in this tag isn't possible, however adding an icon is possible. As seen in stackoverflows title. — Zaedian, Mar 14 '18 at 15:35
Possible duplicate of [Add image in title bar](https://stackoverflow.com/questions/15786937/add-image-in-title-bar) — Zaedian, Mar 14 '18 at 15:36
Possible duplicate of [How to add an Image in the title bar?](https://stackoverflow.com/questions/11642552/how-to-add-an-image-in-the-title-bar) — rahulaga-msft, Mar 14 '18 at 16:48
Possible duplicate of [Creating a favicon](https://stackoverflow.com/questions/1547150/creating-a-favicon) — Pavindu, Mar 03 '19 at 17:34

score 0 · Answer 1 · answered Mar 14 '18 at 15:36

0

Title is used to display the page title as text.

You should use the balise below to display an icon named logo.png for example:

<link rel="icon" type="image/png" href="logo.png" />

answered Mar 14 '18 at 15:36

Nicolas Cami

score 0 · Answer 2 · answered Mar 14 '18 at 15:37

0

You actually need to add a favicon to a website.

<link rel="icon">
Simply add the following code to the <head> element:

<link rel="icon" href="http://example.com/favicon.png">

answered Mar 14 '18 at 15:37

devedv

score 0 · Answer 3 · answered Mar 14 '18 at 15:42

What you're looking to add is actually a called a favicon. It is a tiny image you'd like to add next to the title of your website.

Some things to consider (taken from the article)

The most common sizes for favicons are:

You can use a favicon generator to turn your image into the proper format and download it.

Insert the following code into your head after downloading your favicons and placing them in the directory of your html website.

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

score 0 · Answer 4 · answered Mar 14 '18 at 15:51

0

Make sure you use an icon file with sizes as mentioned by @Joshua. Insert the following code.

<link rel="icon" href="....logo.ico?v=2" />

You will need to add ?v=2 query string to force a refresh. Otherwise you might have cache issues.

answered Mar 14 '18 at 15:51

Navneet Pisharodi

4 Answers4