Μέγεθος Favicon για τον ιστότοπο

Στο σχεδιασμό ιστοσελίδων, όπως ίσως γνωρίζετε, είναι σημαντικόκάθε λεπτομέρεια. Ένα άτομο που έχει περάσει στη πηγή σας δεν βλέπει τα στοιχεία ξεχωριστά, αλλά αντιλαμβάνεται ολόκληρη την εικόνα σαν ένα πακέτο που αποτελείται από άλλες μικρές λεπτομέρειες. Έτσι, εάν χάσετε κάτι κατά την ανάπτυξη του πόρου σας, αυτή η λεπτομέρεια στο μέλλον μπορεί να χαλάσει ολόκληρο το συγκρότημα, ολόκληρη τη σύνθεση.

Μια τέτοια ασήμαντα μπορεί να είναι, για παράδειγμα, το φόντο ενός κουμπιού,λανθασμένα επιλεγμένη γραμματοσειρά κάποιου μικρού στοιχείου και ακόμη και favicon. Πράγματι, κοιτάξτε τον εαυτό σας, οι μεγάλες, γνωστές τοποθεσίες έχουν ένα μεμονωμένο εικονίδιο, το οποίο το χαρακτηρίζει στην ενότητα "Σελιδοδείκτες" του προγράμματος περιήγησης του χρήστη. Χωρίς αυτήν, οι προγραμματιστές του πόρου δεν θα ήταν σε θέση να δημιουργήσουν τη σύνθεση στην οποία φιλοδοξούσαν αρχικά.

Ως εκ τούτου, δημιουργώντας ένα σχέδιο για τον ιστότοπό σας,θα πρέπει να φροντίσει για λεπτομέρειες όπως το Favicon. Σε αυτό το άρθρο, θα μιλήσουμε για το πώς θα το επιλέξετε κάτω από το γενικό στυλ του πόρου, καθώς και το μέγεθος που θα πρέπει να έχει αυτή η εικόνα.

Εικονίδιο ιστότοπου

Κατ 'αρχάς, καθορίζουμε τι είναιαυτό το στοιχείο. Ας δούμε τώρα το όνομα της καρτέλας του προγράμματος περιήγησης. Όπως μπορείτε να δείτε, στα αριστερά του υπάρχει μια μικρή εικόνα που δηλώνει μια απλοποιημένη έκδοση του λογότυπου πόρων. Η ίδια εικόνα βρίσκεται κοντά στο όνομα του ιστότοπου που εμφανίζεται στα αποτελέσματα αναζήτησης. Είναι σε αυτό που ο χρήστης είναι προσανατολισμένος όταν βλέπει τον τίτλο.

Πολλοί webmasters κατανοούν ότι μια τέτοια εικόναΑνάγκη - αλλά λίγοι άνθρωποι γνωρίζουν ποιο μέγεθος favicon για το site θα είναι το καταλληλότερο. Επομένως, σε αυτό το άρθρο δεν δίνουμε μόνο πληροφορίες σχετικά με τον τρόπο δημιουργίας ενός τέτοιου εικονιδίου και πώς μπορείτε να το εγκαταστήσετε στον πόρο σας, αλλά και να σας ενημερώσουμε για το μέγεθος της εικόνας.

Ο σκοπός του favicon

Έτσι, η εικόνα κοντά στον τίτλο του site εξυπηρετείαναγνώρισης. Αυτός είναι ο αρχικός σκοπός του: να εκφράσει την τοποθεσία, την ονομασία της οποίας βλέπουμε, και να τη διακρίνουμε στα μάτια των άλλων. Αυτό γίνεται όσο το δυνατόν απλούστερα με τη χρήση γραφικών: διαισθητικά αντιλαμβανόμαστε τις πληροφορίες σε εικόνες πολύ γρηγορότερες και ευκολότερες από ό, τι σε μορφή κειμένου. Οι Favicons μας βοηθούν σε αυτό. Αλλά μην ξεχνάτε ότι το μέγεθος του favicon είναι ελάχιστο στα μάτια του χρήστη. Αυτό δεν είναι λογότυπο στην "κεφαλίδα" του ιστότοπου, το οποίο μπορεί να περιέχει πρόσθετες πληροφορίες με τη μορφή επιγραφών, μερικές διευκρινίσεις ή πληροφορίες επικοινωνίας. Όλα όσα μπορούν να εμφανιστούν στο εικονίδιο δίπλα στο όνομα πρέπει να είναι όσο το δυνατόν πιο κοντά στο μέγεθος του Favicon. Και αυτός, όπως ήδη αναφέρθηκε, είναι απλά μια μινιατούρα (μόνο 16 με 16 εικονοστοιχεία).

Πώς να επιλέξετε ένα Favicon;

Έτσι πώς μπορεί να αναπτυχθεί ένας webmasterεικονίδιο για τον ιστότοπό σας; Θα πρέπει να σημειωθεί ότι απλά να συρρικνωθεί το λογότυπο του site, τις περισσότερες φορές, δεν θα λειτουργήσει. Στα εμβλήματα που έχουν τη μορφή λογότυπου συγκεκριμένου πόρου, είναι συχνά ορατά διαφορετικά στοιχεία, τα οποία δεν θα εμφανίζονται πάντα σωστά σε μικρογραφία. Είναι καλύτερο να εγκαταλείψουμε αμέσως μια τέτοια δέσμευση.

Φυσικά, το μέγεθος του favicon δεν επιτρέπει την ομιλίακαι απλά να εισάγετε μια επιγραφή εκεί. Οποιοδήποτε κείμενο θα είναι απλά αόρατο σε αυτό το ψήφισμα. Είναι απαραίτητο να αναπτυχθεί μια νέα εικόνα που θα μεταφέρει το στυλ του ιστότοπου. Για να βρούμε λύσεις, πάλι, ας στραφούμε προς τους μεγαλύτερους ιστότοπους.

Πολλοί χρησιμοποιούν με τη μορφή ενός favicon στυλιζαρισμένοτο πρώτο γράμμα του ονόματος υπηρεσίας. Αυτό είναι για παράδειγμα το Bing, το Yahoo, το Yandex, η Wikipedia, η Google. Υπάρχει μια άλλη προσέγγιση - αν έχετε ένα σύντομο όνομα τοποθεσίας, μπορείτε να το ορίσετε ως φόντο του εικονιδίου σας. Στο μέγεθος του favicon (σε εικονοστοιχεία φτάνει, επαναλαμβάνω, 16 με 16 βαθμούς) επιτρέπεται να εμφανίζεται σωστά αυτή η επιγραφή, δεν θα πρέπει να υπερβαίνει τα 3 γράμματα. Αυτό συμβαίνει για παράδειγμα από την υπηρεσία Aol.

Πώς να δημιουργήσετε ένα Favicon;

Κάντε ένα εικονίδιο για το όνομα του ιστότοπου που μπορείτεμε πολλούς τρόπους. Φυσικά, το πιο απλό είναι να δουλεύεις με διαφορετικές έτοιμες λύσεις. Μπορεί να αφορά οποιεσδήποτε υπηρεσίες ή προγράμματα που σας επιτρέπουν να κάνετε ένα πλήρες εικονίδιο από ένα εικονίδιο, μειώνοντάς το. Ωστόσο, θα συνιστούσατε να αναπτύξετε αυτό το λογότυπο μόνος σας. Αυτό, πρώτον, θα δώσει την ευκαιρία να μάθετε κάτι. και δεύτερον, θα παρέχει περισσότερα εργαλεία. Το μόνο που χρειάζεται να μπορείτε να κάνετε είναι να σχεδιάσετε και να μάθετε ποιο μέγεθος θα πρέπει να είναι το favicon στην τελική έκδοση. Σχετικά με το μέγεθος της εικόνας για τον ιστότοπο, θα μιλήσουμε λίγο αργότερα, αλλά προς το παρόν, σημειώστε μερικές από τις λεπτές αποχρώσεις της εργασίας με τέτοιες εικόνες. Συγκεκριμένα, χωρίς να αναφέρετε το μέγεθος του favicon για τον ιστότοπο, πρέπει να καθορίσετε τη μορφή αυτής της εικόνας. Όπως σημειώνεται από τους έμπειρους σχεδιαστές, η εικόνα πρέπει να αποθηκευτεί ως .PNG (24-bit) ή ως αρχείο ICO.

Μπορείτε να αποθηκεύσετε την εικόνα, για παράδειγμα, χρησιμοποιώντας το Photoshop, όπου θα σχεδιαστεί το λογότυπο.

Διαστάσεις του favicon

Λοιπόν, ας μιλήσουμε τώρα για το πόσο μεγάλοπρέπει να υπάρχει μια εικόνα που βλέπουμε δίπλα στο όνομα του ιστότοπου στο SERP. Από προεπιλογή, όπως ήδη αναφέρθηκε, το μέγεθός του είναι μόνο 16 pixel (σε κάθε πλευρά). Ωστόσο, αν προσπαθήσετε να επεξεργαστείτε αυτήν την εικόνα στο Photoshop, θα δείτε μόνοι σας πόσο άβολο είναι. Συνεπώς, συνιστούμε να εργαστείτε με μια διευρυμένη εικόνα, η οποία στο μέλλον μπορεί να συμπιεστεί απλά γύρω από τις άκρες και να αποθηκευτεί στην απαιτούμενη μορφή.

Multiplatform

Ωστόσο, μιλώντας για το μέγεθος του faviconθα πρέπει να είναι στον ιστότοπό σας, πρέπει να θυμηθείτε ένα ακόμα πράγμα. Δεν όλες οι πλατφόρμες εμφανίζουν την εικόνα του πόρου με τον ίδιο τρόπο. Για παράδειγμα, συσκευές με οθόνη Retina "βλέπουν" το favicon με ταχύτητα 32 έως 32 pixel. Και στο Safari και στη νέα πλατφόρμα των Windows, και καθόλου, αυτά τα εικονίδια φτάνουν το μέγεθος των 64 εικονοστοιχείων.

Επομένως, συνιστάται να διατηρείτε διαφορετικές εκδόσειςεικονίδια και στο μέλλον απλώς να προβλέπουν την αλλαγή της ανάλογα με την πλατφόρμα του χρήστη. Ένα άλλο ενδιαφέρον σημείο - μπορείτε να δοκιμάσετε να κατεβάσετε το εικονίδιο με τη μεγαλύτερη μορφή, αναμένοντας ότι θα "συρρικνωθεί" ανάλογα με το πρόγραμμα περιήγησης.

Εξωτερικοί συντάκτες

Φυσικά, είναι καλό αν καταλαβαίνετε το Photoshopκαι γνωρίζετε ποιο μέγεθος πρέπει να είναι το Favicon και πώς να το επιτύχετε διατηρώντας την εικόνα του. Ωστόσο, υπάρχουν πολλοί νεοφερμένοι που απλά δεν συναντήθηκαν τόσο σύντομα πριν από τους γραφικούς συντάκτες, ώστε να μην μπορούν να τραβήξουν μόνο τη σωστή εικόνα. Για να βοηθήσετε αυτούς τους webmasters, υπάρχουν διάφορες υπηρεσίες που σας επιτρέπουν να δημιουργείτε αυτόματα ένα εικονίδιο που σας ενδιαφέρει. Πολλά από αυτά είναι ακόμη δωρεάν, τα οποία δεν απαιτούν καμία επένδυση από τον χρήστη.

Για την εργασία μερικές φορές απλά πρέπει να εγγραφείτε,αλλά, όπως γνωρίζετε, αυτό γίνεται μία φορά - τελικά, όχι τόσο συχνά οι εταιρείες αλλάζουν το favicon. Δείτε τουλάχιστον στο Google, το οποίο αλλάζει το λογότυπο κάθε μέρα, αλλά δεν αγγίζει το εικονίδιο.

Πώς να εγκαταστήσετε το Favicon;

Γενικά, ορίστε τον ιστότοπό σας με τέτοιο τρόπο ώστετο είδαν σωστά την εικόνα που χρειάζεστε, πολύ απλά. Αρκεί να εκτελέσετε μια σειρά απλών ενεργειών που θα επιτρέπουν στις μηχανές αναζήτησης, καθώς και σε απλά προγράμματα περιήγησης, να διαβάζουν πληροφορίες.

Για να γίνει αυτό, η προκύπτουσα εικόνα είναι απαραίτητηΑποθηκεύστε το με το όνομα favicon.ico και τοποθετήστε το στη ρίζα του πόρου σας. Όλα, τώρα η εικόνα σας θα αναγνωριστεί αυτόματα και μετά από λίγο θα επισυναφθεί στον ιστότοπό σας.

Εκτός από αυτήν τη δέσμευση, μπορείτε να προσθέσετε μια ακόμη γραμμή που θα "προωθεί" όπου βρίσκεται το εικονίδιο σας. Μοιάζει με αυτό:

<link rel = "εικονίδιο συντόμευσης" href = "διεύθυνση του εικονιδίου" />

Εγκαταστήστε τον κώδικα στην κεφαλίδα του ιστότοπου.

Συμπεράσματα

Έτσι, αφού διαβάσατε το άρθρο μας, καταλάβατε μετο μέγεθος του favicon για το site και τι είναι. Επίσης, νομίζετε ότι έχετε συνειδητοποιήσει ότι η εξεύρεση της σωστής εικόνας για τον πόρο σας είναι απαραίτητη, διότι παίζει στα χέρια σας τόσο από την άποψη της αυξανόμενης αναγνώρισης όσο και από την άποψη της επιπρόσθετης κατανομής μεταξύ των ανταγωνιστών σας. Τουλάχιστον, οι μεγαλύτερες τοποθεσίες κάνουν το ίδιο πράγμα, το οποίο μπορεί να θεωρηθεί ως ένα ζωντανό παράδειγμα. Και τότε, δεν προκαλεί καμία ιδιαίτερη προσπάθεια - αφού κάνατε το Favicon μία φορά και το εγκαθιστούσατε σωστά στον ιστότοπό σας, μπορείτε να το ξεχάσετε για τους επόμενους μήνες.

Έτσι πειραματιστείτε τολμηρά, καταλήξουμε σε κάτι νέο, δοκιμάστε και όλα θα αποδειχθούν!