Difference between revisions of "Accessible name calc"
| Line 121: | Line 121: | ||
<h1>iframe</h1> | <h1>iframe</h1> | ||
| − | <iframe src="https://www.ssbbartgroup.com" title="SSB's homepage</iframe> | + | <p>title "SSB's homepage"</p> |
| + | <iframe src="https://www.ssbbartgroup.com" title="SSB's homepage"></iframe> | ||
| + | |||
| + | <p>aria-label "my label"</p> | ||
| + | <iframe src="https://www.ssbbartgroup.com" aria-label="my label"></iframe> | ||
| + | |||
| + | <p>aria-labelledby "my labelledby" </p> | ||
| + | <iframe src="https://www.ssbbartgroup.com" title="my labelledby"></iframe> | ||
</body> | </body> | ||
</html> | </html> | ||
[[Category:ARIA]] | [[Category:ARIA]] | ||
Revision as of 20:14, 11 January 2017
Image
Image with aria-label and alt
having an accessible name of “here”.
Image with space for aria-label and alt
having an accessible name of “ ”.
Image with null for aria-label and alt
having an accessible name of “hello”.
Image with aria-labelledby with multiple id refs/h2>
Hello
Here
Hello
Here
Link
Link with pseudo content
has an accessible name of "click here".
Link with only pseudo content
Link referencing aria-labelledby with pseudo content
Link referencing aria-labelledby with display none including children
has an accessible name of "pool location"
Link referencing aria-labelledby with visibility hidden including children
has an accessible name of "pool"
Link referencing parent with aria-labelledby
Massive storm sweeps across nation click here
has an accessible name of "Massive storms sweeps across nation click here"
Link with aria-labelledby that contains some content with aria-hidden
Link with aria-labelledby that contains all content with aria-hidden
Link with text and span with aria-label and span with aria-labelledby
Avila D
Has an accessible name of "Jon not".
Reference to aria-labelledby element which has aria-label
Avila
Has an accessible name of "David".
Switch
Name as text content "running?"
Name as aria-labelledby "Is your refrigerator running?"
Name as aria-label "Fridge is running?"
Name as title attribute with text content "Running?"
Name as title attribute with no text content "Fridge is running?"
iframe
title "SSB's homepage"
aria-label "my label"
aria-labelledby "my labelledby"
