Διάταξη παραθύρων
- 8.2.1. Γενικά
- 8.2.2. Διάλογοι
- 8.2.3. Διάστιχο και στοίχιση
8.2.1. Γενικά
Τοποθέτηση των οπτικών συστατικών σε μια εφαρμογή είναι σημαντικό, επειδή οι σχέσεις μεταξύ στοιχείων εμφανίζονται από τις θέσεις τους. Αυτό καλείται "διάταξη" στον σχεδιασμό διεπαφής.
Μια καθαρή διάταξη είναι βασική για δημιουργία ομαλής οπτικής ροής της πληροφορίας στον χρήστη. Αυτή η ενότητα περιγράφει την κατάλληλη τοποθέτηση συστατικού και διακένου στις εφαρμογές GNOME. Τα κύρια εξεταζόμενα συστατικά είναι ετικέτες, εικονίδια, ραδιοπλήκτρα και πλαίσια ελέγχου, πεδία κειμένου, κουμπιά εντολών και πτυσσόμενα μενού.
8.2.2. Διάλογοι
Όταν ένας χρήστης σαρώνει έναν σύνθετο διάλογο προτιμήσεων που αποτελείται από πολλές ετικέτες και αντίστοιχα πλαίσια ελέγχου, πεδία κειμένου και πτυσσόμενα σύνθετα πλαίσια, είναι εύκολο να δείτε πώς μπορεί γρήγορα να εμποδιστεί από φτωχή διάταξη στον οπτικό σχεδιασμό. Για πληροφορίες διευθέτησης ειδοποιήσεων, δείτε Ενότητα 3.4.3 ― Διάστιχο και τοποθέτηση μέσα σε ειδοποιήσεις
Στο Φιγούρα 8-3, ο διάλογος στα αριστερά παρουσιάζει ετικέτες που δεν είναι στοιχισμένες αριστερά. Δεν δίνεται ένα κατάλληλο στήριγμα στο μάτι του χρήστη για να σαρώσει τον διάλογο γρήγορα.
Καθώς οι ετικέτες είναι όλες παρόμοιες σε μήκος, πρέπει να στοιχιστούν αριστερά. Τώρα ο χρήστης έχει ένα στέρεο αριστερό περιθώριο να στηρίξει το μάτι και να σαρώσει τη λίστα των στοιχείων κάθετα πιο εύκολα. Εάν οι περισσότερες ετικέτες σε μια ομάδα διαφέρουν πολύ σε μήκος, στοιχίστε τες δεξιά, έτσι ώστε οι έλεγχοι να μην τελειώνουν υπερβολικά μακριά από τις αντίστοιχες ετικέτες τους.
Η χρήση πλαισίων με ορατά περιγράμματα για διακριτές ομάδες μέσα σε ένα παράθυρο είναι παρωχημένη. Χρησιμοποιήστε διάκενο και έντονες κεφαλίδες. Αυτό είναι πιο αποτελεσματικό επειδή υπάρχουν λιγότερες περιττές γραμμές να αποσπάσουν τον χρήστη από το κύριο περιεχόμενο στο παράθυρο. Δείτε Ενότητα 6.19 ― Πλαίσια και διαχωριστές για περισσότερες λεπτομέρειες.
Δοκιμάστε να κρατήσετε τα συστατικά σύμφωνα μεταξύ τους σε όρους μεγέθους και στοίχισης. Αυτό είναι ιδιαίτερα σημαντικό μέσα σε μια ομάδα ελέγχων, έτσι ώστε η δυνατότητα του χρήστη για γρήγορη σάρωση πληροφοριών να μην θυσιάζεται. Ελαχιστοποιήστε όσο το δυνατό την ανάγκη το μάτι του χρήστη να κάνει άλματα όταν σαρώνει μια διάταξη.
- Αφήστε ένα περίγραμμα 12 εικονοστοιχείων μεταξύ της άκρης του παραθύρου και των πλησιέστερων ελέγχων.
- Αφήστε ένα οριζόντιο κενό 12 εικονοστοιχείων μεταξύ ενός ελέγχου και της ετικέτας του. (Το κενό μπορεί να είναι μεγαλύτερο για άλλους ελέγχους στην ίδια ομάδα, λόγω των διαφορών στα μήκη των ετικετών.)
- Οι ετικέτες πρέπει να είναι σύντομες και να έχουν νόημα όταν βγουν από το περιεχόμενο. Αλλιώς, οι χρήστες που στηρίζονται σε αναγνώστες οθόνης ή παρόμοιες τεχνολογίες υποβοήθησης δεν θα μπορούν απαραίτητα να καταλάβουν άμεσα τη σχέση μεταξύ ενός ελέγχου και αυτών που το περιβάλλουν.
- Δώστε πλήκτρα πρόσβασης σε όλους τους επεξεργάσιμους ελέγχους. Βεβαιωθείτε ότι η χρήση του πλήκτρου πρόσβασης εστιάζει στον συσχετισμένο του έλεγχο.
8.2.3. Διάστιχο και στοίχιση
Δώστε αρκετό χώρο μεταξύ ελέγχων και ομάδων ελέγχων. Αυτός ο κενός χώρος θα διευκολύνει τον χρήστη να βρει την απαιτούμενη πληροφορία.
- Ως ένας βασικός πρόχειρος κανόνας, αφήστε χώρο μεταξύ των συστατικών της διεπαφής χρήστη σε βήματα των 6 εικονοστοιχείων, αυξάνοντας καθώς η σχέση μεταξύ σχετικών στοιχείων γίνεται πιο μακρινή. Για παράδειγμα, μεταξύ ετικετών εικονιδίου και συσχετισμένων γραφικών μέσα σε ένα εικονίδιο, 6 εικονοστοιχεία είναι αρκετά. Μεταξύ ετικετών και συσχετισμένων συστατικών, αφήστε 12 οριζόντια εικονοστοιχεία. Για κάθετο διάκενο μεταξύ ομάδων συστατικών, 18 εικονοστοιχεία είναι αρκετά. Μια γενική συμπλήρωση 12 εικονοστοιχείων συνιστάται μεταξύ των περιεχομένων ενός παραθύρου διαλόγου και των περιγραμμάτων παραθύρου.
- Διαιρέστε μεγάλες λίστες επιλογών σε μικρότερες ομάδες. Για λίστες μικρότερες από περίπου οκτώ στοιχεία, χρησιμοποιήστε ραδιοπλήκτρα ή πλαίσια ελέγχου. Για μεγαλύτερες λίστες, χρησιμοποιήστε έναν έλεγχο λίστας ή πτυσσόμενη λίστα.
- Δοκιμάστε να κρατήσετε τα στοιχεία του ίδιου τύπου αριστερά στοιχισμένα μεταξύ τους. Για παράδειγμα, στους Φιγούρα 8-4, οι τίτλοι ομάδας (γενικά και ενέργειες) είναι αριστερά στοιχισμένοι και μεταξύ τους.
- Βάλτε εσοχή 12 εικονοστοιχείων στα μέλη ομάδας εσοχής για να δείξουν ιεραρχία και σχέση.
- Ελαχιστοποιήστε τον αριθμό των σημείων στοίχισης στο παράθυρό σας. Ένα σημείο ευθυγράμμισης είναι μια φανταστική κάθετη ή οριζόντια γραμμή μέσα από το παράθυρό σας που ακουμπά την άκρη μιας ή περισσότερων ετικετών ή ελέγχων στο παράθυρο.
- Η δεξιά στοίχιση μέσα στις ομάδες του γενικού παραθύρου (όπως δείχνει η γραμμή με ετικέτα "στοίχιση" στο Φιγούρα 8-4 είναι ευχάριστη στο μάτι, αλλά όχι βασική.
- Τακτοποιήστε τα συστατικά από αριστερά προς τα δεξιά, από πάνω προς τα κάτω. Γενικά, το πρώτο στοιχείο που ο χρήστης πρέπει να αντιμετωπίσει είναι στα επάνω αριστερά και το τελευταίο στα κάτω δεξιά. Να θυμόσαστε ότι όταν τοπικοποιείτε για μη δυτικά τοπικά, οι διεπαφές μπορεί να αντιστραφούν έτσι ώστε να διαβάζονται από δεξιά προς τα αριστερά.
- Χρησιμοποιώντας "λευκό" ή κενό διάστημα και εσοχή για σκιαγράφηση ομάδων είναι πιο καθαρό και προτιμητέο από τη χρήση γραφικών διαχωριστών όπως τα πλαίσια.
- Στοιχίστε τους ελέγχους στη διάταξή σας ακριβώς. Το μάτι είναι πολύ ευαίσθητο σε στοιχισμένα ή όχι αντικείμενα. Εάν τίποτα δεν ευθυγραμμίζεται με κάτι άλλο σε ένα παράθυρο, θα είναι πολύ δύσκολο για τον χρήστη να σαρώσει τα περιεχόμενα και να βρει την πληροφορία που θέλει. Δύο πράγματα που σχεδόν ευθυγραμμίζονται, αλλά όχι πλήρως, αποσπούν εξίσου.
- Να είστε συνεπής. Χρησιμοποιήστε το ίδιο διάκενο, στοίχιση και μεγέθη συστατικού σε όλους τους διαλόγους που εμφανίζονται στην εφαρμογή σας. Τα κουμπιά και , για παράδειγμα, πρέπει όλα να εμφανίζονται ακριβώς 12 εικονοστοιχεία κάθετα και οριζόντια από την κάτω δεξιά γωνία κάθε παραθύρου διαλόγου.
- Βεβαιωθείτε ότι φωτεινές και σκοτεινές περιοχές καθώς και διάκενο είναι εξίσου κατανεμημένα γύρω από το παράθυρο. Να θυμόσαστε ότι κάθε έλεγχος ή ομάδα ελέγχων στο παράθυρο σας έχει ένα οπτικό "βάρος", ανάλογα με το συνολικό του μέγεθος, χρώμα και πόσο κενό χώρο περιλαμβάνει. Πιο σκοτεινές, μεγαλύτερες περιοχές είναι "πιο βαριές", ενώ πιο χλομές, μικρότερες περιοχές είναι "ελαφριές".
- Μην σχεδιάζετε παράθυρα που είναι μεγαλύτερα από 50% στο μήκος σε μια διάσταση από ότι στην άλλη. Τα άτομα είναι πιο άνετα κοιτώντας σε παράθυρα και διαλόγους των οποίων οι διαστάσεις παραμένουν μέσα στον χρυσό κανόνα (περίπου 1,6 έως 1), ένας λόγος που καλλιτέχνες και αρχιτέκτονες χρησιμοποιούν για να δημιουργήσουν αισθητικά ευχάριστους πίνακες και κατασκευές για χιλιάδες χρόνια.