Create a favicon with Photoshop

Tommy

Moderator
Staff Member
Joined
Sep 28, 2012
Messages
189
Points
28
A few years ago, while surfing you will see a small icon beside the site name on the browser's URL bar, which is Favicon icon.
favico-0-tut.jpg
More and more and more important favicon, most large websites have favicon threads, and other popular browsers display the favicon support Url bar. webmastersun.com will guide you how to create a favicon for your website in photoshop.
favicon-show.jpg

- Favicon extension is. ICO, so to save this format, you have to download this plugin:
View attachment ICOFormat-1.6f9-win.zip
Unzip and copy the folder and install your photoshop (usually: C: \ Program Files \ Adobe \ Photoshop \ Plug-Ins \ File Formats)

- Create and design your logo, put on size 16 x 16 pixels, then save the file and name it favicon, ico format is (favicon.icon)

- Upload files to your web directory.

- Normally the browser will automatically recognize your favicon and display them. But some older browsers are not so smart, use the following code to call the favicon out:

<link type="image/x-icon" href='Duong icon"/> lead to file' rel="shortcut

fun with tips!
 
Last edited:

lennondevid

New member
Registered
Joined
Jul 18, 2012
Messages
5
Points
0
Well. I think Photoshop is an best image editor in today. It is used to make a picture more real and live. You can also edit photos,make layouts, and a bunch of other stuff very easily.
 

Noticed

New member
Registered
Joined
Aug 1, 2012
Messages
7
Points
0
I agree Lennondevid, Photoshop is an amazing piece of software, and thanks for the tutorial OP! :)
 

madelinekim

Member
Registered
Joined
Aug 8, 2012
Messages
26
Points
0
Great and useful tutorial. Photoshop provides a great option to create favicon which is useful to create customized banner. Using a photoshop its become so easy and simple to create a favicon.
 

michelsteedman

New member
Registered
Joined
Jun 25, 2013
Messages
14
Points
0
Photoshop is widely popular web design software to make dynamic and attractive web pages. It also provides the most convenient way to create a favicon.
 

ClearEyes

Member
Registered
Joined
Dec 21, 2013
Messages
23
Points
0
Working on a 16px x 16px image is very difficult, the best way to make a favicon is to make your image normally with Photoshop, save as either jpg (with background) or png (transparent background), make sure your file size is under 150kb and upload to here:

http://tools.dynamicdrive.com/favicon

This app will make you a nice 16 x 16 favicon in .ico format, you also have the option for bigger icons if you need them.

A word of advice though, don't make your favicons too detailed or busy - they need to be clear and recognizable.
Enjoy!
ClearEyes
 
Newer Threads
Latest Threads
Replies
1
Views
15
Replies
0
Views
170
Replies
1
Views
36
Replies
2
Views
80
Recommended Threads

Latest postsNew threads

Latest Hosting OffersNew Reviews

Sponsors

Tag Cloud

You are using an out of date browser. It may not display this or other websites correctly.
You should upgrade or use an alternative browser.

Top