Ανανεώνεις την αρχική σελίδα αργά ένα απόγευμα Τρίτης. Ο τίτλος είναι εντάξει, οι φωτογραφίες είναι εντάξει, αλλά οι επισκέπτες φεύγουν μέσα σε δευτερόλεπτα. Αρχίζεις να αναρωτιέσαι μήπως η ιεραρχία γραμματοσειρών είναι το κομμάτι που έχεις παραβλέψει. Συχνά είναι. Οι μικρές οπτικές αποφάσεις διαμορφώνουν την πρώτη εντύπωση πιο γρήγορα απ’ όσο περιμένουν οι περισσότεροι ιδιοκτήτες επιχειρήσεων.
Η ιεραρχία γραμματοσειρών χρησιμοποιεί μέγεθος, βάρος και αποστάσεις για να δείξει ποιο κείμενο μετράει περισσότερο. Εδώ εξηγούμε τι σημαίνει αυτό σε απλά λόγια, γιατί επηρεάζει την ιστοσελίδα και το μάρκετινγκ σου και πώς το εφαρμόζεις χωρίς να χαθείς σε ορολογία. Θα δεις επίσης πώς ταιριάζει στην ίδια εικόνα η οπτική ιεραρχία. Ας το δούμε βήμα βήμα.
Τι είναι η ιεραρχία γραμματοσειρών και γιατί μετράει
Η ιεραρχία γραμματοσειρών χρησιμοποιεί μέγεθος, βάρος και αποστάσεις για να δείξει ποιο κείμενο μετράει περισσότερο.
Στην πράξη, η ιεραρχία γραμματοσειρών εμφανίζεται στις κεφαλίδες της ιστοσελίδας σου, στις σελίδες υπηρεσιών, στα γραφικά για τα social και στα έντυπα. Όταν την ονομάζεις σωστά, δίνεις brief σε σχεδιαστές πιο γρήγορα και κρίνεις τα προσχέδια με σιγουριά.
Συγγενικές ιδέες, όπως η οπτική ιεραρχία, συνδέονται άμεσα. Κράτα τες στο μυαλό σου καθώς διαβάζεις την υπόλοιπη ενότητα.
Η καθαρή ιεραρχία βοηθά όποιον σαρώνει τη σελίδα να βρει γρήγορα τίτλους, υπότιτλους και ενέργειες.
Γιατί μετράει η ιεραρχία γραμματοσειρών για την επιχείρησή σου;
Οι πελάτες κρίνουν την αξιοπιστία από τη διάταξη πριν διαβάσουν κάθε λέξη. Η καθαρή οπτική δομή μειώνει τις τριβές και κάνει τις προσφορές πιο εύκολες στην κατανόηση.
Η οπτική ιεραρχία στη σελίδα εξαρτάται σε μεγάλο βαθμό από τα τυπογραφικά επίπεδα.
Όρισε μία φορά τα στυλ από H1 έως H3 και ξαναχρησιμοποίησέ τα σε κάθε πρότυπο.
Αν θέλεις να δεις πώς συνδέεται με γειτονικά θέματα, διάβασε στη συνέχεια την τυπογραφία στο web design και τα είδη γραμματοσειρών.
Πρακτική λίστα ελέγχου που μπορείς να χρησιμοποιήσεις σήμερα
Όρισε μία φορά τα στυλ από H1 έως H3 και ξαναχρησιμοποίησέ τα σε κάθε πρότυπο.
Όταν ελέγχεις μια σελίδα, ρώτα αν η ιεραρχία γραμματοσειρών φαίνεται από το πρώτο scroll στο κινητό. Αν όχι, άλλαξε τη σειρά των ενοτήτων πριν γυαλίσεις τις λεπτομέρειες.
Κράτα screenshots πριν και μετά τις αλλαγές, ώστε να μάθεις τι έκανε διαφορά στην ιστοσελίδα σου.
Μοιράσου τη λίστα με όποιον ενημερώνει την ιστοσελίδα σου, ώστε η οπτική ιεραρχία να μένει σταθερή στις νέες σελίδες.
Διάλεξε ένα μέγεθος για να το παρακολουθείς αυτόν τον μήνα, όπως ο χρόνος στη σελίδα ή οι έναρξες φόρμας, ώστε οι αλλαγές στον σχεδιασμό να συνδέονται με επιχειρηματικά αποτελέσματα και όχι μόνο με γούστο.
Πώς συνδέεται το θέμα με την ευρύτερη επωνυμία σου
Οι οπτικές επιλογές σπάνια ζουν μόνο σε μία σελίδα. Η οπτική ιεραρχία στη σελίδα εξαρτάται σε μεγάλο βαθμό από τα τυπογραφικά επίπεδα.
Οι αναρτήσεις σου στα social, τα email και τα έντυπα πρέπει να επαναλαμβάνουν την ίδια ιεραρχία, τα ίδια χρώματα και τους ίδιους κανόνες γραμματοσειράς που χρησιμοποιείς στο web.
Όταν τα οπτικά της επωνυμίας ξεφεύγουν, οι πελάτες νιώθουν μια λεπτή ασυμφωνία, ακόμη κι αν δεν μπορούν να την εξηγήσουν.
Δες τους κανόνες τυπογραφίας για να συγκρίνεις σημειώσεις με ένα συγγενικό κεφάλαιο αυτής της ενότητας.
Η καθαρή ιεραρχία βοηθά όποιον σαρώνει τη σελίδα να βρει γρήγορα τίτλους, υπότιτλους και ενέργειες.
Συχνές ερωτήσεις που περνούν απαρατήρητες
Δευτερεύοντες όροι, όπως η οπτική ιεραρχία και οι κανόνες τυπογραφίας, σε βοηθούν να ψάξεις βαθύτερα παραδείγματα και να συγκρίνεις τη δουλειά σου με τα συνηθισμένα πρότυπα.
Η οπτική ιεραρχία στη σελίδα εξαρτάται σε μεγάλο βαθμό από τα τυπογραφικά επίπεδα.
Σημείωσε μία αλλαγή, πριν και μετά, που θα δοκιμάσεις αυτή την εβδομάδα σε μια ζωντανή σελίδα. Οι μικρές αλλαγές με μέτρηση κερδίζουν τα αόριστα σχέδια.
Αν η ομάδα σου μάθει κοινό λεξιλόγιο γύρω από την ιεραρχία γραμματοσειρών, γλιτώνεις γύρους διορθώσεων με σχεδιαστές και γραφεία.
Εργαλεία που κάνουν πιο εύκολες τις οπτικές αλλαγές
Δεν χρειάζεσαι custom κώδικα για να διορθώσεις πολλά προβλήματα διάταξης και στυλ. Ένας οπτικός επεξεργαστής σου επιτρέπει να ρυθμίσεις αποστάσεις, χρώματα και γραμματοσειρές, ενώ βλέπεις προεπισκόπηση σε κινητό και σε υπολογιστή.
Με τον δημιουργό ιστοσελίδων της WEMASY φτιάχνεις τις δικές σου σελίδες στην ιστοσελίδα σου. Άνοιξε τον δημιουργό ιστοσελίδων όταν είσαι έτοιμος να εφαρμόσεις όσα έμαθες.
Όταν δημοσιεύεις αλλαγές, ξαναδές την τυπογραφία στο web design και τα είδη γραμματοσειρών, ώστε η ενότητα να μένει συνδεδεμένη στο μυαλό σου.
Έχεις πλέον ένα πρακτικό πρίσμα για την ιεραρχία γραμματοσειρών. Χρησιμοποίησέ το όταν ελέγχεις την ιστοσελίδα σου, εγκρίνεις υλικό μάρκετινγκ ή δίνεις brief σε σχεδιαστή. Συνέχισε με τα είδη γραμματοσειρών και τους κανόνες τυπογραφίας για να κρατήσεις τον ρυθμό σε αυτή την ενότητα.
Συχνές ερωτήσεις
Πόσο χρόνο παίρνει να βελτιώσεις την ιεραρχία γραμματοσειρών;
Οι περισσότερες μικρές επιχειρήσεις βλέπουν πιο καθαρές σελίδες μέσα σε λίγες συγκεντρωμένες συνεδρίες, μόλις εφαρμόσουν τα βασικά αυτού του κεφαλαίου. Ξεκίνα από την αρχική σελίδα και μετά πέρασε τους ίδιους κανόνες στις σελίδες υπηρεσιών και επικοινωνίας.
Χρειάζεσαι σχεδιαστή για την ιεραρχία γραμματοσειρών;
Ένας σχεδιαστής βοηθά σε σύνθετα rebranding, αλλά πολλές διορθώσεις στην ιεραρχία γραμματοσειρών γίνονται και μόνος σου, όταν ξέρεις τι να προσέξεις. Διάβασε μαζί με αυτό το κεφάλαιο και την τυπογραφία στο web design για συναφή καθοδήγηση.
Μπορεί η WEMASY να σε βοηθήσει να εφαρμόσεις την ιεραρχία γραμματοσειρών στην ιστοσελίδα σου;
Με τον δημιουργό ιστοσελίδων της WEMASY φτιάχνεις τις δικές σου σελίδες στην ιστοσελίδα σου. Άνοιξε τον δημιουργό ιστοσελίδων για να ξεκινήσεις.
Ποιο είναι το συνηθέστερο λάθος με την ιεραρχία γραμματοσειρών;
Ο κόσμος προσπαθεί να διορθώσει τα πάντα μονομιάς αντί για μία σελίδα τη φορά. Διάλεξε μία προτεραιότητα, όπως την αναγνωσιμότητα ή την αντίθεση, και μετά δες τα είδη γραμματοσειρών για την επόμενη βελτίωση.
Πώς συνδέεται η ιεραρχία γραμματοσειρών με το SEO;
Η καθαρή οπτική ιεραρχία και η ευανάγνωστη γραμματοσειρά κρατούν τους επισκέπτες περισσότερο στη σελίδα, κάτι που στηρίζει τα σήματα αλληλεπίδρασης που παρακολουθούν οι μηχανές αναζήτησης. Συνδύασε τις διορθώσεις σχεδίασης με σωστή δομή περιεχομένου για το καλύτερο αποτέλεσμα.
Τι να μάθεις μετά την ιεραρχία γραμματοσειρών;
Συνέχισε με την τυπογραφία στο web design και τα είδη γραμματοσειρών σε αυτό το βιβλίο, για να χτίσεις ένα πλήρες οπτικό σύστημα για την επωνυμία σου στο διαδίκτυο.