Ρώτα έναν επιχειρηματία τι ψάχνει σε μια καλή ιστοσελίδα και θα ακούσεις για καθαρό σχεδιασμό, γρήγορη φόρτωση και εύκολη πλοήγηση. Σπάνια αναφέρεται το αν οι επισκέπτες μπορούν πραγματικά να βρουν αυτό που χρειάζονται και να κάνουν αυτό για το οποίο ήρθαν. Το UX design είναι ο κλάδος που απαντά σε αυτή την ερώτηση και είναι η ποιότητα που κάνει όλες τις άλλες να μετράνε.
Το UX design, συντομογραφία του user experience design (σχεδιασμός εμπειρίας χρήστη), είναι η πρακτική του σχεδιασμού ιστοσελίδων γύρω από τον τρόπο που τις χρησιμοποιούν οι άνθρωποι. Τι είναι το UX design για μια επαγγελματική ιστοσελίδα; Είναι το σύνολο των αποφάσεων που καθορίζουν αν ένας επισκέπτης μπορεί να βρει αυτό που ψάχνει, να ολοκληρώσει την ενέργεια που ήρθε να κάνει και να φύγει με σαφή αντίληψη για το τι προσφέρει η επιχείρηση.
Μια ιστοσελίδα μπορεί να είναι οπτικά άψογη και να έχει κακό UX. Ένας επισκέπτης που δεν καταλαβαίνει τι κάνει μια επιχείρηση μέσα σε δέκα δευτερόλεπτα από την άφιξή του στην αρχική, που χάνεται ψάχνοντας τη σελίδα τιμών ή που εγκαταλείπει μια φόρμα επικοινωνίας επειδή τα μηνύματα σφάλματος δεν εξηγούν τι πήγε στραβά, έχει κακή εμπειρία χρήστη. Η οπτική ποιότητα της σελίδας δεν έχει καμία σημασία για αυτό το αποτέλεσμα.
Ποια είναι η διαφορά ανάμεσα στο UX design και το UI design;
Το UX design και το UI design σχετίζονται αλλά είναι ξεχωριστά. Το UI design, ή σχεδιασμός διεπαφής χρήστη, καλύπτει το οπτικό επίπεδο. Τα χρώματα, η τυπογραφία, τα κουμπιά, τα εικονίδια και η συνολική εμφάνιση της σελίδας είναι αποφάσεις UI. Το UX design καλύπτει το επίπεδο της συμπεριφοράς. Το πώς οργανώνεται η πληροφορία, πώς ρέει η πλοήγηση, τι γίνεται όταν ο χρήστης κάνει λάθος και αν η πιο σημαντική ενέργεια στη σελίδα είναι άμεσα εμφανής είναι αποφάσεις UX.
Στην πράξη, τα δύο επικαλύπτονται. Ένα κουμπί με λάθος χρώμα στην οπτική ιεραρχία είναι πρόβλημα UI που δημιουργεί πρόβλημα UX. Μια φόρμα με λογική διάταξη αλλά χωρίς καθοδήγηση για τα σφάλματα είναι πρόβλημα UX που μπορεί να εντοπίσει ένας σχεδιαστής UI. Σε μικρές ομάδες και στους δημιουργούς ιστοσελίδων, συχνά τα χειρίζεται και τα δύο ένας άνθρωπος. Η διάκριση μετράει γιατί απαιτούν διαφορετική σκέψη: το UI ρωτά «φαίνεται σωστό αυτό;» ενώ το UX ρωτά «δουλεύει αυτό για τον άνθρωπο που το χρησιμοποιεί;»
Το άρθρο τι είναι το web design καλύπτει τον ευρύτερο κλάδο μέσα στον οποίο βρίσκονται και το UX και το UI design, μαζί με το πώς συνδυάζονται οι οπτικές και οι δομικές αποφάσεις για να διαμορφώσουν την εμπειρία του επισκέπτη.
Ποιες είναι οι βασικές αρχές του UX design;
Το UX design καθοδηγείται από ένα σύνολο αρχών που ισχύουν σε κάθε τύπο ιστοσελίδας, ανεξάρτητα από κλάδο ή μέγεθος.
Ευχρηστία
Μια ιστοσελίδα με ευχρηστία επιτρέπει στους επισκέπτες να ολοκληρώνουν εργασίες αποδοτικά χωρίς σύγχυση. Οι ετικέτες της πλοήγησης χρησιμοποιούν τις λέξεις που περιμένουν οι επισκέπτες. Οι βασικές σελίδες είναι προσβάσιμες μέσα σε δύο ή τρία κλικ. Τα διαδραστικά στοιχεία όπως κουμπιά και φόρμες συμπεριφέρονται με προβλέψιμο τρόπο. Η ευχρηστία δεν σημαίνει να κάνεις μια σελίδα τόσο απλή που να είναι γυμνή. Σημαίνει να αφαιρείς την τριβή από τη διαδρομή προς το αποτέλεσμα που θέλει ο επισκέπτης.
Καθαρότητα
Καθαρότητα σημαίνει ότι κάθε σελίδα εκφράζει αμέσως τον σκοπό της. Ο επισκέπτης πρέπει να καταλαβαίνει μέσα σε δευτερόλεπτα για ποιο θέμα μιλά η σελίδα, τι μπορεί να κάνει εκεί και ποιο είναι το επόμενο βήμα. Οι σελίδες που θάβουν την πιο σημαντική πληροφορία κάτω από πυκνές παραγράφους, ή που χρησιμοποιούν διφορούμενες επικεφαλίδες και αόριστα κουμπιά ενέργειας, αποτυγχάνουν στην καθαρότητα, όσο καλά κι αν είναι σχεδιασμένες οπτικά. Το άρθρο τι είναι η οπτική ιεραρχία εξηγεί πώς η οργάνωση και το βάρος των στοιχείων σε μια σελίδα διαμορφώνουν το τι καταλαβαίνουν πρώτα οι επισκέπτες.
Συνέπεια
Ο συνεπής σχεδιασμός σημαίνει ότι οι επισκέπτες χρειάζεται να μάθουν μία μόνο φορά πώς δουλεύει η σελίδα. Αν το κύριο κουμπί ενέργειας είναι μπλε στην αρχική, πρέπει να είναι μπλε παντού. Αν η πλοήγηση εμφανίζεται στο πάνω μέρος της σελίδας σε υπολογιστή, πρέπει να είναι προσβάσιμη από το ίδιο σημείο σε κάθε σελίδα. Η ασυνέπεια σπάει το νοητικό μοντέλο που χτίζουν οι επισκέπτες καθώς κινούνται στη σελίδα και δημιουργεί σύγχυση ακριβώς τις στιγμές που μετράει περισσότερο μια καθαρή διαδρομή προς τα εμπρός.
Ανατροφοδότηση
Οι χρήστες πρέπει να ξέρουν ότι οι ενέργειές τους καταγράφηκαν. Ένα κουμπί που δεν δείχνει καμία αλλαγή όταν το πατάς, μια φόρμα που στέλνεται χωρίς επιβεβαίωση ή μια γραμμή αναζήτησης που επιστρέφει αποτελέσματα χωρίς ένδειξη του τι αναζήτησε, δημιουργούν αβεβαιότητα. Η ανατροφοδότηση μπορεί να είναι τόσο απλή όσο ένα κουμπί που αλλάζει χρώμα όταν περνάς από πάνω του, ένας δείκτης φόρτωσης όσο στέλνεται μια φόρμα ή ένα μήνυμα επιβεβαίωσης μετά από επιτυχημένη ενέργεια. Χωρίς αυτήν, οι επισκέπτες δεν ξέρουν αν πρέπει να περιμένουν, να ξαναδοκιμάσουν ή να υποθέσουν ότι κάτι πήγε στραβά.
Αποκατάσταση σφαλμάτων
Οι χρήστες κάνουν λάθη. Το καλό UX τα προβλέπει και κάνει εύκολη την αποκατάσταση. Ένας έλεγχος φόρμας που εντοπίζει το συγκεκριμένο πεδίο με πρόβλημα και εξηγεί πώς μοιάζει η σωστή μορφή είναι καλύτερος από ένα γενικό μήνυμα «κάτι πήγε στραβά». Μια αναζήτηση που δεν επιστρέφει αποτελέσματα αλλά προτείνει εναλλακτικές είναι καλύτερη από αδιέξοδο. Όσο πιο εύκολα αποκαθίσταται ένα σφάλμα, τόσο λιγότερο πιθανό είναι ο επισκέπτης να εγκαταλείψει εντελώς την εργασία.
Πώς επηρεάζει το UX design τα επιχειρηματικά αποτελέσματα;
Το UX design έχει άμεση σύνδεση με τα αποτελέσματα που νοιάζουν τις επιχειρήσεις. Ένας επισκέπτης που βρίσκει γρήγορα τη σελίδα τιμών είναι πιο πιθανό να φτάσει σε απόφαση αγοράς. Μια διαδικασία ολοκλήρωσης αγοράς με ελάχιστα βήματα και καθαρά μηνύματα σφάλματος μετατρέπει περισσότερους επισκέπτες από μια που απαιτεί μαντεψιές. Μια φόρμα επικοινωνίας που συμπληρώνεται εύκολα παίρνει περισσότερες υποβολές από μια που μπερδεύει ή παίρνει πολύ χρόνο.
Η σχέση ανάμεσα στο UX και τα ποσοστά μετατροπής είναι καλά τεκμηριωμένη. Μικρές βελτιώσεις στην καθαρότητα της σελίδας, στον σχεδιασμό των φορμών και στη ροή της πλοήγησης δίνουν μετρήσιμες αυξήσεις στο ποσοστό των επισκεπτών που κάνουν την ενέργεια που στοχεύεις. Ισχύει εξίσου και το αντίστροφο. Μια σελίδα όπου το κύριο κουμπί ενέργειας είναι δύσκολο να βρεθεί, όπου η πρόταση αξίας χρειάζεται τρεις παραγράφους για να φανεί ή όπου η διάταξη στο κινητό καταρρέει σε μη χρηστική κατάσταση θα χάνει μετατροπές σε κάθε βήμα.
Το UX επηρεάζει και το πώς αντιλαμβάνονται οι επισκέπτες την επιχείρηση πίσω από τη σελίδα. Μια ιστοσελίδα που δουλεύει καλά φαίνεται επαγγελματική και αξιόπιστη. Μια ιστοσελίδα με σπασμένες ροές, μπερδεμένη πλοήγηση και ασαφή μηνύματα δείχνει αμέλεια, όπως κι αν λειτουργεί η υπόλοιπη επιχείρηση. Το άρθρο πώς να σχεδιάσεις μια αρχική σελίδα που δουλεύει καλύπτει τις συγκεκριμένες αποφάσεις UX που μετράνε περισσότερο στη σελίδα που βλέπουν πρώτη οι επισκέπτες.
Ποια είναι τα πιο συνηθισμένα προβλήματα UX σε επαγγελματικές ιστοσελίδες;
Η έλλειψη καθαρής ιεραρχίας στη σελίδα είναι η πιο συχνή αποτυχία UX σε επαγγελματικές ιστοσελίδες. Όταν πολλά στοιχεία ανταγωνίζονται εξίσου για την προσοχή, οι επισκέπτες δεν έχουν σημείο εκκίνησης. Σαρώνουν χωρίς να διαβάζουν, δεν βρίσκουν το κουμπί ενέργειας και φεύγουν. Οι αποφάσεις οπτικής ιεραρχίας και διάταξης που ορίζουν καθαρή σειρά ανάγνωσης λύνουν αυτό το πρόβλημα άμεσα.
Μια πλοήγηση που απαιτεί μαντεψιές αναγκάζει τους επισκέπτες να εξερευνούν αντί να κινούνται με σκοπό. Ετικέτες μενού που σημαίνουν κάτι εσωτερικά αλλά τίποτα για έναν νέο επισκέπτη, αναπτυσσόμενα μενού που κρύβουν τις πιο χρήσιμες σελίδες και δομές πλοήγησης που δεν ταιριάζουν με τον τρόπο που σκέφτονται οι επισκέπτες την επιχείρηση, όλα δημιουργούν τριβή. Το άρθρο τι είναι η πλοήγηση ιστοσελίδας καλύπτει πώς να δομήσεις μενού που καθοδηγούν αντί να μπερδεύουν.
Οι φόρμες χωρίς καθοδήγηση είναι ένα ακόμα συνηθισμένο πρόβλημα. Υποχρεωτικά πεδία που δεν σημειώνονται καθαρά, πεδία που απορρίπτουν έγκυρες μορφές χωρίς να εξηγούν γιατί και φόρμες που καθαρίζουν όλα τα στοιχεία μετά από αποτυχημένη υποβολή είναι όλα εμπόδια που μειώνουν σημαντικά τα ποσοστά ολοκλήρωσης.
Ένα UX στο κινητό που δεν ταιριάζει με την πρόθεση του υπολογιστή είναι ένα κενό που κοστίζει επισκέψεις σε κάθε συνεδρία. Μια σελίδα υπολογιστή σχεδιασμένη με πολλές στήλες που μαζεύεται σε μία στήλη στο κινητό με τα στοιχεία σε λάθος σειρά δίνει διαφορετική εμπειρία από αυτή που είχε σχεδιαστεί. Το άρθρο πώς να κάνεις την ιστοσελίδα σου φιλική προς τα κινητά καλύπτει τις αποφάσεις διάταξης και αλληλεπίδρασης που καθορίζουν αν η εμπειρία στο κινητό δουλεύει εξίσου καλά με του υπολογιστή.
Πώς συνδέεται το UX design με το SEO;
Οι μηχανές αναζήτησης μετρούν τη συμπεριφορά των χρηστών για να αξιολογήσουν αν μια σελίδα προσφέρει αξία. Μια σελίδα με κακό UX τείνει να παράγει υψηλά ποσοστά εγκατάλειψης και χαμηλό χρόνο παραμονής, και τα δύο δείχνουν στις μηχανές αναζήτησης με τον καιρό ότι οι επισκέπτες δεν βρίσκουν αυτό που ήρθαν να βρουν. Μια σελίδα με δυνατό UX τείνει να κρατά τους επισκέπτες περισσότερο και να οδηγεί σε περισσότερες αλληλεπιδράσεις, παράγοντας τα σήματα συμπεριφοράς που στηρίζουν την κατάταξη.
Η προσβασιμότητα της σελίδας, που σχετίζεται στενά με το UX, επηρεάζει επίσης το πόσο αξιόπιστα μπορούν οι μηχανές αναζήτησης να σαρώσουν και να καταχωρίσουν μια σελίδα. Μια σελίδα που πλοηγείται με πληκτρολόγιο και είναι χτισμένη με σημασιολογικό HTML καταχωρίζεται πιο εύκολα με ακρίβεια από μια με δομικά προβλήματα. Το άρθρο τι είναι το SEO καλύπτει πώς τα σήματα εμπειρίας χρήστη τροφοδοτούν την απόδοση στις αναζητήσεις και ποιοι παράγοντες συμπεριφοράς μετράνε περισσότερο.
Πώς χειρίζεται το WEMASY το UX design
Τα πρότυπα του δημιουργού ιστοσελίδων του WEMASY χτίζονται με τις αρχές UX ως αφετηρία. Η ιεραρχία των επικεφαλίδων, η τοποθέτηση των κουμπιών ενέργειας, η δομή της πλοήγησης, ο σχεδιασμός των φορμών και οι διατάξεις για κινητά είναι ορισμένα σε προεπιλογές που αντικατοπτρίζουν το πώς χρησιμοποιούν πραγματικά οι επισκέπτες τις επαγγελματικές ιστοσελίδες. Ο οπτικός επεξεργαστής σου επιτρέπει να προσαρμόζεις κάθε στοιχείο και να βλέπεις το αποτέλεσμα σε πραγματικό χρόνο, σε υπολογιστή και κινητό, πριν τη δημοσίευση. Οι αλλαγές στη διάταξη δεν απαιτούν να ξαναχτίσεις τη σελίδα από την αρχή.
Δες τι περιλαμβάνεται στον δημιουργό ιστοσελίδων του WEMASY ή δες τα πακέτα στη σελίδα τιμών.
Συχνές ερωτήσεις
Χρειάζομαι σχεδιαστή UX για να χτίσω μια καλή ιστοσελίδα;
Όχι απαραίτητα. Ένας δημιουργός ιστοσελίδων με καλοσχεδιασμένα πρότυπα καλύπτει τις πιο συνηθισμένες αποφάσεις UX στο επίπεδο του προτύπου, οπότε δεν ξεκινάς από το μηδέν στην αρχιτεκτονική πληροφορίας, στην ιεραρχία επικεφαλίδων ή στη διάταξη για κινητά. Εκεί που ένας σχεδιαστής UX προσθέτει τη μεγαλύτερη αξία είναι στο να καταλαβαίνει πώς συμπεριφέρεται ένα συγκεκριμένο κοινό και να δοκιμάζει αν συγκεκριμένες ροές δουλεύουν όπως προβλέπεται. Για τις περισσότερες ιστοσελίδες μικρών επιχειρήσεων, η εφαρμογή αρχών UX μέσα από ένα καλοφτιαγμένο πρότυπο δίνει σημαντικά καλύτερα αποτελέσματα από το να αγνοείς εντελώς το UX, ακόμα και χωρίς ειδικό. Με τον δημιουργό ιστοσελίδων του WEMASY, μπορείς να το ρυθμίσεις απευθείας στην ιστοσελίδα σου.
Τι είναι η δοκιμή ευχρηστίας;
Η δοκιμή ευχρηστίας σημαίνει να παρατηρείς πραγματικούς χρήστες καθώς προσπαθούν να ολοκληρώσουν εργασίες σε μια ιστοσελίδα. Ο στόχος είναι να εντοπίσεις πού μπερδεύονται οι επισκέπτες, πού διστάζουν και πού αποτυγχάνουν να κάνουν αυτό για το οποίο ήρθαν. Μπορεί να είναι τόσο απλή όσο το να ζητήσεις από έναν συνάδελφο να βρει τη σελίδα τιμών και να δεις πού κάνει κλικ, ή τόσο οργανωμένη όσο μια καταγεγραμμένη συνεδρία με κοινή χρήση οθόνης και έναν συντονιστή. Ακόμα και μια άτυπη δοκιμή με δύο ή τρία άτομα που δεν έχουν ξαναδεί τη σελίδα αποκαλύπτει τα πιο σημαντικά κενά ευχρηστίας.
Ποια είναι η διαφορά ανάμεσα στο UX design και το web design;
Το web design είναι ο ευρύτερος κλάδος που καλύπτει και το πώς φαίνεται μια ιστοσελίδα και το πώς δουλεύει. Το UX design είναι το υποσύνολο του web design που εστιάζει ειδικά στην εμπειρία του ανθρώπου που χρησιμοποιεί τη σελίδα. Ένας web designer παίρνει αποφάσεις για χρώμα, τυπογραφία, διάταξη και οπτική ιεραρχία μαζί με αποφάσεις για πλοήγηση, αρχιτεκτονική πληροφορίας και σχεδιασμό αλληλεπίδρασης. Όταν αυτές οι αποφάσεις που αφορούν την αλληλεπίδραση παίρνουν ιδιαίτερη προσοχή και δοκιμάζονται απέναντι στην πραγματική συμπεριφορά των χρηστών, η πρακτική αυτή λέγεται UX design.
Πώς καταλαβαίνεις αν η ιστοσελίδα σου έχει προβλήματα UX;
Τα πιο καθαρά σήματα έρχονται από τα δεδομένα συμπεριφοράς των χρηστών. Υψηλά ποσοστά εγκατάλειψης σε βασικές σελίδες, χαμηλά ποσοστά ολοκλήρωσης φορμών, μικρός χρόνος παραμονής σε περιεχόμενο που θα έπρεπε να διαβάζεται περισσότερο και υψηλά ποσοστά εγκατάλειψης στις διαδικασίες ολοκλήρωσης αγοράς δείχνουν προβλήματα UX. Αν παρακολουθήσεις έναν πρωτοεπισκέπτη να πλοηγείται στη σελίδα χωρίς καθοδήγηση, βλέπεις πού γίνεται η σύγχυση. Η άμεση ανατροφοδότηση από πελάτες που αναφέρουν δυσκολία να βρουν κάτι ή που τα παρατούν σε μια εργασία είναι εξίσου διαγνωστική. Δεν χρειάζεσαι πλατφόρμα analytics για να ξεκινήσεις. Το να παρακολουθήσεις έναν άνθρωπο να προσπαθεί να χρησιμοποιήσει τη σελίδα είναι συχνά αρκετό για να εντοπίσεις τα πιο σημαντικά προβλήματα.
Ποια είναι η σχέση ανάμεσα στο UX design και το ποσοστό μετατροπής;
Το ποσοστό μετατροπής μετρά το ποσοστό των επισκεπτών που ολοκληρώνουν μια επιθυμητή ενέργεια, όπως η συμπλήρωση φόρμας, μια αγορά ή η κράτηση μιας κλήσης. Το UX design επηρεάζει άμεσα αυτόν τον αριθμό, γιατί καθορίζει πόσο εύκολη ή δύσκολη είναι η ολοκλήρωση αυτής της ενέργειας. Η αφαίρεση περιττών βημάτων από μια διαδικασία αγοράς, το να ξεχωρίζει οπτικά το κύριο κουμπί ενέργειας, η απλοποίηση των πεδίων φόρμας και η βελτίωση των μηνυμάτων σφάλματος αυξάνουν την πιθανότητα ένας επισκέπτης που σκοπεύει να μετατραπεί να το κάνει πράγματι. Η σχέση είναι άμεση: το καλύτερο UX μειώνει την τριβή και η λιγότερη τριβή δίνει υψηλότερα ποσοστά μετατροπής.