Η ιδιότητα alt παρέχει μια εναλλακτική κείμενο που περιγράφει το περιεχόμενο ή τη λειτουργία της εικόνας. Χρησιμεύει σε χρήστες και εργαλεία που δεν μπορούν να δουν την εικόνα.
html
<img src="chart.png" alt="Sales grew 40% from Q1 to Q2" />
Η ιδιότητα alt παρέχει μια εναλλακτική κείμενο που περιγράφει το περιεχόμενο ή τη λειτουργία της εικόνας. Χρησιμεύει σε χρήστες και εργαλεία που δεν μπορούν να δουν την εικόνα.
<img src="chart.png" alt="Sales grew 40% from Q1 to Q2" />
alt κείμενο δυνατά, έτσι ένας τυφλός χρήστης γνωρίζει τι μεταφέρει η εικόνα. Χωρίς αυτό, ακούν το όνομα του αρχείου ή απλώς "εικόνα" — άχρηστο.alt αντί για ένα σπασμένο εικονίδιο εικόνας.alt για να κατανοούν και να ευρετηριάζουν εικόνες (εικόνα SEO).<!-- ✅ describe the MEANING, not "image of..." -->
<img src="dog.jpg" alt="A golden retriever catching a frisbee" />
<!-- ✅ for functional images, describe the ACTION -->
<a href="/home"><img src="logo.png" alt="Acme home" /></a>
<!-- ✅ DECORATIVE images get an EMPTY alt so screen readers skip them -->
<img src="divider.png" alt="" />
alt="" (κενό, αλλά παρόν) είναι σημαντικό: λέει στα προγράμματα ανάγνωσης οθόνης "αυτό είναι διακοσμητικό, αγνοήστε το." Παράλειψη alt εντελώς είναι διαφορετικό — τότε το πρόγραμμα ανάγνωσης ενδέχεται να ανακοινώσει το όνομα του αρχείου.
alt είναι το μόνο σημαντικότερο χαρακτηριστικό προσβασιμότητας για εικόνες και νομική απαίτηση σύμφωνα με τα πρότυπα προσβασιμότητας (WCAG).
Κάνει το περιεχόμενο αντιληπτό σε χρήστες που δεν βλέπουν, παρέχει ένα fallback όταν οι εικόνες σπάνε και βοηθά στη SEO — περιγράψτε τι σημαίνει η εικόνα στο πλαίσιο και χρησιμοποιήστε alt="" για καθαρά διακοσμητικές εικόνες.