How to make a favicon如何令favicon

Posted on April 10, 2008 at 5:10 am发布于2008年4月10日在上午05时10分

Looking for a way to create a FavIcon ?寻找出路，以创造一个favicon ？ If you browse the web regularly, you’ve probably noticed that a lot of sites have a small icon that appears in front of the website address in your browser or bookmarks.如果你浏览网页，定期，你可能看到很多网站有一个小图标会出现在面前，网址，在你的浏览器或书签。 Many websites use favicons (aka Favorite Icon) as a way to brand their website, so that when you see that icon, you automatically know which company or product it represents.许多网站都使用favicons （又名喜爱的图标） ，以此向品牌，在他们的网站上，所以当你看到图标，你会自动知道哪些公司或产品，它代表了。

For example, take a look at your address bar right now and you’ll notice that to the left of URL is a small icon that looks like a grid:举例来说，考虑一下你的地址栏正确的，现在，你会发现，向左边的网址是一个很小的图标，看上去像一个网格：

favicon

Also, if I look at my Firefox Bookmarks or IE Favorites, I also see the same favicons next to any websites that are using them:另外，如果我看看我的Firefox的书签或IE的收藏，我也看到了相同的favicons未来任何网站都是使用他们：

favicons

Using a FavIcon for your site is a good practice as it helps visitors to quickly identify your site among large numbers of bookmarks, etc. So how do you go about creating a FavIcon for your site?用favicon为你的站点是一个很好的做法，因为它有助于旅客，可迅速确定您的网站当中，大批书签等，所以你怎么去创造一个favicon为你的站点？

How to make a FavIcon如何令favicon

The first step in creating a FavIcon is to actually find a picture or create a graphic that you want to use as your icon.第一步，在创造一个favicon是真正找到一张图片，或者创建一个图形，你想用你的图标。 A FavIcon always has a 16×16 pixel dimension, so you should be very careful when choosing or creating your own picture. 1 favicon总会有一个16 × 16像素尺寸，所以你应该非常小心，当选择或创建自己的图片。

Try to find an icon or graphic that has very little going on with it in terms of design.试图找到一个图标或图形已很少正在同它在设计方面。 The simpler graphic you can find, the better your FavIcon will turn out.简单的图形，你可以发现，越是你的favicon会变成。 Also, make sure that the graphic is a square, so basically where the length and width are equal.同时，要确保图形是一个广场，因此，基本上那里的长度和宽度都是平等的。 If you have a portrait or landscape picture, it will be resized to 16×16 and therefore become either stretched or squished.如果你有一个人像或景观图片，将调整大小以16 × 16 ，并因此成为要么伸展或squished 。

You can also create your own image using Microsoft Paint or similar photo editing software.你也可以建立自己的形象，使用微软油漆或类似的图像编辑软件。 When you are done, make sure you save the file into GIF, JPG, PNG, or BMP format.当你做了，请务必将档案储存到的GIF ， JPG格式，巴纽，或BMP格式的格式。

Now that you have your image, go to现在你有你的形象，去 DynamicDrive dynamicdrive and let’s use their FavIcon generator to create our FavIcon from the picture.让我们用自己favicon发电机，以创造我们的favicon从图片。

Go ahead and browse to the location of your image file and then choose Create Icon .继续和浏览到该位置你的图像文件，然后选择创建图标 。

创造favicon

And really that’s it!真的就是这么简单！ You’ll now get a preview of how your FavIcon would look in an actual browser and you can either proceed to download the FavIcon or you can simply choose another image.您现在得到了预览您favicon会研究，在实际的浏览器，你可以进行下载favicon或者你可以简单地选择另一种形象。

使favicon

What I like about this site is that it also gives you instructions on how to install a FavIcon to your website, which is a little bit harder than actually creating the FavIcon itself.我喜欢这个站点是，它也给你的指示，对如何安装favicon到你的网站，这是一个有点难度比实际创造favicon本身。 Here’s what you need to do:这里的你需要做什么：

First, download the file and then upload the FavIcon, which by the way should be named “ FavIcon.ico ” to the ROOT directory of your site.首先，下载文件，然后上传favicon ，即由途径，应命名为" favicon.ico " ，以根目录你的站点。 It’s very important that the file be named favicon.ico and that it be located in the root directory on your web server.这是非常重要的是，该文件被命名为favicon.ico ，并把它设在根目录下你的web server 。 You can verify that you uploaded it correctly by typing您可以验证你上传正确的，由打字

http://mysite.com/favicon.ico http://mysite.com/favicon.ico

in the browser’s location, where “mysite.com” is your web site’s Internet address.在浏览器中的位置，在那里， " mysite.com "是你的网站的互联网地址。 Now you need to insert one line of code into the <HEAD> section of your web sites pages.现在你需要插入第一行代码到<head>节你的网站页面。 Note that this code has to be on every page that you want the FavIcon to appear for.注意，此代码要在每个页面上说，你想favicon出庭。 This is easy if you have a site that uses templates and pulls in header, footer, and other files individually.这是容易的，如果你有一个网站，利用模板，并拉起，在头，尾，及其他档案个别。

If all of your pages are static and you do not use templates or includes, you’ll have to manually edit the HTML in each page.如果您所有的页面都是静态的，你不使用模板或包含，你需要手工编辑的HTML中的每一页。 The line of code you’re going to want to add is as follows:该行代码，你要去想补充具体内容如下：

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

The icon may not show up immediately, so be patient.该图标可能不会显示出来，立即生效，所以忍耐。 Also, sometimes it doesn’t appear at all, especially with IE as there is a browser bug.此外，有时它似乎并不在所有国家，特别是与即有一个浏览器的bug 。

Hopefully with this short tutorial you have been able to create a FavIcon and get it up and working on your site.但愿这简短的教程，你已经能够创造一个favicon并使之得到了和工作对你的站点。 If you have any questions, feel free to post a comment!如果您有任何问题，随时张贴一条评论！ Enjoy!享受！

Technorati Tags: Technorati标记： , ， , ， , ， , ， , ，

If you enjoyed this post, make sure you 如果你喜欢这个职位，请务必 subscribe to my RSS feed 订阅我的RSS馈送 ! ！

» Filed Under »提起下 Computer Tips电脑窍门

Related Posts相关职位

Please post your comments/suggestions!请您评论/建议！