♥ Tutorials - Personalise your Favicon ♥
Favicon..
is an abbreviation for Favourite Icon, commonly known also as page icon. An example is the rabbit icon displayed beside the url of my site (i.e. http://www.a-spirate.com/) at the address bar of your browser.
Tools required..
- Adobe Photoshop
This guide is written for adobe photoshop users. Alternatively, you can still follow my guide using any other graphics software that enables you to save your file as *.ico.)
Before you start..
- Make sure that your adobe photoshop has the "ico format" plugin which will enable you to save your image as *.ico format.
- You can download the plugin here. Download the one that is compatible with your system.
- Install the plugin by placing the downloaded file (i.e. ICOformat) into YOUR_PHOTOSHOP_FOLDER\Plug-Ins\File Formats.
- Open your Adobe Photoshop to start making your favicon. Your adobe photoshop should now be able to save images in *.ico formats.
Making your personalised favicon
- Create a new document in Adobe Photoshop with the size of 16px x 16px, and name it as favicon.ico. Any discrepancy will result in an image distortion.
- Pixel your design onto the document.
- Upload your favicon.ico to the root directory, i.e. http://yourdomain/ or http://yourhost/yourdomain, of your server where your index page lies.
Adding the html codes
Copy and paste following the code in between <head> and </head>
Back to the tutorials page
|