#Παράδειγμα 8/8: Ειδοποίηση (alert)

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

Σημείωση 2: Accessibility tree (στα Ελληνικά: δέντρο προσβασιμότητας). Κάνει πληροφορίες διαθέσιμες που σχετίζονται με την προσβασιμότητα για τα περισσότερα στοιχεία της HTML. Οι φυλλομετρητές μετατρέπουν τη σήμανση σε μια εσωτερική αναπαράσταση που ονομάζεται δέντρο DOM. Το δέντρο DOM περιλαμβάνει τα αντικείμενα που αντιπροσωπεύουν όλα τα στοιχεία. Επίσης, τα χαρακτηριστικά και τους κόμβους κειμένου της σήμανσης. Στη συνέχεια, οι φυλλομετρητές δημιουργούν ένα δέντρο προσβασιμότητας με βάση το δέντρο DOM, το οποίο χρησιμοποιείται από το API Accessibility.

Το παράδειγμα "ειδοποιήση (alert)" [εξωτερικός σύνδεσμος, στα Αγγλικά] επιτρέπει στους χρήστες να πληκτρολογούν όρους ή να επιλέγουν όρους από μια λίστα πιθανών αντιστοιχίσεων που εμφανίζεται αφού ο χρήστης αρχίσει να πληκτρολογεί. Οι αναγνώστες οθόνης ανακοινώνουν τη διαθεσιμότητα των επιλογών εντός της λίστας και οι χρήστες μπορούν να επιλέξουν τις επιλογές με το πληκτρολόγιο, την αφή ή το ποντίκι.

Σημείωση: Η ενεργοποίηση ενός κουμπιού της φόρμας που ακολουθεί οδηγεί στη δημιουργία μηνύματος κατάστασης. Αυτό εμφανίζεται στην οθόνη και ανακοινώνετε από το πρόγραμμα ανάγνωσης οθόνης. Η εστίαση δε μετατοπίζεται. Σχετίζεται με το κριτήριο επιτυχίας 3.3.1 Προσδιορισμός σφαλμάτων. Η χρήση του ποντικιού ή/και του πληκτρολογίου είναι δυνατόν. Ο κώδικας του παραδείγματος "ειδοποίηση (alert)" είναι έτσι προγραμματισμένος, ώστε όλες οι συναρτήσεις να λειτουργούν απόλυτα ανεξάρτητα από το είδος της συσκευής.

Παράδειγμα για ειδοποιήσεις (alert) μέσω της HTML, της ARIA και της JavaScript

Ο πηγαίος κώδικας του παραδείγματος

Ακολουθεί ο πηγαίος κώδικας του παραδείγματος "ειδοποίηση (alert)" το οποίο δημιουργήθηκε μέσω των στοιχείων της HTML, <input>, <label>, <p>, <div>, της τεχνολογίας ARIA και της γλώσσας σεναρίων JavaScript.

Αυτό το αρχείο προσφέρει δωρεάν υλικό το οποίο αποτελείται από το HTML αρχείο και το αρχείο εντολών (JavaScript). Σας παρουσιάζουμε σε αυτό το παράδειγμα τη Δημιουργία φόρμας με "ειδοποιήσεις (alert)" για τη δημιουργία μηνυμάτων μέσω των στοιχείων της HTML, <input>, <label>, <p>, <div>, της τεχνολογίας ARIA και της γλώσσας JavaScript. Αφενός θέλουμε να κάνουμε τη σημασία του στοιχείου <button> της HTML γνωστή, και αφετέρου να απασχολήσουμε το ζήτημα της ανάπτυξης της φόρμας με "ειδοποίηση (alert)" μέσω της τεχνολογίας ARIA και της Javascript.

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

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

Λοιπόν, παρακάτω θα βρείτε τον σύνδεσμο για τη λήψη των πόρων σχετικά του παραδείγματος "Δημιουργία φόρμας με "ειδοποιήσεις (alert)" για τη δημιουργία μηνυμάτων μέσω του στοιχείων της HTML, input, label, p, div, της τεχνολογίας ARIA και της γλώσσας JavaScript". Κατέβασμα των πόρων για "ειδοποιήσεις (alert)". Σε μορφή ZIP