51

I want to have an image on the title in an HTML page (i.e on the tab along with the title). How can I do that?

Harsh Patel
  • 6,334
  • 10
  • 40
  • 73
James
  • 13,891
  • 26
  • 68
  • 93
  • 2
    You mean like this?: http://en.wikipedia.org/wiki/Favicon – David Jun 23 '10 at 16:24
  • Possible duplicate of [Adding a favicon to a static HTML page](http://stackoverflow.com/questions/9943771/adding-a-favicon-to-a-static-html-page) – TylerH Aug 17 '16 at 16:25
  • 1
    You'll find more information about favicon with the answers to this question: https://stackoverflow.com/questions/2912708/favicon-not-showing-my-icon-is-no-good – FelipeAls Jun 23 '10 at 16:24

4 Answers4

54

What you need is a favicon.ico file. Just put it in the root of your site and link to it in the header of your page

<head>
    <title>My Site</title>
    <link rel="shortcut icon" href="favicon.ico" />
</head>

You should put it in the root of your site and name it favicon.ico because some browsers look for it even if you don't link to it on your pages.

Ed B
  • 6,028
  • 3
  • 26
  • 35
24

For cross browser compatibility, seems to be needed two lines for for favicon:

TITLE

<title>PAGE TITLE HERE</title>

FAVICON

<link rel="SHORTCUT ICON" href="http://domain and path/favicon.ico" />
<link rel="icon" href="http://domain and path/favicon.ico" type="image/ico" />

FAVICON GENERATOR:

DYNAMIC DRIVE

Beryllium
  • 12,808
  • 10
  • 56
  • 86
Zuul
  • 16,217
  • 6
  • 61
  • 88
5

Please add a line similar to this within the head-elements:

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

.ico files work best among old browser, but of course you can use png and jpeg files, too.

Hendrik Brummermann
  • 8,242
  • 3
  • 31
  • 55
4

You are wanting to set a favicon. Here is the tag to do that:

<link rel="SHORTCUT ICON" href="favicon.ico" />

Add this tag to your <head /> and it will instruct browsers of the site to download the image referenced in the href.

JD Courtoy
  • 2,855
  • 25
  • 27