Πρότυπο WCAG 2.0 και τρόποι συμμόρφωσης (Web Expert) - Δημήτριος Σελημίδης

Σκοπός της παρουσίασης είναι η επεξήγηση του προτύπου WCAG 2.0 και πως μπορούμε να κάνουμε μια ιστοσελίδα σε WordPress συμβατό με αυτό.

Transcript

1. ΠΡΟΤΥΠΟ WCAG 2.0 ΚΑΙ ΤΡΟΠΟΙ ΣΥΜΜΟΡΦΩΣΗΣ ΔΗΜΗΤΡΙΟΣ ΣΕΛΗΜΙΔΗΣ
2. #WCGR2021 TOC TO TALK (WCAG 2.0) ▸ Βασικ έ ς Αρχ έ ς και Οδηγ ί ες ▸ Επίπεδα προσβασιμότητας 
 (Α, ΑΑ, ΑΑΑ) ▸ Εργαλεία ελέγχου ▸ Συμμόρφωση ιστοσελίδας
3. TO WCAG 2.0 ΔΕΝ ΕΙΝΑΙ ΕΝΑ ΠΡΟΣΘΕΤΟ… ΕΙΝΑΙ ΦΙΛΟΣΟΦΙΑ #WCGR2021
4. #WCGR2021 ▸ Μειωμ έ νη ακο ή και κ ώ φωση ▸ Μειωμ έ νη ό ραση και τ ύ φλωση ▸ Μαθησιακ έ ς δυσκολ ί ες ▸ Δυσκολ ί α στην ομιλ ί α ▸ Περιορισμ έ νη δυνατ ό τητα κ ί νησης ▸ Φωτοευαισθησ ί α ΠΡΟΣΒΑΣΙΜΟ ΠΕΡΙΕΧΟΜΕΝΟ ΣΕ
5. #WCGR2021 ▸ Αντιληπτ ό ▸ 1.1 Εναλλακτικό κείμενο ▸ 1.2 Μ έ σα εξαρτ ώ μενα απ ό το χρ ό νο ▸ 1.3 Προσαρμόσιμο ▸ 1.4 Διακριτ ό ΒΑΣΙΚΕΣ ΑΡΧΕΣ
6. #WCGR2021 ▸ Λειτουργικ ό ▸ 2.1 Προσβ ά σιμο μ έ σω πληκτρολογ ί ου ▸ 2.2 Επαρκ ή ς Χρ ό νος ▸ 2.3 Πρ ό ληψη κρ ί σεων επιληψ ί ας ▸ 2.4 Δυνατ ό τητα πλο ή γησης ΒΑΣΙΚΕΣ ΑΡΧΕΣ
7. #WCGR2021 ▸ Κατανοητ ό ▸ 3.1 Ευαν ά γνωστο περιεχ ό μενο ▸ 3.2 Προβλ έ ψιμο περιεχ ό μενο ▸ 3.3 Βο ή θεια στην εισαγωγ ή δεδομ έ νων ▸ Ε ύ ρωστο ▸ 4.1 Συμβατ ό ΒΑΣΙΚΕΣ ΑΡΧΕΣ
8. #WCGR2021
9. #WCGR2021
10. #WCGR2021
11. #WCGR2021 .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; over fl ow: hidden; clip: rect(0,0,0,0); white-space: nowrap; -webkit-clip- path: inset(50%); clip-path: inset(50%); border: 0; }
12. #WCGR2021
13. ΠΩΣ ΜΠΟΡΩ ΝΑ ΣΥΜΜΟΡΦΩΣΩ ΤΗΝ ΙΣΤΟΣΕΛΙΔΑ ΜΟΥ ΣΥΜΦΩΝΑ ΜΕ ΤΟ ΠΡΟΤΥΠΟ WCAG 2.0 WordPress User #WCGR2021
14. #WCGR2021 ▸ AChecker (EOL 30/04/2021) ▸ WAVE - https://wave.webaim.org ▸ axe DevTools - Browser Extension ▸ Firefox Accessibility Inspector ▸ Google Accessibility Developer Tools ΕΡΓΑΛΕΙΑ ΕΛΕΓΧΟΥ ΠΡΟΣΒΑΣΙΜΟΤΗΤΑΣ
15. #WCGR2021 ▸ Bootstrap 5 ▸ W3C HTML ▸ W3C CSS ΞΕΚΙΝΩΝΤΑΣ ΑΠΟ ΤΟ ΜΗΔΕΝ
16. #WCGR2021 ▸ Δημιουργία child theme ▸ Τροποποίηση αρχείων ▸ Γνώσεις ▸ HTML ▸ CSS ▸ PHP ΕΠΙΛΕΓΟΝΤΑΣ ΕΤΟΙΜΑ ΘΕΜΑΤΑ
17. #WCGR2021 ▸ Εικονίδια (i αντί span) ▸ Στοιχεία φόρμας χωρίς labels ▸ Εικόνες χωρίς alt ▸ Σύνδεσμοι χωρίς title ▸ Λάθος ιεραρχία επικεφαλίδων ▸ Κεφαλαία ΚΟΙΝΑ ΛΑΘΗ ΣΕ ΕΤΟΙΜΑ ΘΕΜΑΤΑ
18. #WCGR2021 ▸ Κανένα ΠΡΟΣΘΕΤΑ ΠΟΥ 100% ΑΠΟΤΕΛΕΣΜΑΤΙΚΑ
19. ΠΕΡΙΜΕΝΩ ΤΑ ΣΧΟΛΙΑ ΣΑΣ... Δημήτριος Σελημίδης