Creating your own Favicon in Photoshop

The Favicon is the little icon that appears next to a website address in the website address bar –up there at the top of your browser. It is literally a tiny little image that’s dropped into the html folder of your website,or if you want to be neater,an image subfolder. The code at the back end of your site,between the “head”and “/head”tags will have the following:

<link rel="shortcut icon" href="/path/to/your/favicon.ico" />

where /path/to/your/favicon.ico is a real set of folders. In many cases you won’t need that part anyway,just the favicon.ico.

The Apple website favicon

The Apple website favicon

It’s a neat idea,that’s supported by all the browsers and goes a little way to making your website look a little more “professional”

There are several sites where you can create your own and even upload your images.

A couple of online generators are:

The problem with these is that they’re a little hit-and-miss with the resolutuon (that is,they look blocky when you do it).

If you’ve got Photoshop,then you can create better favicons,with a little help from the open source community.

Here’s instructions on how to create favicons in Photoshop,at Photoshop support

Here is where you download and instructions to install the Photoshop ico file format plugin at telegraphics

The story here is ultimately when you’re dealing with graphics,design big,then make it smaller! The higher the DPI (Dots Per Inch) the better!

Leave a Reply

  

  

  

You can use these HTML tags

<a href=""title=""><abbr title=""><acronym title=""><b><blockquote cite=""><cite><code><del datetime=""><em><i><q cite=""><strike><strong>