Visually hidden text audit

	A	B	C	D	E	F	G	H	I	J	K	L	M	N	O	P	Q	R	S	T	U
1	Test name	Link	VoiceOver OSX	VoiceOver iOS	VoiceOver iPad	NVDA	JAWS	IE8	IE9	IE10	Internet Explorer 11 (Windows)	Edge (Windows)	Google Chrome (Windows)	Mozilla Firefox (Windows)	Safari (macOS)	Google Chrome (macOS)	Mozilla Firefox (macOS)	Safari (iOS)	Google Chrome (iOS)	Google Chrome (Android)	Samsung Internet (Android)
2	Control	https://output.jsbin.com/yesilis	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected
3	Visually Hidden with CSS	https://output.jsbin.com/xiqohaz	Visually hidden text in links is always at the front for example: "link, name Change". This is still the same if the visually hidden text is in the middle of the link. Buttons behave as expected.	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	Interruption in the outline, when outline is default user agent styles. See screenshots in document.	As expected	As expected	As expected	As expected	As expected	As expected
4	Visually Hidden with CSS (updated based on Heydon Pickering’s article)	https://output.jsbin.com/foliqur	As expected	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	Small interruption in the outline, when outline is default user agent styles. See screenshots in document.	As expected	As expected	As expected	As expected	As expected	As expected
5	Visually Hidden with CSS (updated based on BBC news)	https://output.jsbin.com/tacobik	As expected	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	Small disruption in the outline, when outline is default user agent styles. See screenshots in document.	As expected	As expected	As expected	As expected	As expected	As expected
6	Visually Hidden with CSS (updated GOV.UK version)	https://output.jsbin.com/zupoceb	As expected	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	When swiping left and right visually hidden text is read out. When pressing on links directly visually hidden text is not read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	Small disruption in the outline, when outline is default user agent styles. See screenshots in document.	As expected	As expected	As expected	As expected	As expected	As expected
7	Visually Hidden with CSS and duplicate aria-hidden content	https://output.jsbin.com/zeruneg	As expected	Reads as expected. VoiceOver virtual focus area is moved to where the invisible text might be, instead of around the link itself. When links are close together it can mean that it's not clear which link is in focus.	Reads as expected. VoiceOver virtual focus area is moved to where the invisible text might be, instead of around the link itself. When links are close together it can mean that it's not clear which link is in focus.	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	As expected	See original 'Visually hidden CSS' but all interruptions are at the end of the element. See screenshots in document.	As expected	As expected	As expected	As expected	As expected	As expected
8	aria-label	https://output.jsbin.com/kuyagos	As expected	As expected	As expected	As expected	As expected	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A
9	aria-label with duplicated text (similar to visually hidden class approach)	https://output.jsbin.com/linegun	Visually hidden text in links is always at the front for example: "link, name Change". This is still the same if the visually hidden text is in the middle of the link. Buttons behave as expected.	When swiping left and right visually hidden text is read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	When swiping left and right visually hidden text is read out. When visually hidden text is in the middle of a link, pressing directly on them results in only the end of the link (or start if pressed near the start) being read out. Buttons behave as expected.	Decided not to proceed with these	Decided not to proceed with these	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A
10	aria-labelledby	https://output.jsbin.com/fogaqi	As expected	As expected	Decided not to proceed with these	Decided not to proceed with these	Decided not to proceed with these	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A
11	aria-describedby	https://output.jsbin.com/gigovag	Announces the context after first announcing the link: "link, Change [long pause] Name"	Announces the context after first announcing the link: "link, Change [long pause] Name"	Decided not to proceed with these	Decided not to proceed with these	Decided not to proceed with these	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A	N/A
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100