centraliser-iconnotsurefacemuch-circlespencil
February 9, 2016

Using a favicon

Have you noticed the “Upload a favicon” button under the appearance tab of your Didacte school? It’s an optional step that adds a personal touch to your website.

What is a favicon?

Short for favorites icon, the favicon is a small yet perfectly square icon . It was originally created to make your website stand out within a user’s toolbar list. It is now displayed next to the title of a web page in most browsers.

The favicon should generally be your logo and always needs to be a square. The minimum size of the icon is 16x16 pixels.

Here is how it looks on the Didacte website. This is also the default icon used for new schools when no personalized icon is added to replace it:

How a favicon looks in your browser

How to easily create your own favicon

Don’t worry, we won’t ask you to learn graphic design or install software in order to create your favicon!

There are many free resources available to accomplish this, but our favorite is this simple website. It creates all the most commonly used sizes of favicons in one file.

It’s also very fast and doesn’t show many ads, an added bonus:

http://www.icoconverter.com/

For better results, we suggest following these two rules:

  1. Use a square image.
  2. Don’t select sizes that are superior to your square image.

That’s all!

Practical example

Let’s say you are launching a cooking school and really like this royalty-free image found on Pixabay.

You’ve decided to use it as a logo for your cooking school:

My cooking school's logo

Open the website mentioned above to create your favicon:

http://www.icoconverter.com/

Your image is perfectly square and has a size of 260x260 pixels. This size is greater than the maximum favicon size of the website, so you only need to select the image and check all possible sizes :

Image sizes

Press the Convert button, the website automatically creates a file named favicon.ico. In your school’s administration, on the Appearance tab, select the favicon.ico file, upload it and press Save.

Upload a favicon

Your new custom favicon replaces the default Didacte logo !

The new look in your browser

Kaven ayotte

Kaven Ayotte