User:Colin/Alt

From Wikipedia, the free encyclopedia
Jump to navigation Jump to search

This page experiments with different image formats and combinations of alt and caption text.

The "Image Alt" column shows the "<img alt=..." attribute contents. MediaWiki guarantees there is always an "alt=" attribute in the HTML so if it is blank in this table then it is present and blank.

The "Link Title" column shows the "<a title=..." attribute of the hyperlink that is followed when the image is clicked. This attribute appears as a tooltip in Internet Explorer but does not seem to be used by Firefox. It is not read out by screen readers. For the thumbnail and frame images, there is never a title attribute for the image hyperlink but the little/big box icon has a title "Enlarge", which appears as a tooltip on Internet Explorer.

I've chosen to refer to the last parameter in the File (or Image) wiki markup as the "unnamed parameter". Most of the Wiki help calls this the "caption", which is misleading as it isn't always the caption text.

What this experiment shows is that regardless of the image format (plain, no-link, thumb or frame) it is possible to have complete control over the alt text HTML attribute.

However, based on Comments made by Eubulides, it appears that if the HTML alt attribute is blank and the image is a link then the screen reader will read out the filename. Since all thumbnail images are links, and thumbnail images are the most common form of image used on WP, this makes it impossible to have empty alt text read out for many images.

TODO: Confirm that link title attributes are not read out by screen readers. Confirm that the image filename is read out for link images with empty alt attributes.

DONE: FANGS confirms that the link title attributes are ignored and confirms that the image filename (e.g. "slash Green underline check.png", not the "File colon Green check.png" in the markup) is read out when the HTML alt attribute is blank (or a &nbsp;) but the image is wrapped in a link. Damn.

Plain[edit]

Number Image Wiki Image Alt Link Title Comment
1.1 Green check.png [[File:Green check.png]] Green check.png The filename is used for the alt text.
1.2 Alt/Title text [[File:Green check.png|Alt/Title text]] Alt/Title text Alt/Title text The unnamed parameter is used for the alt text and the link title.
1.3 Alt text [[File:Green check.png|alt=Alt text|Title text]] Alt text Title text The unnamed parameter is used for the link title.
1.4 Alt text [[File:Green check.png|alt=Alt text]] Alt text
1.5 [[File:Green check.png|alt=|Title text]] Title text The unnamed parameter is used for the link title.
1.6 [[File:Green check.png|alt=]]

Plain, no link to image page[edit]

Number Image Wiki Image Alt Comment
2.1 Blue check.png [[File:Blue check.png|link=]] Blue check.png The filename is used for the alt text.
2.2 Alt text [[File:Blue check.png|link=|Alt text]] Alt text The unnamed parameter is used for the alt text.
2.3 Alt text [[File:Blue check.png|link=|alt=Alt text|Not used text]] Alt text The unnamed parameter is not used.
2.4 Alt text [[File:Blue check.png|link=|alt=Alt text]] Alt text
2.5 [[File:Blue check.png|link=|alt=|Not used text]] The unnamed parameter is not used. This image is completely ignored by a screen reader.
2.6 [[File:Blue check.png|link=|alt=]] This image is completely ignored by a screen reader.

Thumb[edit]

Number Image Wiki Alt Caption Comment
3.1
Green check.png
[[File:Green check.png|thumb]] Green check.png The filename is used for the alt text.
3.2
Caption text
[[File:Green check.png|thumb|Caption text]] Caption text The unnamed parameter is used for the caption.
3.3
Alt text
Caption text
[[File:Green check.png|thumb|alt=Alt text|Caption text]] Alt text Caption text The unnamed parameter is used for the caption.
3.4
Alt text
[[File:Green check.png|thumb|alt=Alt text]] Alt text
3.5
Caption text
[[File:Green check.png|thumb|alt=|Caption text]] Caption text The unnamed parameter is used for the caption.
3.6
[[File:Green check.png|thumb|alt=]]
3.7
 
[[File:Green check.png|thumb|alt=&nbsp;]] (space)
3.8
-
[[File:Green check.png|thumb|alt=-]] -

Frame[edit]

Number Image Wiki Alt Caption Comment
4.1
Orange check.png
[[File:Orange check.png|frame]] Green check.png The filename is used for the alt text.
4.2
Caption text
[[File:Orange check.png|frame|Caption text]] Caption text The unnamed parameter is used for the caption.
4.3
Alt text
Caption text
[[File:Orange check.png|frame|alt=Alt text]] Alt text Caption text The unnamed parameter is used for the caption.
4.4
Alt text
[[File:Orange check.png|frame|alt=Alt text]] Alt text
4.5
Caption text
[[File:Orange check.png|frame|alt=|Caption text]] Caption text The unnamed parameter is used for the caption.
4.6
[[File:Orange check.png|frame|alt=]]

Frameless[edit]

Number Image Wiki Image Alt Link Title Comment
5.1 Green check.png [[File:Green check.png|frameless]] Green check.png The filename is used for the alt text.
5.2 Alt/Title text [[File:Green check.png|frameless|Alt/Title text]] Alt/Title text Alt/Title text The unnamed parameter is used for the alt text and the link title.
5.3 Alt text [[File:Green check.png|frameless|alt=Alt text|Title text]] Alt text Title text The unnamed parameter is used for the link title.
5.4 Alt text [[File:Green check.png|frameless|alt=Alt text]] Alt text
5.5 [[File:Green check.png|frameless|alt=|Title text]] Title text The unnamed parameter is used for the link title.
5.6 [[File:Green check.png|frameless|alt=]]