User:Colin/Alt

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

Number	Image	Wiki	Image Alt	Link Title	Comment
1.1		[[File:Green check.png]]	Green check.png		The filename is used for the alt text.
1.2		[[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		[[File:Green check.png|alt=Alt text|Title text]]	Alt text	Title text	The unnamed parameter is used for the link title.
1.4		[[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

Number	Image	Wiki	Image Alt	Comment
2.1		[[File:Blue check.png|link=]]	Blue check.png	The filename is used for the alt text.
2.2		[[File:Blue check.png|link=|Alt text]]	Alt text	The unnamed parameter is used for the alt text.
2.3		[[File:Blue check.png|link=|alt=Alt text|Not used text]]	Alt text	The unnamed parameter is not used.
2.4		[[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

Number	Image	Wiki	Alt	Caption	Comment
3.1		[[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	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		[[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= ]]	(space)
3.8		[[File:Green check.png|thumb|alt=-]]	-

Frame

Number	Image	Wiki	Alt	Caption	Comment
4.1		[[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	Caption text	[[File:Orange check.png|frame|alt=Alt text]]	Alt text	Caption text	The unnamed parameter is used for the caption.
4.4		[[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

Number	Image	Wiki	Image Alt	Link Title	Comment
5.1		[[File:Green check.png|frameless]]	Green check.png		The filename is used for the alt text.
5.2		[[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		[[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		[[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=]]