A Favicon is the small image that appear alongside a website’s title
Favicon is short for “favorite icon”
Favicon or Site Icon is the tiny image that appear next to your website title in the browser. It helps your users identify your website and more frequent visitors of your site will build an instant recognition for that tiny image. This increases your brand recognition and helps you build trust among your audiences.
The size of a favicon image is typically 16 x 16 pixels. İt can have the shape of a:
- Rounded (corners)
Some example favicons from websites we use everyday:
Why you should add favicon to your website ?
İf you’re serious about your own branding efforts. And want your users to recognize your site like we all recognize facebook, youtube. İt’s important to have a favicon. İt also improves your site’s usability and user experience.
It’s true, favicons are very little things, but the main reasons you should have because of:
- branding point-of-view
- identifying your website
- user experience
- improvement your site’s usability
Adding Your Site Icon or Favicon in WordPress
Log in to your wordpress account ( if you are not logged in)
Go to Dashboard » Appearance » Customize and click on the ‘Site Identity’ tab
Now you are in the Site İdentity section. The site identity section in customize allows you to change the site title, description, and control whether or not you want to display them in the header. It also allows you to upload your site icon. Simply click on the select file button and then upload the image you want to use as site icon.
Sorry for that drawing. As İ code almost everyday İ don’t use a mouse anymore. İ use the touchpad in my laptop.
If the image you are uploading is recommended size, then WordPress will allow you to crop it. İn my case İ don’t have to crop it because my favicon is 16 by 16 pixels
İn WordPress you may see this:
Site Icons should be square and at least 512 × 512 pixels.
But that’s not true at all. İf you want to make sure you can try to upload 16×16 pixels like İ did.
Well, that’s basically all. Now you can refresh your browser and see your icon next to your webpage title or as mobile apps use icons as app icon. From your mobile device visit your site and then from the browser menu select “Add to homescreen’. You will see that your site icon will appear on the homescreen.