Definition lists with images as bullets Screen reader compatibility

Expected Result: causes problems in some screen readers

Actual Result: causes problems in 70 screen reader / browser combinations

For expected failures, the results show which AT combos the failures affect. Results are recorded from the user's viewpoint, so describe the user impact of authoring errors.

Code used for this test:

		<dl>
		   <dd><img src='img16x16.png' alt='* '>Audrey</dd>
		   <dd><img src='img16x16.png' alt='* '>Laurie</dd>
		   <dd><img src='img16x16.png' alt='* '>Alice</dd>
		</dl>
	

Change History

Last updated: September 11, 2022

• NVDA with Chrome Causes problems from NVDA 2018.4 to NVDA 2022.2
• NVDA with IE Causes problems from NVDA 2014.1 to NVDA 2019.2
• NVDA with FF Causes problems in NVDA 2022.2
• JAWS with Chrome Causes problems from JAWS 2018.1811.2 to JAWS 2022.2207.25
• JAWS with IE Causes problems from JAWS 13.0.852 to JAWS 2019.1912.1
• JAWS with FF Causes problems from JAWS 13.0.852 to JAWS 2022.2207.25
• VoiceOver macOS Causes problems in VoiceOver macOS 12.5
• VoiceOver iOS Causes problems from VoiceOver iOS 7.1 to VoiceOver iOS 15.6
• WindowEyes with IE Causes problems from WindowEyes 8.4 to WindowEyes 9.2
• Dolphin with IE Causes problems in Dolphin SR 15.05
• SaToGo with IE Causes problems in SaToGo 3.4.96.0

Screen reader	Browser	Mode	Notes	What the user hears
NVDA 2022.2	Chrome 105	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2022.2	FF102	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2022.2	Edge 105	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2021.2	Chrome 94	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2021.2	FF91	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2021.2	Edge 94	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2020.2	Chrome 86	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2020.2	FF78	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2020.2	Edge 92	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2019.2	Chrome 79	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2019.2	FF68	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2019.2	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2018.4	Chrome 73	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2018.4	FF60	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2018.4	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2017.3	FF60	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2017.3	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2016.2	FF48	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2016.2	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2015.2	FF41	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2015.2	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
NVDA 2014.1	FF29	Reading		List with three items. Audrey. Laurie. Alice.
NVDA 2014.1	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	List with three items, graphic star, Audrey. Graphic star, Laurie. Graphic star, Alice.
JAWS 2022.2207.25	Chrome 105	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2022.2207.25	FF102	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2022.2207.25	Edge 105	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2021.2107.12	Chrome 94	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2021.2107.12	FF91	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2021.2107.12	Edge 94	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2020.2008.24	Chrome 86	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2020.2008.24	FF78	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2020.2008.24	Edge 92	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2019.1912.1	Chrome 79	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2019.1912.1	FF68	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2019.1912.1	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Star graphic. Audrey. Star graphic. Laurie. Star graphic. Alice.
JAWS 2018.1811.2	Chrome 73	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 2018.1811.2	FF60	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 2018.1811.2	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 18.0.5038	FF52	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 18.0.5038	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 17.0.2619	FF48	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 17.0.2619	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 16.0.4350	FF41	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 16.0.4350	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 15.0.9023	FF29	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 15.0.9023	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 14.0.9002	FF29	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 14.0.9002	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 13.0.852	FF29	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
JAWS 13.0.852	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Graphic star. Audrey. Graphic star. Laurie. Graphic star. Alice.
WindowEyes 9.2	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	D list with 3 items, star. Audrey. D star. Laurie. D star. Alice.
WindowEyes 8.4	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Star. Audrey. Star. Laurie. Star. Alice.
VoiceOver macOS 12.5	Safari 15.6	Reading	Image bullets cause extra noise which makes list harder to understand.	Description list 3 items. Star, image 1 of 3. Audrey. Star, image 2 of 3. Laurie. Star, image 3 of 3. Alice.
VoiceOver macOS 11.5	Safari 15.0	Reading	Image bullets cause extra noise which makes list harder to understand.	Description list 3 items. Star, image 1 of 3. Audrey. Star, image 2 of 3. Laurie. Star, image 3 of 3. Alice.
VoiceOver macOS 10.15	Safari 14.1	Reading	Image bullets cause extra noise which makes list harder to understand.	Description list 3 items. Star, image 1 of 3. Audrey. Star, image 2 of 3. Laurie. Star, image 3 of 3. Alice.
VoiceOver macOS 10.14	Safari 13.0	Reading	Image bullets cause extra noise which makes list harder to understand.	Description list 3 items. Star, image 1 of 3. Audrey. Star, image 2 of 3. Laurie. Star, image 3 of 3. Alice.
VoiceOver macOS 10.13	Safari 12.1	Reading	Image bullets cause extra noise which makes list harder to understand.	Description list 3 items. Star, image 1 of 3. Audrey. Star, image 2 of 3. Laurie. Star, image 3 of 3. Alice.
VoiceOver macOS 10.12	Safari 10.1.2	Reading	Image bullets cause extra noise which makes list harder to understand.	Description list 3 items. Star, image 1 of 3. Audrey. Star, image 2 of 3. Laurie. Star, image 3 of 3. Alice.
VoiceOver macOS 10.11	Safari 9.1.2	Reading	Image bullets cause extra noise which makes list harder to understand.	Description list 3 items. Star, image. Audrey. Star, image. Laurie. Star, image. Alice.
VoiceOver macOS 10.10	Safari 9.0.1	Reading	Image bullets cause extra noise which makes list harder to understand.	Star, image. Audrey. Star, image. Laurie. Star, image. Alice.
VoiceOver macOS 10.9	Safari 7.0.3	Reading		Audrey. Laurie. Alice.
VoiceOver iOS 15.6	Safari iOS 15.6	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, description list start, description, Audrey, description, star, image, description, Laurie, description, star, image, description, Alice. Description list end, description.
VoiceOver iOS 14.7	Safari iOS 14.7	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, description list start, description, Audrey, description, star, image, description, Laurie, description, star, image, description, Alice. Description list end, description.
VoiceOver iOS 13.3	Safari iOS 13.3	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, Audrey, star, image, Laurie, star, image, Alice.
VoiceOver iOS 12.4	Safari iOS 12.4	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, Audrey, star, image, Laurie, star, image, Alice.
VoiceOver iOS 11.4	Safari iOS 11.4	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, Audrey, star, image, Laurie, star, image, Alice.
VoiceOver iOS 10.3	Safari iOS 10.3	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, Audrey, star, image, Laurie, star, image, Alice.
VoiceOver iOS 9.1	Safari iOS 9.1	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, Audrey, star, image, Laurie, star, image, Alice.
VoiceOver iOS 8.4	Safari iOS 8.4	Touch	Image bullets cause extra noise which makes list harder to understand.	Star, image, Audrey, star, image, Laurie, star, image, Alice.
VoiceOver iOS 7.1	Safari iOS 7.1	Touch	Image bullets cause extra noise which makes list harder to understand.	Star. Audrey. Star. Laurie. Star. Alice.
Dolphin SR 15.05	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Normal star. Audrey. Star. Laurie. Star. Alice
SaToGo 3.4.96.0	IE11	Reading	Image bullets cause extra noise which makes list harder to understand.	Star Audrey, Star Laurie, Star Alice

SortSite rules: AccHtmlBulletListMarkup

Test notes

All tests were carried out with screen reader factory settings. JAWS in particular has a wide variety of settings controlling exactly what gets spoken.

Screen readers allow users to interact in different modes, and can produce very different results in each mode. The modes used in these tests are:

• Reading Content read using the “read next” command in a screen reader
• Tabbing Content read using the “tab” key in a screen reader
• Heading Content read using the “next heading” key in a screen reader
• Touch Content read when touching an area of screen on a mobile device

In the “What the user hears” column:

• Commas represent short pauses in screen reader voicing
• Full Stops represent places where voicing stops, and the “read next” or “tab” or “next heading” command is pressed again
• Ellipsis … represent a long pause in voicing
• (Brackets) represent voicing that requires a keystroke to hear