Best IT Recipes

HTML header image

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

Thanks for reading.

+35
html favicon
Jun 23 '10 at 16:20
source share
8 answers

You need favicon.ico file. Just put it at the root of your site and connect to it in the header of your page.

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

You have to put it at the root of your site and call it favicon.ico, because some browsers look for it, even if you don’t link to it on your pages.

+40
Jun 23 '10 at 16:24
source share

For compatibility with multiple browsers, favicon needs two lines:

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

+15
Jun 23 '10 at 17:48
source share

Add a line similar to it in the head-elements:

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

.ico files work best in older browsers, but of course you can use png and jpeg files.

+3
Jun 23 '10 at 16:24
source share

You want to set icons. Here is the tag for this:

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

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

+3
Jun 23 '10 at 16:24
source share

You will find additional information about the icon with answers to this question: Favicon does not appear, my icon does not fit

+2
Jun 23 '10 at 16:24
source share

How to add an icon to your website (W3C):
http://www.w3.org/2005/10/howto-favicon

and you can make any image an icon with online generators, for example:
http://tools.dynamicdrive.com/favicon/

+2
Jun 23 '10 at 17:43
source share

Also, from this previous answer you can find Dynamic Drive FavIcon Generator is very useful for creating favicon from GIF, JPG, PNG or BMP files.

+1
Jun 23 '10 at 18:16
source share

I just found the icon that I need online, right click and select "Copy Image URL"

 <head> <title>(title)</title> <link rel="shortcut icon" href="(image URL)"/> <head>
+1
Jul 04 '13 at 3:13
source share


More articles:


All Articles