Το Favivon είναι η λεπτομέρεια στην κατασκευή της ιστοσελίδας που μπορεί όμως να κάνει τη διαφορά. Το Favicon έχει δημιουργηθεί για να διευκολύνει τους χρήστες να ξεχωρίζουν τις ιστοσελίδες που αποθηκεύουν στα αγαπημένα. Βλέποντας το favicon εκείνος θυμάται πια ιστοσελίδα είναι και δεν χρειάζεται να γράφει ολόκληρες περιγραφές για να θυμάται.

Το Favicon μπορεί να είναι μια εικόνα ή περισσότερες όπως επίσης μπορεί να είναι και κινούμενο. Οι διαστάσεις του συνήθως είναι 16 x 16 και εμφανίζεται πάντοτε στην εικόνα του url του κάθε browser.

Παράδειγμα :

Δημιουργία ένος favicon :

Ας δούμε λίγο πιο αναλυτικά πως γίνεται η δημιουργία του favicon. Αφού επιλέξουμε την εικόνα που θέλουμε τότε χρησιμοποιούμε κάποιο πρόγραμμα που θα μας το μετατρέψει το αρχείο σε .ico . Υπάρχουν διάφορα free προγράμματα που το κάνουν αυτό αλλά αν δεν έχετε υπόψιν σας κάποιο μη στεναχωριέστε καθώς υπάρχουν αρκετές online σελίδες που το κάνουν αυτό.

Δύο από τις πιο γνωστές είναι :

http://www.degraeve.com/favicon/
http://www.favicon.cc/

Στις σελίδες αυτές μπορούν να μετατρέψουν αυτόματα όποια εικόνα ανεβάσετε σε αυτές σε διαστάσεις και ποιότητα favicon. Αφότου τα εικονίδια δημιουργηθούν τότε τα κατεβάζετε στον υπολογιστή σας και τα τοποθετείτε στο site  σας.

Για να τις προσθέσετε στην σελίδα σας υπάρχουν οι εξής τρόποι :

Αν η σελίδα είναι custom τότε τοποθετείτε τον παρακάτω κώδικα στο head.

<link rel=”shortcut icon” href=”to path tou arxeiou sou/favicon.ico” />

<link rel=”icon” href=”to path tou arxeiou sou/favicon.ico” />

Στην περίπτωση όπου είναι joomla τότε ανεβάζουμε το αρχείο στο root folder του template και το joomla το αναγνωρίζει μόνο του. Αλλιώς ακολουθούμε την παραπάνω custom λογική.

Στην περίπτωση όπου είναι wordpress τότε ανεβάζουμε το αρχείο στο root folder του site και στον φάκελο του theme.

Κινούμενο Favicon :

Για το κινούμενο favicon ισχύουν τα ίδια πράγματα, η μόνη διαφορά είναι ότι το αρχείο αποθήκευσης είναι .gif και όχι .ico . Tο υποστηρίζουν όμως οι περισσότεροι browsers. Μπορείτε να δοκιμάσετε να φτιάξετε ένα στο http://www.animatedfavicon.com .