Πορτρέτο του Ξενοφών Απάκη
Ξενοφών Απάκης
Web designer και developer από το 1997

where ιστοσελίδα menu

where ιστοσελίδα menu

· Με δύο λόγια

Σύγκριση επάνω μενού, συμπτυγμένου μενού, πλευρικής πλοήγησης και υποσέλιδου με πρακτικό δέντρο απόφασης..

Πού πρέπει να βρίσκεται το μενού μιας ιστοσελίδας και ποια μορφή ταιριάζει σε κάθε περίπτωση

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

Επάνω οριζόντιο μενού για λίγες βασικές ενότητες

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

Συμπτυγμένο μενού σε κινητό χωρίς να κρύβονται όλα

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

Πλευρική πλοήγηση όταν το περιεχόμενο έχει πολλές βαθμίδες

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

Το υποσέλιδο είναι δεύτερη ευκαιρία, όχι δεύτερο κύριο μενού

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

Σταθερό μενού κατά την κύλιση

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

Δέντρο απόφασης για θέση και μορφή μενού

  1. Έχεις λίγες βασικές ενότητες; Προτίμησε καθαρό επάνω μενού.
  2. Υπάρχουν πολλές κατηγορίες με ιεραρχία; Εξέτασε συνδυασμό κύριας και πλευρικής πλοήγησης.
  3. Η χρήση γίνεται κυρίως από κινητό; Κράτησε συμπτυγμένο μενού, αλλά άφησε ορατές τις κρίσιμες ενέργειες.
  4. Έχεις μεγάλο άρθρο ή οδηγό; Χρησιμοποίησε τοπική πλοήγηση εντός σελίδας.
  5. Υπάρχουν πολλά νομικά ή βοηθητικά στοιχεία; Μετέφερέ τα στο υποσέλιδο.

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

Ονόματα επιλογών: σαφή πριν γίνουν «έξυπνα»

Τοποθεσία και σχεδίαση δεν αρκούν αν οι ετικέτες του μενού είναι ασαφείς. Λέξεις όπως «λύσεις», «εμπειρία» ή «ανακάλυψε» μπορεί να ακούγονται δημιουργικές αλλά να μην εξηγούν τι θα ανοίξει. Προτιμάμε ονόματα που ταιριάζουν στο νοητικό μοντέλο του επισκέπτη: Υπηρεσίες, Έργα, Σχετικά, Επικοινωνία, Κρατήσεις ή όποια αντίστοιχη έννοια είναι πραγματική για τον ιστότοπο. Αν χρειάζεται επεξήγηση για να καταλάβει ο χρήστης μια επιλογή, πιθανότατα η ονομασία πρέπει να βελτιωθεί.

Πώς συνδέεται το μενού με τη συνολική δομή

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

Ξεχωριστή ζώνη για λογαριασμό, αναζήτηση και γλώσσα

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

Έλεγχος κινδύνων πριν αλλάξει η πλοήγηση

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

Μικρό τεστ χρηστικότητας χωρίς εργαστήριο

Δώσε σε κάποιον που δεν γνωρίζει τη δομή τρεις απλές εργασίες: να βρει μια υπηρεσία, να εντοπίσει στοιχεία επικοινωνίας και να επιστρέψει στην αρχική. Μην του εξηγήσεις πού να πατήσει. Παρατήρησε πού διστάζει, ποια λέξη παρερμηνεύει και αν ανοίγει λάθος κατηγορία. Αυτό το μικρό τεστ αποκαλύπτει συχνά περισσότερα από μια συζήτηση για χρώματα ή εικονίδια. Αν δύο άτομα κάνουν το ίδιο λάθος, η καλύτερη αντίδραση είναι να διορθωθεί η πλοήγηση, όχι να θεωρηθεί ότι «δεν κατάλαβαν».

Πότε χρειάζεται δεύτερο επίπεδο πλοήγησης

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

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

Συμπέρασμα

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