Das ALT-Attribut im IMG-Tag
Hier noch mal das ALT-Attribut in Kurzform.
! Ohne geht es nicht, aber es muss nicht immer gefüllt sein !
Das ALT-Attribut wird in grafischen Browsern angezeigt, wenn die Grafik nicht geladen werden kann oder als Tooltip im IE.
Das ALT-Attribut ist eine Pflichteingabe, ist die Grafik nur zur optischen Gestalltung der Seite gedacht, sollte es leer bleiben, das diese Texte im Textbrowser stören.
Kurz erklärt:
1. Ohne ALT-Attribut wird der Dateiname angezeigt. (FALSCH)
2. Nicht relevante Grafik mit Text im ALT-Attribut. (FALSCH)
3. Mit leerem ALT-Attribut wird nichts angezeigt.
4. Der Text im ALT-Attribut wird in Textbrowsern und im IE als Tooltip angezeigt.
5. Um den Tooltip in allen Browsern anzuzeigen muss zusätzlich der Text im TITLE-Attribut eingegeben werden.
6. Um den Tooltip zu unterdrücken wird zum gefüllten ALT-Attribut ein leeres TITLE-Attribut mit eingegeben, dieses hat Vorrang im IE.
Hier der Quelltext der Grafiken:
1. <img src="unwichtig.jpg" width="100" height="40">
2. <img src="unwichtig.jpg" width="100" height="40" alt="unwichtige Grafik">
3. <img src="unwichtig.jpg" width="100" height="40" alt="">
4. <img src="wichtig.jpg" width="100" height="40" alt="wichtige Grafik">
5. <img src="wichtig.jpg" width="100" height="40" alt="wichtige Grafik" title="wichtige Grafik">
6. <img src="wichtig.jpg" width="100" height="40" alt="wichtige Grafik" title="">
Hier die Grafiken, im IE sollte bei 4. und 5. der Tooltip auftauchen, in anderen Browsern nur bei Grafik 5., Grafik 6 sollte trotz Text im ALT-Attribut keinen Tooltip im IE anzeigen.
1.
2.
3.
4.
5.
6.
Das Ergebnis im Textbrowser
Besonderheit Imaga Map:
Hier sollte das ALT-Attribut unbedingt gefüllt sein, da der Tooltip der eigentlichen Grafik, im Image Map aber störend ist, kann man hier einfach das leere TITLE-Attribut verwenden, um den Tooltip zu unterbinden.