Jump to content

User:RexxS/AltText

From Wikipedia, the free encyclopedia

This is just a page used to check what html the MediaWiki software produces given different alt values in the image syntax.

Best practice

[edit]

Alt has a value

[edit]
A red arrow pointing to top right.
  • [[File:Pfeil rechts oben rot.svg|right|100px|alt=A red arrow pointing to top right.]]

This has alt text in the html as expected: A red arrow pointing to top right.

This is the preferred way of proving a meaningful alt for a linked, informative image

Alt is set to null

[edit]
  • [[File:Pfeil rechts oben rot.svg|right|100px|alt=]]

This has the alt attribute in the html without a value: <img alt="" src="//upload.wikimedia.org/wikipedia/commons/thumb/b/bf/Pfeil_rechts_oben_rot.svg/100px-Pfeil_rechts_oben_rot.svg.png">

Oddly enough, if you look at the html using the "inspect element" function in Chrome (Ctrl-Shift-I) it shows as <img alt src="...">, while examining the source (Ctrl-U) shows as above. This isn't significant.

I believe that most screen readers would ignore that. As there is no title set in the html, a screen reader may read out the filename as it is almost always linked to the image description page because we normally have to provide attribution.

This is the preferred way of proving a 'null' alt for a linked, decorative image.

[edit]
  • [[File:Pfeil rechts oben rot.svg|right|100px|alt=|link=]]

For a purely decorative image that does not require attribution, this is the correct syntax.

There is no alt text and no link, so a screen reader will ignore it completely.

This is the preferred way of proving a 'null' alt for an unlinked, decorative image

Deprecated options

[edit]

Alt is set to empty string

[edit]
""
  • [[File:Pfeil rechts oben rot.svg|right|100px|alt=""]]

This has alt text in the html consisting of two quotation marks:"" (alt="&quot;&quot;") and I would expect some screen readers to announce them if punctuation is enabled.

Do not use.

Alt is omitted

[edit]
  • [[File:Pfeil rechts oben rot.svg|right|100px]]

This has alt text in the html set to the filename: Pfeil rechts oben rot.svg.

We really shouldn't be inflicting this sort of thing on screen reader users.

Do not use.

Alt is omitted, but caption is specified

[edit]
Some caption
Some caption
  • [[File:Pfeil rechts oben rot.svg|right|100px|Some caption]]

alt inherits the value of the caption.

Do not use.

Alt interpreted as a caption

[edit]
alt
alt
  • [[File:Pfeil rechts oben rot.svg|right|100px|alt]]

In this example, the sting "alt" is first interpreted as a caption, then the alt is set to be the same as the caption: alt.

Do not use.

Note

[edit]

N.B. For those used to wrting html, remember that we have to use |alt=, not |alt="", as in the latter case the MediaWiki software will provide alt text equal to two quote marks. Similarly, don't write |link="" as that would provide a link like this: <a href="/wiki/%22%22">.