Test
Test
Posts List
  1. Favicon: Favorites Icon
    1. FAVICON is the abbreviation of FAVorites ICON.
  2. Preparation: What do you need?
  3. Steps: What to do?
    1. Make an image you like
    2. Convert the original image to 16 * 16 sized icon
    3. Add couple of codes into your web source code

favicon.ico

Favicon: Favorites Icon

FAVICON is the abbreviation of FAVorites ICON.

Favicon is not only a simple logo shown in your favorites and address bar, but also represents the culture background of a company or a personal blog.

Here are some sample Favicons of Github:
Github Favicon 1
Github Favicon 2
Github Favicon 3
Github Favicon 4
Github Favicon 5
Github Favicon 6
Github Favicon 7
Github Favicon 8

As a “COQUETTISH“ (SAO QI) technical blog with the massive culture background, I have to make a favicon for my blog. Why don’t you?

Preparation: What do you need?

  • Firstly, you need a blog or no matter what kind of personal web site;

  • Secondly, you need a computer and internet access to do the rest of things;

  • Thirdly, bring your brain and follow the following steps.

Steps: What to do?

Make an image you like

PhotoShop, Paint, Meitu Xiuxiu or just simply select and copy any of images you like

For example, you may get an original image like this: Original Image

* Comment: please remember the image should be 1 : 1 sized square

Convert the original image to 16 * 16 sized icon

You can use ICO Converter or some other tools to do so.

Now you may get an icon like this: Converted Icon

Then, just simply copy this “favicon.ico“ which represent your culture into the web site root.

Add couple of codes into your web source code

It is quite easy:

1
<link rel=”icon” href=”/favicon.ico” mce_href=”/favicon.ico” type=”image/x-icon”>

Please do not ask me where to paste it.

Fine, paste between the into your head please.

Well done! Refresh your web and enjoy it.

Test
Thanks for testing~
  • Wechat Scan
  • Alipay Scan