Έλεγχος προσβασιμότητας
Σύντομη απάντηση
Ελέγξτε τη σελίδα, όπως αποδίδεται, με τους κανόνες WCAG 2.1 A και AA που ελέγχονται αυτόματα, μαζί με την αντίθεση χρωμάτων. Κάθε πρόβλημα παραπέμπει στο κριτήριο WCAG και στην απαίτηση της Ευρωπαϊκής Πράξης για την Προσβασιμότητα.
Τι δεν κάνει: Οι αυτόματοι κανόνες βρίσκουν μόνο μέρος των προβλημάτων WCAG: η χρήση με πληκτρολόγιο, το νόημα, οι υπότιτλοι και πολλά άλλα κριτήρια θέλουν άνθρωπο, οπότε το αποτέλεσμα δεν είναι ποτέ ετυμηγορία συμμόρφωσης, και περιεχόμενο που χτίζουν scripts μπορεί να λείπει.
Ελέγχει τη σελίδα, όπως αποδίδεται, ως προς τους κανόνες Επιπέδου A και AA του WCAG 2.1 που μπορεί να ελέγξει λογισμικό.
Σελίδα υπό έλεγχο
Τι Κάνει
Αποδίδει τη σελίδα στο πρόγραμμα περιήγησής σας και την ελέγχει ως προς τους κανόνες WCAG 2.1 Επιπέδου A και AA που μπορεί να ελέγξει λογισμικό: αντίθεση χρωμάτων του αποδιδόμενου κειμένου, ονόματα κουμπιών, συνδέσμων και πεδίων φόρμας, εναλλακτικά κείμενα εικόνων, επικεφαλίδες και ορόσημα, χρήση ARIA και γλώσσα σελίδας, μεταξύ άλλων. Κάθε πρόβλημα βαθμολογείται ανάλογα με τη σοβαρότητά του, εμφανίζει τα στοιχεία που επηρεάζει και τι πρέπει να διορθωθεί, και παραπέμπει στο κριτήριο επιτυχίας WCAG και στην απαίτηση του Παραρτήματος Ι της Ευρωπαϊκής Πράξης για την Προσβασιμότητα (Οδηγία 2019/882) με τα οποία σχετίζεται. Οι έλεγχοι που απαιτούν ανθρώπινη κρίση παρατίθενται ξεχωριστά.
Γιατί Έχει Σημασία
Η Ευρωπαϊκή Πράξη για την Προσβασιμότητα εφαρμόζεται από τις 28 Ιουνίου 2025 σε πολλά ψηφιακά προϊόντα και υπηρεσίες που πωλούνται στην ΕΕ, ενώ κάθε κράτος μέλος καθορίζει και επιβάλλει τις δικές του κυρώσεις. Πέρα από τη νομοθεσία, τα προβλήματα προσβασιμότητας αποκλείουν πραγματικούς επισκέπτες. Ένας αυτοματοποιημένος έλεγχος είναι ο ταχύτερος τρόπος για να εντοπίσετε τις προφανείς αστοχίες πριν από μια χειροκίνητη επισκόπηση.
Πώς Λειτουργεί
-
Εισαγάγετε το URL μιας σελίδας ή επικολλήστε τον κώδικα HTML της
-
Το RankProof ανακτά τον κώδικα HTML· το πρόγραμμα περιήγησής σας τον αποδίδει με τα στυλ και τις εικόνες του ίδιου του ιστότοπου, χωρίς να εκτελεί τα scripts της σελίδας
-
Μια μηχανή κανόνων ανοιχτού κώδικα ελέγχει την αποδιδόμενη σελίδα ως προς τους κανόνες WCAG 2.1 A και AA
-
Τα προβλήματα επιστρέφονται ταξινομημένα ανά σοβαρότητα, με τα στοιχεία που επηρεάζουν, τι πρέπει να διορθωθεί και τις αναφορές στα WCAG και EAA
Δείγμα εισόδου + εξόδου
url: https://rankproof.eu
Έλεγχος προσβασιμότητας (κανόνες WCAG 2.1 A και AA): Δεν υπάρχουν ζητήματα που μπορούν να εντοπίσουν οι αυτοματοποιημένοι κανόνες Κανόνες που πέρασαν: 22 · Χρειάζονται έλεγχο από άνθρωπο: 1 Χρειάζεται έλεγχος από άνθρωπο χρωματική αντίθεση · WCAG 1.4.3 · EAA I.2.c
Πώς διαβάζεται το αποτέλεσμα
- Σύνοψη (κανένα ζήτημα στο rankproof.eu στο δείγμα)
- Το πλήθος των ζητημάτων και των στοιχείων της σελίδας που επηρεάζουν, ή μια γραμμή που λέει ότι οι αυτοματοποιημένοι κανόνες δεν βρήκαν τίποτα. Στο δείγμα ο έλεγχος δεν βρήκε κανένα ζήτημα στο rankproof.eu. Αυτό δεν είναι ετυμηγορία συμμόρφωσης: οι κανόνες καλύπτουν μόνο μέρος του WCAG 2.1 AA.
- Σοβαρότητα: κρίσιμο, σοβαρό, μέτριο, μικρό
- Κάθε ζήτημα φέρει τη βαθμολογία σοβαρότητας της ίδιας της μηχανής κανόνων, και τα ζητήματα εμφανίζονται από το σοβαρότερο. Τα κρίσιμα και σοβαρά συνήθως μπλοκάρουν ή καθυστερούν πολύ κάποιους χρήστες — ένα κουμπί χωρίς όνομα, κείμενο πολύ αχνό — οπότε ξεκινήστε από εκεί.
- Στοιχεία που επηρεάζονται
- Κάτω από κάθε ζήτημα, τα στοιχεία που απέτυχαν, ως HTML, με το τι πρέπει να αλλάξει. Ένα ζήτημα συχνά καλύπτει πολλά στοιχεία από το ίδιο πρότυπο, οπότε μία διόρθωση μπορεί να τα λύσει όλα.
- Αναφορές WCAG και EAA
- Κάθε ζήτημα συνδέει το κριτήριο επιτυχίας του WCAG 2.1 που ελέγχει και το σημείο της λίστας ελέγχου μας για την Ευρωπαϊκή Πράξη Προσβασιμότητας στο οποίο ανήκει, που δείχνει από ποιο μέρος της Οδηγίας προκύπτει — για τη χρωματική αντίθεση, WCAG 1.4.3 και EAA I.2.c.
- Κανόνες που πέρασαν (22)
- Πόσοι κανόνες εφαρμόστηκαν σε αυτή τη σελίδα χωρίς να βρουν πρόβλημα. Ο αριθμός αλλάζει από σελίδα σε σελίδα: μια σελίδα χωρίς φόρμα δεν τρέχει τους κανόνες για φόρμες.
- Χρειάζεται έλεγχος από άνθρωπο (1)
- Περιπτώσεις που οι κανόνες δεν μπόρεσαν να κρίνουν μόνοι τους, για παράδειγμα κείμενο πάνω σε εικόνα. Στο δείγμα είναι η χρωματική αντίθεση (WCAG 1.4.3): για κάποιο κείμενο η μηχανή δεν μπόρεσε να προσδιορίσει το φόντο, οπότε αυτό το ζεύγος θέλει έλεγχο με το μάτι ή με τον έλεγχο χρωματικής αντίθεσης.
- Προεπισκόπηση
- Η σελίδα όπως την απέδωσε ο browser σας για τον έλεγχο, χωρίς να τρέξουν τα scripts της. Αν είναι σχεδόν άδεια, η σελίδα μάλλον φτιάχνεται με JavaScript και το εργαλείο το λέει: επικολλήστε τότε το αποδοσμένο HTML.
Ποιοι το Χρησιμοποιούν
-
Επιχειρηματίας στην ΕΕ
Εκτελέστε έναν βασικό έλεγχο τώρα που ισχύει ο EAA και δείτε ποιες αστοχίες WCAG πρέπει να διορθωθούν πρώτες.
-
Σύμβουλος προσβασιμότητας
Κάντε μια γρήγορη πρώτη αξιολόγηση σε μια σελίδα πελάτη, με τα προβλήματα ομαδοποιημένα ανά σοβαρότητα και αντιστοιχισμένα σε απαιτήσεις του EAA, πριν από τη χειροκίνητη επισκόπηση.
-
Προγραμματιστής ιστού
Επαναλάβετε τον έλεγχο σε σελίδες staging πριν από κάθε έκδοση, ώστε να εντοπίζετε οπισθοδρομήσεις προσβασιμότητας πριν φτάσουν σε παραγωγή.
Συχνά προβλήματα και πώς λύνονται
-
Εικόνες χωρίς εναλλακτικό κείμενο (WCAG 1.1.1)
Δώστε στις πληροφοριακές εικόνες alt που λέει τι δείχνουν ή τι κάνουν, και στις διακοσμητικές alt="". Μια εικόνα μέσα σε σύνδεσμο ή κουμπί χρειάζεται alt που λέει τον προορισμό ή την ενέργεια.
<img src="/signups.png" alt="Bar chart: sign-ups doubled from March to June"> <img src="/divider.svg" alt=""> -
Κείμενο με πολύ χαμηλή αντίθεση (WCAG 1.4.3)
Σκουρύνετε το κείμενο ή ανοίξτε το φόντο ώσπου το κανονικό κείμενο να φτάσει 4,5:1 και το μεγάλο 3:1. Αλλάξτε το χρώμα στο θέμα σας και όχι σε μεμονωμένα στοιχεία, ώστε να ακολουθήσουν όλα τα στοιχεία.
:root { --text: #1f2937; /* 14.7:1 on #ffffff */ --text-muted: #595959; /* 7.0:1 on #ffffff */ } -
Πεδία φόρμας χωρίς ετικέτα (WCAG 1.3.1, 4.1.2)
Συνδέστε ένα ορατό <label> με κάθε πεδίο μέσω for και id. Ένα placeholder δεν είναι ετικέτα: εξαφανίζεται μόλις αρχίσει κανείς να γράφει.
<label for="email">Email address</label> <input id="email" name="email" type="email" autocomplete="email"> -
Κουμπιά και σύνδεσμοι χωρίς όνομα (WCAG 4.1.2, 2.4.4)
Ένα κουμπί μόνο με εικονίδιο χρειάζεται εναλλακτικό κείμενο: ορατό κείμενο, alt στην εικόνα του ή aria-label. Το κείμενο ενός συνδέσμου πρέπει να λέει πού οδηγεί, όχι «πατήστε εδώ».
<button type="button" aria-label="Close menu"> <svg aria-hidden="true" focusable="false">…</svg> </button> -
Δεν ορίζεται γλώσσα σελίδας (WCAG 3.1.1)
Ορίστε lang στο στοιχείο <html> με τη γλώσσα της σελίδας, ώστε οι αναγνώστες οθόνης να την προφέρουν σωστά, και lang σε κάθε απόσπασμα σε άλλη γλώσσα.
<html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> -
Όσα δεν μπορούν να ελέγξουν οι κανόνες
Χρησιμοποιήστε μόνο το πληκτρολόγιο για να φτάσετε και να χειριστείτε κάθε στοιχείο ελέγχου, ελέγξτε ότι η εστίαση φαίνεται, ότι τα βίντεο έχουν υπότιτλους και ότι τα μηνύματα σφάλματος λένε πώς διορθώνεται η καταχώριση. Η λίστα χειροκίνητων ελέγχων στη σελίδα των απαιτήσεων EAA τα συγκεντρώνει.
Συχνές Ερωτήσεις
- Τι είναι το WCAG 2.1;
- Οι Οδηγίες Προσβασιμότητας Περιεχομένου Ιστού (Web Content Accessibility Guidelines) 2.1 είναι το πρότυπο του W3C για την προσβασιμότητα ιστού. Στην ΕΕ, το εναρμονισμένο πρότυπο EN 301 549 v3.2.1 εφαρμόζει το WCAG 2.1 Επίπεδο AA στο περιεχόμενο ιστού, γι' αυτό και αυτό το εργαλείο ελέγχου χρησιμοποιεί τους κανόνες 2.1 A και AA.
- Τι είναι η Ευρωπαϊκή Πράξη για την Προσβασιμότητα;
- Η Οδηγία (ΕΕ) 2019/882 θεσπίζει απαιτήσεις προσβασιμότητας για πολλά προϊόντα και υπηρεσίες που πωλούνται στην ΕΕ, όπως το ηλεκτρονικό εμπόριο, οι τραπεζικές υπηρεσίες και τα ηλεκτρονικά βιβλία. Εφαρμόζεται από τις 28 Ιουνίου 2025.
- Τι δεν εντοπίζει ο αυτοματοποιημένος έλεγχος;
- Αρκετά. Οι αυτοματοποιημένοι κανόνες εντοπίζουν μόνο ένα μέρος των προβλημάτων: αν το εναλλακτικό κείμενο έχει νόημα, αν η σειρά ανάγνωσης είναι λογική, αν οι υπότιτλοι είναι ακριβείς. Η αναφορά παραθέτει τα στοιχεία που χρειάζονται ανθρώπινο έλεγχο, και η σελίδα απαιτήσεων του EAA περιλαμβάνει μια λίστα χειροκίνητων ελέγχων. Αντιμετωπίστε τη σάρωση ως πρώτο βήμα και έπειτα δοκιμάστε με πληκτρολόγιο και αναγνώστη οθόνης.
- Ελέγχει την αντίθεση χρωμάτων;
- Ναι, για κείμενο πάνω σε συμπαγή φόντα στην αποδιδόμενη σελίδα. Το κείμενο πάνω σε εικόνες ή διαβαθμίσεις χρώματος δεν μπορεί να μετρηθεί αυτόματα και καταγράφεται ως στοιχείο που χρειάζεται χειροκίνητο έλεγχο. Για ένα μεμονωμένο ζεύγος χρωμάτων, χρησιμοποιήστε τον Έλεγχο Αντίθεσης Χρωμάτων.
- Λειτουργεί σε ιστότοπους που βασίζονται σε JavaScript;
- Μόνο εν μέρει. Τα scripts της σελίδας δεν εκτελούνται, οπότε το περιεχόμενο που προσθέτει η JavaScript μετά τη φόρτωση λείπει από τη σάρωση. Η αναφορά σάς προειδοποιεί όταν μια σελίδα αποδίδεται με σχεδόν καθόλου κείμενο.
- Ποια είναι η διαφορά μεταξύ WCAG 2.1 και 2.2;
- Το WCAG 2.2 προσθέτει εννέα κριτήρια επιτυχίας στο 2.1 και αφαιρεί ένα (4.1.1 Parsing). Τα νέα κριτήρια Επιπέδου AA περιλαμβάνουν τα Focus Not Obscured (2.4.11), Dragging Movements (2.5.7), Target Size (2.5.8) και Accessible Authentication (3.3.8). Το περιεχόμενο ιστού της ΕΕ αξιολογείται βάσει του WCAG 2.1 AA μέσω του EN 301 549 v3.2.1.
Πηγές
Η τεκμηρίωση στην οποία βασίζονται το εργαλείο και οι εξηγήσεις αυτής της σελίδας.
- Web Content Accessibility Guidelines (WCAG) 2.1 — W3C
- EN 301 549 V3.2.1: Accessibility requirements for ICT products and services — ETSI
- Directive (EU) 2019/882 (European Accessibility Act) — EUR-Lex
- Easy Checks – A First Review of Web Accessibility — W3C Web Accessibility Initiative
- Selecting Web Accessibility Evaluation Tools — W3C Web Accessibility Initiative