Ένα από τα πιο σημαντικά καθήκοντα στο πιάτο σας ως σχεδιαστής ιστοσελίδων είναι η χρηστικότητα. Η ευχρηστία ορίζεται ως ένας μετρητής της ποιότητας της εμπειρίας του χρήστη όταν αλληλεπιδρά με τον ιστότοπό σας. Κάθε ιστοσελίδα που σχεδιάζετε πρέπει να είναι πάντα απρόσκοπτη από την άποψη του χρήστη. Θα πρέπει να βρουν τον ιστότοπό σας εύκολο στην πλοήγηση χωρίς να χρειάζεται πρώτα να υποβληθούν σε ειδική εκπαίδευση. Η χρηστικότητα βασίζεται συνήθως σε διάφορους παράγοντες.
Ένα άτομο που ψάχνει μέσα από το site σας θέλει την ευκολία μάθησης τους να είναι κορυφαία. Θα θελήσουν να μάθουν γρήγορα τη διεπαφή χρήστη, ώστε να μπορούν να πηδήξουν δεξιά και να ολοκληρώσουν θεμελιώδεις εργασίες πλοήγησης. Η αποτελεσματικότητα της χρήσης είναι ένας άλλος παράγοντας: αφού έχουν μάθει να περιηγούνται στον ιστότοπό σας, θα θέλουν να ολοκληρώσουν γρήγορα τις εργασίες τους. Ακόμη και αν ο χρήστης έχει χρησιμοποιήσει τον ιστότοπο πριν, θα πρέπει να θυμάται εύκολα αρκετή διαδικασία για να μπορέσει να χρησιμοποιήσει αποτελεσματικά τον ιστότοπο την επόμενη φορά. Αυτό ονομάζεται απομνημόνευση. Όταν χρησιμοποιούν τον ιστότοπό σας, μπορεί να παρουσιάσουν κάποια σφάλματα, αλλά αυτά τα σφάλματα είναι συχνά ή σοβαρά; Τέλος, αφού τελειώσουν με τον ιστότοπό σας, είναι η υποκειμενική ικανοποίηση του χρήστη υψηλή ή χαμηλή; Θα έπρεπε να έχουν χρησιμοποιήσει τον ιστότοπό σας.
Φυσικά, δεν μπορείτε να ευχαριστήσετε όλους τους επισκέπτες της ιστοσελίδας όλη την ώρα, αλλά ορισμένα πρότυπα είναι κοινά για να εξασφαλιστεί καλή χρηστικότητα. Τι μέτριοι σχεδιαστές ιστοσελίδων θεωρούν δεδομένο, δεν πρέπει. Ακολουθεί μια ανασκόπηση των τριών κορυφαίων σφαλμάτων ευχρηστίας που οι σχεδιαστές ιστοσελίδων πρέπει να αποφεύγουν με κάθε κόστος.
Ο ιστότοπός σας θα γεμίσει με υπερσύνδεσμους, οι οποίοι σαφώς προορίζονται για κλικ. Βεβαιωθείτε λοιπόν ότι είναι αρκετά μεγάλα για να μπορείτε να κάνετε κλικ εύκολα. Είναι τόσο απλό. Διαφορετικά, οι υπερσυνδέσεις σας δεν θα ληφθούν καλά. Οι κινήσεις των χεριών του χρήστη με το ποντίκι δεν πρόκειται να είναι ακριβείς για να ξεκινήσετε, οπότε μην κάνετε κάποιες περιοχές με δυνατότητα κλικ που είναι τόσο μικρές ώστε ο χρήστης πρέπει να χρησιμοποιήσει έναν συνδυασμό φινέτσας και στρατηγικής μόνο για να έχει έναν πυροβολισμό κάνοντας κλικ στις μικροσκοπικές υπερσυνδέσεις σας.
Από την άλλη πλευρά, μια ευρύτερη, πιο εύκολη στην κάκωση περιοχή καθιστά πολύ πιο βολικό να τοποθετηθεί ο δρομέας πάνω από κάθε σύνδεσμο. Για να κάνετε την περιοχή με δυνατότητα κλικ μεγαλύτερη, απλά κάντε ολόκληρο το σύνδεσμο μεγαλύτερο ή βελτιώστε το παραπέτασμα που περιβάλλει τη σύνδεση. Μπορείτε να το κάνετε αυτό χρησιμοποιώντας την ιδιότητα padding CSS.
Ρίξτε μια ματιά σε αυτό το πρόστιμο παράδειγμα από μια φρικτά μικρή περιοχή με δυνατότητα κλικ. Είναι από τη σελίδα "Hacker News" μιας ιστοσελίδας που ονομάζεται Y Combinator, η οποία παρέχει χρηματοδότηση για αρχάριους. Παρατηρήστε πώς τα σχόλια και οι σύνδεσμοι χρήστη είναι τόσο ασήμαντα μικροσκοπικά. Θα είστε τυχεροί να επιτύχετε επιτέλους κάνοντας κλικ σε αυτές μετά από πολλές φορές.
Η χαρτογράφηση είναι μεγάλη όταν χρησιμοποιείται για τον σωστό σκοπό στο σχεδιασμό ιστοσελίδων. Όταν χρησιμοποιείται σωστά, η τοποθέτηση σελίδων είναι ένα ευπρόσδεκτο χαρακτηριστικό επειδή κάνει τη διάταξη του site πιο βολική και ευκολότερη στην απορρόφηση. Χρησιμοποιείται κυρίως για να διαιρέσει το περιεχόμενο σε διάφορες σελίδες και είναι ένα χαρακτηριστικό που συνήθως εμφανίζεται σε ιστότοπους που παρουσιάζουν μεγάλους καταλόγους στοιχείων.
Ωστόσο, η σελίδα μπορεί επίσης να χρησιμοποιηθεί κατά λάθος, γεγονός που την καθιστά παράγοντα που συμβάλλει στη δυσκολία χρήσης. Ορισμένοι ιστότοποι αρέσκονται στην κατάχρηση της σελίδας με σκοπό τη διαίρεση σελίδων βασικού περιεχομένου σε αρκετές σελίδες και υπάρχει και ένα τελευταίο κίνητρο πίσω από αυτό. Οι τοποθεσίες που το κάνουν αυτό πιθανότατα προσπαθούν να αυξήσουν τις προβολές της σελίδας τους, απλές και απλές. Πολλά σε απευθείας σύνδεση περιοδικά και ιστολόγια αποκτούν τα έσοδά τους μέσω διαφήμισης, οπότε η λήψη περισσότερων προβολών σελίδας αυξάνει τα στατιστικά στοιχεία προβολής και τους επιτρέπει να χρεώνουν περισσότερο για διαφημίσεις.
Ρίξε μια ματιά σε αυτό κατάχρηση της σελίδας, η οποία έρχεται σε μας από το Wired Magazine. Σημειώστε πώς το άρθρο στο πολύχρωμο λογότυπο της Google χωρίζεται σε οκτώ σελίδες όταν όλες οι οκτώ σελίδες μπορούν εύκολα να συνδυαστούν σε μία ιστοσελίδα. Ακόμα και τότε, αυτό το μεγαλύτερο άρθρο δεν θα είχε προκαλέσει την επιβράδυνση της φόρτωσης και της επεξεργασίας της σελίδας. Σημειώστε επίσης πόσο επιδεινούμενο είναι να κάνετε κλικ πολλές φορές μόνο για να ολοκληρώσετε την ανάγνωση του άρθρου.
Επιπλέον, αυτή η κατάχρηση της σελίδωσης μπορεί να είναι επιζήμια όσον αφορά το SEO. εάν διαχωρίζετε περιεχόμενο στον ιστότοπό σας σε πολλές σελίδες, αραιώνετε το περιεχόμενό σας. Αυτό έχει ως αποτέλεσμα τη μείωση του αριθμού των σχετικών λέξεων-κλειδιών σχετικά με το θέμα σε κάθε ιστοσελίδα, πράγμα που σημαίνει ότι κάθε σελίδα κάνει λιγότερο νόημα από μόνη της. Ως αποτέλεσμα, οι μηχανές αναζήτησης μπορεί να αποτύχουν να ερμηνεύσουν σωστά το περιεχόμενο κάθε σελίδας, επηρεάζοντας έτσι αρνητικά την κατάταξη των αποτελεσμάτων των μηχανών αναζήτησης του άρθρου.
Το περιεχόμενο που είναι δύσκολο για τους χρήστες του site να σαρώνουν είναι συνήθως περιεχόμενο που πάσχει από κακό αντίγραφο. Το αντίγραφο είναι το περιεχόμενο κειμένου με το οποίο έχετε γεμίσει τον ιστότοπό σας και είναι απολύτως απαραίτητο να καταστήσετε την χρηστικότητα του ιστότοπού σας εξαιρετική. Ακόμα και πριν ανησυχείτε για το καλό αντίγραφο, θα πρέπει να έχετε μια πλήρη κατανόηση των συμπεριφορών των χρηστών του ιστότοπου. Οι χρήστες του ιστότοπου έχουν την τάση να μην διαβάζουν όλες τις πληροφορίες μιας ιστοσελίδας από πάνω προς τα κάτω, όπως ίσως περιμένετε.
Στην πραγματικότητα, οι χρήστες του ιστότοπου απορροφούν πληροφορίες απλώς πηδώντας από ένα κομμάτι περιεχομένου στο επόμενο, ουσιαστικά καθοδηγούμενοι από αυτό που ξεδιπλώνεται σε αυτά στην ιστοσελίδα. Μπορείτε να ευχαριστήσετε το γεγονός ότι το διαδίκτυο βομβαρδίζει τους ανθρώπους με πληροφορίες για αυτή τη φρενήρη διαδικτυακή συμπεριφορά. Τα μάτια των χρηστών κατευθύνονται βασικά από ένα ενδιαφέρον τμήμα οποιασδήποτε δεδομένης ιστοσελίδας στο άλλο, πράγμα που σημαίνει ότι εσείς, όπως ο εξειδικευμένος σχεδιαστής ιστοσελίδων είστε, πρέπει να διαρθρώνετε τις σελίδες σας με τέτοιο τρόπο ώστε να ικανοποιείτε αυτήν την ξέφρενη συμπεριφορά.
Πρώτον, βεβαιωθείτε ότι ο ιστότοπός σας έχει μερικά, σαφή σημεία εστίασης. Αυτά θα λειτουργήσουν ως τα τμήματα της σελίδας σας που θα προσελκύσουν την προσοχή των επισκεπτών. Μπορείτε να πετύχετε συμπεριλαμβάνοντας μεγαλύτερες γραμματοσειρές καθώς και χρώματα υψηλής αντίθεσης. Για πρόσθετη οπτική έλξη, περιλαμβάνουν επίσης εικόνες όπως εικόνες ακριβώς δίπλα στο κείμενο.
Δεύτερον, κάθε σημείο εστίασης πρέπει ιδανικά να περιλαμβάνει μια περιγραφική επικεφαλίδα. Χωρίς να συνεχίσει να διαβάζει το αντίγραφο περαιτέρω, ένας χρήστης πρέπει να καταλάβει αμέσως τι θα καλύψει αυτή η ενότητα περιεχομένου. Μην κάνετε ποτέ τις επικεφαλίδες σας κρυπτικές ή ασαφείς για να τραβήξετε τους αναγνώστες μέσα. Κάντε τις επικεφαλίδες μικρές αλλά ακριβείς.
Τέλος, κάθε πρόσθετο κείμενο πρέπει να είναι σύντομο και εύκολο να απορροφηθεί. Προσφέρετε μόνο τις βασικές αρχές και αποκλείστε οτιδήποτε άλλο. Τις περισσότερες φορές, το πρόσθετο κείμενο που συμπεριλαμβάνουν οι copywriters για να αποσαφηνίσει ένα σημείο αφαιρεί πραγματικά από την αναγνωσιμότητα του εν λόγω κειμένου. Υπάρχει μια τάση για πολλούς ανθρώπους να διαβάζουν απλά μικρά αποσπάσματα κειμένου, αποφεύγοντας παράλληλα μεγαλύτερες παραγράφους, έτσι ώστε να κόβουμε το λίπος.
Ας ρίξουμε μια γρήγορη ματιά σε μια ιστοσελίδα που οργανώνει το αντίγραφο του. Αυτό είναι app καλλιεργημένου κώδικα πράγματα για το Mac. Θα παρατηρήσετε ότι, με την πρώτη ματιά, τα σημεία εστίασης, τα οποία είναι το στιγμιότυπο οθόνης και το τεράστιο κεφάλαιο "Τα πράγματα", είναι πολύ προφανή. Το αντίγραφο των διαφόρων λειτουργιών της εφαρμογής, το οποίο μπορείτε να δείτε περισσότερο από την κύλιση προς τα κάτω στη σελίδα, είναι επίσης πολύ σύντομο και μέχρι το σημείο, παίρνοντας μόνο μια σύντομη παράγραφο ή δύο για να δώσετε μια σύντομη περιγραφή κάθε αντίστοιχου χαρακτηριστικού.
Η καλή χρηστικότητα περιλαμβάνει τόσο πολλούς ξεχωριστούς παράγοντες που μπορεί μερικές φορές να είναι λίγο δύσκολο να παρακολουθείτε. Η ευχρηστία αφορά τον τελικό χρήστη και τον τρόπο με τον οποίο αισθάνονται καθώς πλοηγούν και σαρώνονται μέσω του ιστότοπού σας. Βάλτε τον εαυτό σας στα παπούτσια τους καθώς σχεδιάζετε την περιοχή σας. Μπορούν να μετακινηθούν εύκολα στον ιστότοπό σας; Θα θυμούνται εύκολα τι πρέπει να κάνουν και πού να πάνε την επόμενη φορά που επισκέπτονται τον ιστότοπό σας; Θα απολαύσουν τελικά την εμπειρία τους στην περιήγηση στον ιστότοπό σας; Όλα αυτά τα ερωτήματα πρέπει να είναι μπροστά και να κεντρίσουν στο μυαλό σας καθώς σχεδιάζετε τον ιστότοπό σας.
Η καλή χρηστικότητα έχει επίσης πρακτικά οφέλη. Όσο περισσότερο ένας χρήστης μπορεί να πλοηγηθεί αποτελεσματικά στον ιστότοπό σας, τόσο περισσότερο θα επιστρέψει. Θα πει επίσης στους φίλους τους, τη μαμά τους, τους συναδέλφους τους ... παίρνετε την εικόνα. Θα έρθουν και θα ελέγξουν την περιοχή σας. Ως αποτέλεσμα, θα έχετε περισσότερες προβολές σελίδας, περισσότερους αναγνώστες και, ελπίζω, έναν πιστό ακόλουθο. Αυτό σημαίνει ότι μπορείτε να δημιουργήσετε έσοδα από τον ιστότοπό σας και να χρεώσετε περισσότερα για διαφημίσεις στον ιστότοπο. Προσέξτε τη χρηστικότητα και θα αποκομίσετε τις ανταμοιβές με πολλούς τρόπους.
Ποια λάθη χρηστικότητας θα προσθέσετε; Ποιοι είναι οι χειρότεροι σχεδιαστές σφαλμάτων ευχρηστίας; Ας γνωρίσουμε τις σκέψεις σας στα σχόλια.
Προτεινόμενη εικόνα / μικρογραφία, εικόνα λάθους μέσω Shutterstock.