Μια ιστοσελίδα που φαίνεται καθαρή και φορτώνει γρήγορα μπορεί παρ' όλα αυτά να αποτυγχάνει εντελώς. Οι επισκέπτες φτάνουν, κοιτάζουν γύρω και φεύγουν χωρίς να κάνουν τίποτα. Ο σχεδιασμός είναι εντάξει. Το περιεχόμενο υπάρχει. Η εμπειρία χρήστη είναι αυτή που σπάει την αλυσίδα ανάμεσα στην άφιξη και την ενέργεια και είναι το κομμάτι της ιστοσελίδας που οι περισσότεροι ιδιοκτήτες κοιτάζουν τελευταίο.
Η βελτίωση της εμπειρίας χρήστη σημαίνει ότι εντοπίζεις και αφαιρείς τα εμπόδια ανάμεσα στον επισκέπτη και στο αποτέλεσμα που ήρθε να πετύχει. Το αποτέλεσμα μπορεί να είναι να βρει πληροφορίες, να κάνει μια αγορά, να υποβάλει μια φόρμα επικοινωνίας ή να καταλάβει τι προσφέρει η επιχείρηση. Κάθε σημείο όπου ο επισκέπτης διστάζει, μπερδεύεται ή τα παρατά είναι πρόβλημα UX και τα περισσότερα διορθώνονται χωρίς πλήρη ανασχεδιασμό.
Το άρθρο για το τι είναι ο σχεδιασμός UX εξηγεί τις αρχές που στηρίζουν μια καλή εμπειρία χρήστη. Αυτό το άρθρο καλύπτει τις πρακτικές αλλαγές που φέρνουν τη μεγαλύτερη βελτίωση σε πραγματικές επαγγελματικές ιστοσελίδες.
Πώς εντοπίζεις προβλήματα UX στην ιστοσελίδα σου;
Πριν κάνεις αλλαγές, πρέπει να ξέρεις πού είναι τα προβλήματα. Διάφορες μέθοδοι αναδεικνύουν διαφορετικούς τύπους προβλημάτων.
Σήματα από τα στατιστικά
Τα υψηλά bounce rate σε βασικές σελίδες, ο χαμηλός χρόνος παραμονής σε περιεχόμενο που θα έπρεπε να διαβάζεται περισσότερο και οι απότομες πτώσεις στη διαδικασία πληρωμής ή στη συμπλήρωση φορμών δείχνουν προβλήματα UX. Αυτά τα σήματα δεν σου λένε ποιο είναι το πρόβλημα, σου λένε όμως πού να κοιτάξεις. Μια σελίδα επικοινωνίας με ποσοστό εξόδου 90 τοις εκατό πριν την υποβολή έχει πρόβλημα UX κάπου σε αυτή τη ροή.
Παρακολουθώντας πραγματικούς επισκέπτες να πλοηγούνται
Το να ζητήσεις από κάποιον που δεν έχει ξαναδεί την ιστοσελίδα σου να βρει μια συγκεκριμένη σελίδα, να ολοκληρώσει μια συγκεκριμένη εργασία ή να απαντήσει σε μια συγκεκριμένη ερώτηση, ενώ εσύ παρακολουθείς, είναι ο πιο άμεσος τρόπος να εντοπίσεις αποτυχίες UX. Μην τον καθοδηγείς. Δες πού κάνει κλικ, πού διστάζει και πού τα παρατά. Δύο ή τρεις τέτοιες συνεδρίες θα αναδείξουν τα σημαντικότερα προβλήματα στις περισσότερες ιστοσελίδες.
Heatmaps και καταγραφές συνεδριών
Τα heatmaps δείχνουν πού κάνουν κλικ, πατούν και κάνουν scroll οι επισκέπτες σε κάθε σελίδα. Οι χάρτες scroll δείχνουν πόσο χαμηλά φτάνουν οι περισσότεροι επισκέπτες πριν φύγουν. Οι καταγραφές συνεδριών σού επιτρέπουν να δεις ξανά πραγματικές επισκέψεις, δείχνοντας ακριβώς πού κινούνται, σταματούν και τα παρατούν οι επισκέπτες. Αυτά τα εργαλεία απαντούν σε μια ερώτηση που τα στατιστικά δεν μπορούν: όχι μόνο ότι οι επισκέπτες φεύγουν, αλλά πού στη σελίδα φεύγουν και τι έκαναν εκείνη τη στιγμή.
Τεχνικοί έλεγχοι
Αν πλοηγηθείς στην ιστοσελίδα μόνο με πληκτρολόγιο, χωρίς να αγγίξεις το ποντίκι, θα αποκαλυφθούν προβλήματα λειτουργικότητας που επηρεάζουν τους χρήστες πληκτρολογίου και screen reader. Αν δεις την ιστοσελίδα σε πραγματικό τηλέφωνο σε διαφορετικά μεγέθη οθόνης, θα βρεις προβλήματα διάταξης στο κινητό που οι προσομοιώσεις στον browser του υπολογιστή συχνά χάνουν. Αν ελέγξεις τον χρόνο φόρτωσης σε σύνδεση κινητού, θα δεις προβλήματα ταχύτητας που είναι αόρατα στο γρήγορο Wi-Fi του γραφείου.
Ποιες βελτιώσεις UX έχουν τον μεγαλύτερο αντίκτυπο στις επαγγελματικές ιστοσελίδες;
Απλοποίησε την πλοήγηση
Μια πλοήγηση που αναγκάζει τον επισκέπτη να μαντέψει πού να πάει είναι από τις πιο συχνές αποτυχίες UX στις επαγγελματικές ιστοσελίδες. Οι ετικέτες μενού που σημαίνουν κάτι εσωτερικά αλλά τίποτα για έναν επισκέπτη που έρχεται πρώτη φορά, οι πάρα πολλές επιλογές πρώτου επιπέδου και οι σελίδες θαμμένες δύο ή τρία κλικ βαθιά δημιουργούν όλες εμπόδια πριν ο επισκέπτης δει οποιοδήποτε περιεχόμενο. Η μείωση των στοιχείων του μενού, οι απλές περιγραφικές ετικέτες και οι πιο σημαντικές σελίδες προσβάσιμες με ένα κλικ από κάθε σελίδα είναι οι πιο αξιόπιστες βελτιώσεις πλοήγησης. Το άρθρο για το τι είναι η πλοήγηση ιστοσελίδας εξηγεί πώς να στήσεις μενού που καθοδηγούν αντί να μπερδεύουν.
Όρισε καθαρή ιεραρχία σε κάθε σελίδα
Μια σελίδα χωρίς καθαρή οπτική ιεραρχία δεν δίνει στους επισκέπτες σημείο εκκίνησης. Όταν ο τίτλος, ένα διαφημιστικό banner, οι σύνδεσμοι πλοήγησης και το κυρίως κείμενο ανταγωνίζονται για προσοχή με παρόμοια μεγέθη και βάρη, οι επισκέπτες σαρώνουν χωρίς να διαβάζουν και φεύγουν χωρίς να κάνουν κάτι. Κάθε σελίδα πρέπει να έχει ένα κυρίαρχο στοιχείο στο οποίο πηγαίνει πρώτα το μάτι, συνήθως τον τίτλο, και μετά μια λογική διαδρομή προς την πιο σημαντική ενέργεια. Το άρθρο για το τι είναι η οπτική ιεραρχία εξηγεί πώς το μέγεθος, η αντίθεση και οι αποστάσεις δημιουργούν μια σειρά ανάγνωσης που καθοδηγεί τους επισκέπτες χωρίς προσπάθεια από τη δική τους πλευρά.
Διόρθωσε την εμπειρία στο κινητό
Μια σελίδα υπολογιστή που καταρρέει λάθος στο κινητό, κείμενο που θέλει pinch για να διαβαστεί, κουμπιά πολύ μικρά για να πατηθούν αξιόπιστα και φόρμες που είναι εκνευριστικό να συμπληρωθούν σε οθόνη αφής, όλα κάνουν τους επισκέπτες να φεύγουν. Τα προβλήματα UX στο κινητό είναι τα πιο σταθερά παραβλεπόμενα προβλήματα στις επαγγελματικές ιστοσελίδες, γιατί οι ιδιοκτήτες και οι προγραμματιστές συνήθως χτίζουν και δοκιμάζουν σε υπολογιστή. Ο έλεγχος κάθε βασικής σελίδας και κάθε ροής χρήστη σε πραγματικό τηλέφωνο δεν είναι προαιρετικός. Το άρθρο για το πώς να κάνεις μια ιστοσελίδα φιλική προς τα κινητά καλύπτει τις συγκεκριμένες αποφάσεις διάταξης και αλληλεπίδρασης που καθορίζουν αν η εμπειρία στο κινητό δουλεύει.
Μείωσε τα εμπόδια στις φόρμες
Οι φόρμες με πάρα πολλά υποχρεωτικά πεδία, χωρίς ορατές ετικέτες, με ασαφή μηνύματα σφάλματος και χωρίς επιβεβαίωση μετά την υποβολή χάνουν σημαντικό μέρος των επισκεπτών που ήθελαν να τις συμπληρώσουν. Αν αφαιρέσεις κάθε πεδίο που δεν είναι απαραίτητο, προσθέσεις καθαρές ετικέτες σε κάθε πεδίο, γράψεις μηνύματα σφάλματος που λένε το συγκεκριμένο πρόβλημα και πώς διορθώνεται και δείξεις καθαρό μήνυμα επιβεβαίωσης μετά την υποβολή, αυξάνεις τα ποσοστά συμπλήρωσης σχεδόν σε κάθε επαγγελματική ιστοσελίδα.
Κάνε τα κουμπιά δράσης ορατά και συγκεκριμένα
Ένα κουμπί δράσης που χάνεται στη σελίδα ή χρησιμοποιεί αόριστη γλώσσα χάνει επισκέπτες που είναι έτοιμοι να δράσουν. Το κύριο κουμπί δράσης σε κάθε σελίδα πρέπει να ξεχωρίζει οπτικά από ό,τι το περιβάλλει με χρώμα και αντίθεση, να βρίσκεται εκεί που φτάνει φυσικά το μάτι του επισκέπτη και να διατυπώνεται με βάση το αποτέλεσμα και όχι την ενέργεια. Το «Κλείσε δωρεάν κλήση» μετατρέπει καλύτερα από το «Επικοινωνία». Το «Δες τις τιμές» μετατρέπει καλύτερα από το «Μάθε περισσότερα». Κάθε σελίδα πρέπει να έχει μία καθαρή κύρια ενέργεια και να είναι αδύνατο να τη χάσεις.
Βελτίωσε τον χρόνο φόρτωσης
Κάθε επιπλέον δευτερόλεπτο που χρειάζεται μια σελίδα για να φορτώσει μειώνει το ποσοστό των επισκεπτών που μένουν να τη διαβάσουν. Οι αργές σελίδες κάνουν τους επισκέπτες να φεύγουν πριν δουν οποιοδήποτε περιεχόμενο, που σημαίνει ότι κάθε άλλη βελτίωση UX είναι άσχετη για αυτές τις συνεδρίες. Η συμπίεση εικόνων, η αναβολή των scripts που δεν χρειάζονται αμέσως και η αφαίρεση κώδικα που δεν χρησιμοποιείται πια είναι οι πιο συνηθισμένες διορθώσεις. Το άρθρο για τους τύπους διάταξης ιστοσελίδας εξηγεί πώς οι αποφάσεις διάταξης συνδέονται με το πόσο γρήγορα φορτώνει το ορατό περιεχόμενο.
Πώς ιεραρχείς ποιες βελτιώσεις UX θα κάνεις πρώτες;
Ξεκίνα με τις σελίδες που έχουν τη μεγαλύτερη επιχειρηματική αξία. Η αρχική, η κύρια σελίδα υπηρεσίας ή προϊόντος και η σελίδα επικοινωνίας ή πληρωμής είναι εκεί όπου φτάνουν οι περισσότεροι επισκέπτες και χάνονται οι περισσότερες μετατροπές. Μια βελτίωση UX σε μία από αυτές τις σελίδες φέρνει μεγαλύτερο όφελος από την ίδια βελτίωση σε μια σελίδα με χαμηλή κίνηση.
Μέσα σε αυτές τις σελίδες, διόρθωσε πρώτα τα προβλήματα που επηρεάζουν τον μεγαλύτερο αριθμό επισκεπτών. Μια ετικέτα πλοήγησης που μπερδεύει κάθε επισκέπτη που φτάνει επηρεάζει όλους. Ένα σφάλμα φόρμας που εμφανίζεται μόνο σε έναν συγκεκριμένο browser επηρεάζει πολύ λιγότερους. Η σειρά είναι: πρώτα οι σελίδες με πολλή κίνηση και μετά τα πιο συνηθισμένα εμπόδια μέσα σε αυτές.
Πώς μετράς αν οι βελτιώσεις UX δουλεύουν;
Μέτρα τη συγκεκριμένη συμπεριφορά που προσπαθούσες να αλλάξεις. Αν απλοποίησες μια φόρμα επικοινωνίας, μέτρα το ποσοστό συμπλήρωσης πριν και μετά. Αν αναδιαμόρφωσες την οπτική ιεραρχία μιας σελίδας, μέτρα το bounce rate και τον χρόνο στη σελίδα. Αν διόρθωσες μια διάταξη στο κινητό, μέτρα το ποσοστό μετατροπής στο κινητό για εκείνη τη σελίδα.
Οι αλλαγές στην εμπειρία χρήστη σπάνια δίνουν άμεσα αποτελέσματα. Δώσε σε κάθε αλλαγή δύο έως τέσσερις εβδομάδες πριν βγάλεις συμπεράσματα, ανάλογα με τον όγκο κίνησης της σελίδας. Οι σελίδες με χαμηλή κίνηση χρειάζονται περισσότερο χρόνο για να μαζέψουν αρκετά δεδομένα για μια ουσιαστική σύγκριση.
Πώς συνδέονται οι βελτιώσεις UX με το SEO;
Οι μηχανές αναζήτησης χρησιμοποιούν σήματα συμπεριφοράς για να κρίνουν αν οι σελίδες εξυπηρετούν καλά τους επισκέπτες τους. Οι σελίδες όπου οι επισκέπτες μένουν περισσότερο, κάνουν scroll πιο κάτω και ολοκληρώνουν ενέργειες δείχνουν συνάφεια και ποιότητα. Οι σελίδες με υψηλό bounce rate και χαμηλή συμμετοχή δείχνουν το αντίθετο. Οι βελτιώσεις UX που κρατούν τους επισκέπτες στη σελίδα και τους οδηγούν να ολοκληρώσουν εργασίες παράγουν τα σήματα συμπεριφοράς που στηρίζουν την κατάταξη με τον καιρό. Το άρθρο για το τι είναι το SEO εξηγεί πώς τα σήματα εμπειρίας χρήστη τροφοδοτούν την απόδοση στις αναζητήσεις.
Πώς χειρίζεται το WEMASY τις βελτιώσεις UX
Ο δημιουργός ιστοσελίδων του WEMASY σου επιτρέπει να προσαρμόζεις τη διάταξη, τη δομή πλοήγησης, τα πεδία φορμών και την ιεραρχία σελίδων μέσα από οπτικό επεξεργαστή, χωρίς να ξαναχτίζεις τις σελίδες από την αρχή. Οι προεπισκοπήσεις για κινητό και υπολογιστή δείχνουν την επίδραση των αλλαγών πριν δημοσιεύσεις. Τα πρότυπα φτιάχνονται με προεπιλογές UX που λύνουν τα πιο συνηθισμένα προβλήματα των επαγγελματικών ιστοσελίδων, ώστε οι βελτιώσεις να γίνονται σε συγκεκριμένα στοιχεία αντί να ξεκινάς από την αρχή.
Δες τι περιλαμβάνεται στον δημιουργό ιστοσελίδων του WEMASY ή δες τα πακέτα στη σελίδα τιμών.
Συχνές ερωτήσεις
Από πού να ξεκινήσω όταν βελτιώνω το UX της ιστοσελίδας μου;
Ξεκίνα με τη σελίδα σου που έχει τη μεγαλύτερη κίνηση και έναν καθαρό στόχο με μετρήσιμο αποτέλεσμα. Για τις περισσότερες επαγγελματικές ιστοσελίδες, αυτή είναι η αρχική ή η κύρια σελίδα υπηρεσίας. Εντόπισε το ένα εμπόδιο σε αυτή τη σελίδα που επηρεάζει τους περισσότερους επισκέπτες: ασαφής τίτλος, θαμμένο κουμπί δράσης, μπερδεμένη πλοήγηση ή αργή φόρτωση. Διόρθωσε πρώτα αυτό το ένα, μέτρα το αποτέλεσμα και προχώρα στο επόμενο. Αν προσπαθήσεις να βελτιώσεις τα πάντα μαζί, δεν θα ξέρεις τι δουλεύει. Με τον δημιουργό ιστοσελίδων του WEMASY, μπορείς να το στήσεις κατευθείαν στην ιστοσελίδα σου.
Χρειάζονται οι βελτιώσεις UX πλήρη ανασχεδιασμό της ιστοσελίδας;
Σπάνια. Τα περισσότερα προβλήματα UX είναι συγκεκριμένα ζητήματα σε συγκεκριμένες σελίδες και όχι δομικές αποτυχίες που απαιτούν να ξαναχτιστεί ολόκληρη η ιστοσελίδα. Η απλοποίηση των ετικετών πλοήγησης, η βελτίωση των μηνυμάτων σφάλματος σε φόρμες, η προσαρμογή της οπτικής ιεραρχίας μιας βασικής σελίδας ή η διόρθωση ενός προβλήματος διάταξης στο κινητό μπορούν όλα να γίνουν χωρίς ανασχεδιασμό. Ένας πλήρης ανασχεδιασμός αξίζει να εξεταστεί όταν η δομή της ιστοσελίδας δεν ταιριάζει πια με τον τρόπο που λειτουργεί η επιχείρηση, όταν η πλατφόρμα δεν μπορεί να υποστηρίξει τις αλλαγές που χρειάζονται ή όταν τα προβλήματα UX είναι τόσο διάχυτα που η διόρθωσή τους ένα προς ένα θα έπαιρνε περισσότερο από το να ξαναχτίσεις.
Πόσο χρόνο παίρνει να δω αποτελέσματα από τις βελτιώσεις UX;
Εξαρτάται από τον όγκο κίνησης και τον τύπο της αλλαγής. Μια σελίδα με πολλή κίνηση και καθαρό μετρήσιμο αποτέλεσμα, όπως το ποσοστό συμπλήρωσης φόρμας επικοινωνίας, μπορεί να δείξει αποτελέσματα μέσα σε μία με δύο εβδομάδες. Μια σελίδα με χαμηλή κίνηση μπορεί να χρειαστεί έναν μήνα ή περισσότερο για να μαζέψει αρκετά δεδομένα για αξιόπιστη σύγκριση. Οι αλλαγές στην πλοήγηση και στην οπτική ιεραρχία τείνουν να δείχνουν αποτελέσματα πιο γρήγορα από αλλαγές που επηρεάζουν μόνο ένα μικρό τμήμα των επισκεπτών της σελίδας.
Ποια είναι η διαφορά ανάμεσα σε έλεγχο UX και δοκιμή χρηστικότητας;
Ο έλεγχος UX είναι μια αξιολόγηση από ειδικό της ιστοσελίδας με βάση καθιερωμένες αρχές και πρότυπα χρηστικότητας, που εντοπίζει προβλήματα με βάση τη γνώση του πώς συμπεριφέρονται συνήθως οι χρήστες. Η δοκιμή χρηστικότητας περιλαμβάνει την παρατήρηση πραγματικών χρηστών που ολοκληρώνουν εργασίες στην ιστοσελίδα και την καταγραφή του πού δυσκολεύονται. Οι έλεγχοι είναι πιο γρήγοροι και φθηνότεροι. Η δοκιμή χρηστικότητας είναι πιο ακριβής, γιατί αντανακλά το πώς συμπεριφέρονται πραγματικοί χρήστες και όχι το πώς προβλέπει ένας ειδικός ότι θα συμπεριφερθούν. Και τα δύο είναι πιο χρήσιμα από το τίποτα. Για ιστοσελίδες μικρών επιχειρήσεων, η δοκιμή χρηστικότητας με δύο ή τρεις πραγματικούς χρήστες αποκαλύπτει τα σημαντικότερα προβλήματα πιο γρήγορα από κάθε άλλη μέθοδο.
Μπορούν οι βελτιώσεις UX να αυξήσουν τις μετατροπές χωρίς περισσότερη κίνηση;
Ναι. Οι βελτιώσεις στο ποσοστό μετατροπής προέρχονται από το να διευκολύνεις τους υπάρχοντες επισκέπτες να ολοκληρώσουν την ενέργεια για την οποία ήρθαν. Μια ιστοσελίδα που μετατρέπει το 2 τοις εκατό των επισκεπτών της φέρνει διπλάσια leads με την ίδια κίνηση, αν το ποσοστό μετατροπής φτάσει το 4 τοις εκατό. Οι βελτιώσεις UX είναι από τους πιο άμεσους τρόπους να αυξήσεις τις μετατροπές χωρίς να αυξήσεις την κίνηση ή τα έξοδα διαφήμισης. Για επιχειρήσεις όπου η απόκτηση κίνησης είναι ακριβή, η βελτίωση αυτού που συμβαίνει αφού φτάσει ο επισκέπτης είναι συχνά η επένδυση με το μεγαλύτερο όφελος.