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

Τελευταία ενημέρωση: 20/5/2024

Περιεχόμενα

1. Εισαγωγή
2. Ελεγκτής προσβασιμότητας (Accessibility checker)
3. Βοηθός αναγνώστη οθόνης (Screenreader helper)
4. Εισαγωγή εναλλακτικού κειμένου (alt text) σε εικόνα

Εισαγωγή

Καθώς δημιουργείτε τα κείμενά σας, για οποιαδήποτε δραστηριότητα ή πόρο του ηλεκτρονικού σας μαθήματος, μπορείτε να ελέγχετε αν τα όσα καταχωρείτε στον Atto text editor  διευκολύνουν την Προσβασιμότητα χρησιμοποιώντας τα εικονίδια  Accessibility checker και  Screenreader helper, όπως φαίνονται σε κόκκινο πλαίσιο στην επόμενη εικόνα.

Ελεγκτής προσβασιμότητας (Accessibility checker)

Κάνοντας κλικ στο εικονίδιο  Accessibility checker θα λάβετε σε αναδυόμενο παράθυρο μια αναφορά Προσβασιμότητας για τα περιεχόμενα που έχετε καταχωρήσει στον Atto text editor. Το εργαλείο Accessibility checker προσπαθεί να εντοπίσει στο περιεχόμενο που ελέγχει κοινά προβλήματα όπως:

• εικόνες που δε συνοδεύονται από εναλλακτικό κείμενο (alt text), με εξαίρεση τις εικόνες που έχουν επισημανθεί ως διακοσμητικού ρόλου,

• χρωματικούς συνδυασμούς φόντου και γραμματοσειράς που δεν ακολουθούν τη προδιαγραφή WCAG AA,

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

• πίνακες που δε συνοδεύονται από λεζάντες ή περιέχουν συγχωνευμένα κελιά ή δεν έχουν κεφαλίδες στις γραμμές ή τις στήλες τους.

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

Βοηθός αναγνώστη οθόνης (Screenreader helper)

Κάνοντας κλικ στο εικονίδιο Screenreader helper θα λάβετε σε αναδυόμενο παράθυρο μια αναφορά για τα περιεχόμενα που έχετε καταχωρήσει στον Atto text editor, στην οποία θα βρείτε:

• πληροφορίες σχετικά με τα html στυλ που εφαρμόζονται στο κείμενο που έχετε επιλέξει (ή αν δεν έχετε επιλέξει κάποιο κείμενο τότε στη σειρά όπου βρίσκεται ο δρομέας),

• μια λίστα των συνδέσμων (hyperlinks) που θα εντοπιστούν στο σύνολο των περιεχομένων του Atto text editor,

• μια λίστα των εικόνων που θα εντοπιστούν στο σύνολο των περιεχομένων του Atto text editor.

Χρησιμοποιώντας το Screenreader helper μπορείτε να αντιληφθείτε άμεσα πως εμφανίζεται ένας σύνδεσμος χωρίς τα συμφραζόμενά του. Αυτό μπορεί να σας παρακινήσει να μη χρησιμοποιείτε κείμενα συνδέσμων όπως το "κάντε κλικ εδώ" ώστε τα κείμενά σας να είναι περισσότερο προσβάσιμα.

Επιπλέον, χρησιμοποιώντας το Screenreader helper μπορείτε να αντιληφθείτε άμεσα πως όταν οι χρήστες/ριες χρησιμοποιούν έναν αναγνώστη οθόνης οι εικόνες σας αντικαθίσταται από τα εναλλακτικά κείμενα (alt text). Παρατηρώντας την αντίστοιχη λίστα μπορείτε να εντοπίσετε αν χρειάζονται βελτιώσεις στα εναλλακτικά κείμενα ή αν κάπου δεν έχετε εισάγει ήδη εναλλακτικό κείμενο να προχωρήσετε στην συμπλήρωσή του.

Στην εικόνα που ακολουθεί βλέπετε ένα παράδειγμα αναφοράς του Screenreader helper.

Εισαγωγή εναλλακτικού κειμένου (alt text) σε εικόνα

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

Για κάθε εικόνα που έχετε εισάγει στον Atto text editor μπορείτε να κάνετε διπλό κλικ επάνω της ώστε να εμφανιστεί το αναδυόμενο παράθυρο Ιδιότητες εικόνας (Image properties), όπως φαίνεται στην επόμενη εικόνα. Στη συνέχεια, πληκτρολογείστε το εναλλακτικό κείμενο της εικόνας στο πλαίσιο Περιγραφή εικόνας για κάποιον που δεν μπορεί να την δει (Describe this image for someone who cannot see it). Τέλος, πατήστε Αποθήκευση εικόνας (Save image).