Προσιτότητα
Μια σύντομη επισκόπηση των δυνατοτήτων και των περιορισμών του Bootstrap για τη δημιουργία προσβάσιμου περιεχομένου.
Το Bootstrap παρέχει ένα εύχρηστο πλαίσιο έτοιμων στυλ, εργαλείων διάταξης και διαδραστικών στοιχείων, επιτρέποντας στους προγραμματιστές να δημιουργούν ιστοτόπους και εφαρμογές που είναι οπτικά ελκυστικές, λειτουργικά πλούσιες και προσβάσιμες από το κουτί.
Η συνολική προσβασιμότητα οποιουδήποτε έργου που έχει δημιουργηθεί με το Bootstrap εξαρτάται σε μεγάλο βαθμό από τη σήμανση του συγγραφέα, το πρόσθετο στυλ και το σενάριο που έχει συμπεριλάβει. Ωστόσο, υπό τον όρο ότι αυτά έχουν εφαρμοστεί σωστά, θα πρέπει να είναι απολύτως δυνατή η δημιουργία ιστοτόπων και εφαρμογών με Bootstrap που πληρούν το WCAG 2.0 (A/AA/AAA), την ενότητα 508 και παρόμοια πρότυπα και απαιτήσεις προσβασιμότητας.
Το στυλ και η διάταξη του Bootstrap μπορούν να εφαρμοστούν σε ένα ευρύ φάσμα δομών σήμανσης. Αυτή η τεκμηρίωση στοχεύει να παρέχει στους προγραμματιστές παραδείγματα βέλτιστων πρακτικών για να καταδείξουν τη χρήση του ίδιου του Bootstrap και να απεικονίσουν την κατάλληλη σημασιολογική σήμανση, συμπεριλαμβανομένων τρόπων με τους οποίους μπορούν να αντιμετωπιστούν πιθανά προβλήματα προσβασιμότητας.
Τα διαδραστικά στοιχεία του Bootstrap—όπως τα modal dialogs, τα αναπτυσσόμενα μενού και οι προσαρμοσμένες συμβουλές εργαλείων— έχουν σχεδιαστεί για να λειτουργούν για χρήστες αφής, ποντικιού και πληκτρολογίου. Μέσω της χρήσης των σχετικών ρόλων και χαρακτηριστικών WAI - ARIA , αυτά τα στοιχεία θα πρέπει επίσης να είναι κατανοητά και λειτουργικά με χρήση υποστηρικτικών τεχνολογιών (όπως προγράμματα ανάγνωσης οθόνης).
Επειδή τα στοιχεία του Bootstrap έχουν σχεδιαστεί σκόπιμα για να είναι αρκετά γενικά, οι συγγραφείς μπορεί να χρειαστεί να συμπεριλάβουν περαιτέρω ρόλους και χαρακτηριστικά ARIA , καθώς και συμπεριφορά JavaScript, για να μεταφέρουν με μεγαλύτερη ακρίβεια την ακριβή φύση και τη λειτουργικότητα του στοιχείου τους. Αυτό συνήθως σημειώνεται στην τεκμηρίωση.
Τα περισσότερα χρώματα που αποτελούν αυτήν τη στιγμή την προεπιλεγμένη παλέτα του Bootstrap—που χρησιμοποιούνται σε όλο το πλαίσιο για πράγματα όπως παραλλαγές κουμπιών, παραλλαγές ειδοποίησης, δείκτες επικύρωσης φόρμας—οδηγούν σε ανεπαρκή χρωματική αντίθεση (κάτω από την προτεινόμενη αναλογία αντίθεσης χρώματος WCAG 2.0 4,5:1 ) όταν χρησιμοποιούνται έναντι ανοιχτό φόντο. Οι συγγραφείς θα πρέπει να τροποποιήσουν/επεκτείνουν χειροκίνητα αυτά τα προεπιλεγμένα χρώματα για να εξασφαλίσουν επαρκείς λόγους χρωματικής αντίθεσης.
Περιεχόμενο που θα πρέπει να είναι οπτικά κρυμμένο, αλλά να παραμένει προσβάσιμο σε βοηθητικές τεχνολογίες, όπως προγράμματα ανάγνωσης οθόνης, μπορεί να διαμορφωθεί χρησιμοποιώντας την .sr-onlyτάξη. Αυτό μπορεί να είναι χρήσιμο σε περιπτώσεις όπου πρόσθετες οπτικές πληροφορίες ή συνθήματα (όπως νόημα που υποδηλώνεται μέσω της χρήσης χρώματος) πρέπει επίσης να μεταδοθούν σε μη οπτικούς χρήστες.
<p class="text-danger">
<span class="sr-only">Danger: </span>
This action is not reversible
</p>Για οπτικά κρυφά διαδραστικά στοιχεία ελέγχου, όπως οι παραδοσιακοί σύνδεσμοι "παράβλεψης", .sr-onlyμπορούν να συνδυαστούν με την .sr-only-focusableτάξη. Αυτό θα διασφαλίσει ότι το στοιχείο ελέγχου γίνεται ορατό μόλις εστιαστεί (για χρήστες πληκτρολογίου με όραση).
<a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>Το Bootstrap περιλαμβάνει υποστήριξη για τη prefers-reduced-motionδυνατότητα πολυμέσων . Σε προγράμματα περιήγησης/περιβάλλοντα που επιτρέπουν στον χρήστη να προσδιορίσει την προτίμησή του για μειωμένη κίνηση, τα περισσότερα εφέ μετάβασης CSS στο Bootstrap (για παράδειγμα, όταν ανοίγει ή κλείνει ένας τρόπος διαλόγου) θα απενεργοποιηθούν. Επί του παρόντος, η υποστήριξη περιορίζεται στο Safari σε macOS και iOS.