WAS Study Flashcards
(130 cards)
1
Q
What are the main priorities when it comes to page titles?
A
- They must be present and contain text 2. They must update when the page URL changes (even for SPA) 3. They must be accurate and informative
2
Q
What are page title best practices?
A
Theys should be concise, they should be unique if possible, unique information should come first, title should match or be similar to the top heading in the main content.
3
Q
What are the main priorities when it comes to page language?
A
- The primary language of the page must be specified in the [html] element 2. The language must be identified using the standard list of language codes (lang=”en”, not lang=”english”. All screen readers support the 2-letter language codes, while some will support the addition of a localized code (en-gb for english - great britain)
4
Q
What happens if a web page does not specify the page language, or if the language is wrong?
A
- If it does not specify the language, it will read it in the default language the user selected when installing the screen reader. 2. If it is in the wrong language, it will read the page in a funky accent (i.e an english page with a spanish language specification)
5
Q
How can you specify the language of a part within the page?
A
Inline language changes can be identified by using the lang=”xx” attribute on any block level elements ([div], [h1], [p], [table], etc.) as well as inline elements ([span], [a], [strong], etc.)
6
Q
Name the HTML landmarks and there ARIA role equivelents
A
HTML: [header], [nav], [main], [aside], [section], [article], [form], [footer]. ARIA: role=”banner”, role=”navigation”, role=”main”, role=”complimentary”, role=”region”, role=”article”, role=”form”, role=”contentinfo”
7
Q
What is the best way to distinguish between multiple landmarks on a page, such as a main navigation and a table of contents?
A
by using programmatically determinable labels (aria-label or aria-labelledby). Ex: [nav aria-label=”Table of Contents”] or if table of contents is a heading already, you can use aria-labelledby.
8
Q
Which 3 aria roles should not be used more than once per page?
A
Banner, Main, and Contentinfo
9
Q
What are the two ways headings can be established progromatically?
A
Using the proper semantic tag, like [h1] ; Or using role=”heading” with aria-level=”[1-6]”. ([div role=”heading” aria-level=”1”])
10
Q
What are the best practices for headings
A
Headings are created using proper structure and not done visually. Headings are accurate and informative of the content within that section. Headings should be concice and relatively brief. Do not skip hierarchal levels ([h3] then [h1])
11
Q
Which of the following will be recognized as a valid heading by screen readers? A. [h1][/h1] B. [h7]Legal disclaimer[/h7] C. [div role=”heading” aria-level=”3”]The secrets beneath the ocean’s surface[/div] D. [p class=”heading level2” style=”font-size: 200%; font-weight: bold”]Understand yourself[/p]
A
C
12
Q
True or False - Screen readers will read the alt text of an image within a heading as part of the heading text.
A
TRUE
13
Q
What are the two ways to designate links programatically?
A
- Using the [a] tag with a valid href attribute. 2. Using role=”link” AND tabindex=”0” + the associated js allows the user to activate the link with either a click action or the enter key (both event handlers must be present).
14
Q
In general, When should you use a link vs a button, and why is it important for Screen Reader users?
A
Links should take the user somewhere(either to a different page or on the same page), where Buttons should activate scriped functionality (like opening a modal [submit buttons are an exception]). When a screen reader user wants to find a link, the user may pull up the list of links and not find the link anywhere because it turns out that it has actually been designated as a button in the markup, or vice versa.
15
Q
What is the precedence ranking for link text to a SR?
A
aria-labelledby
aria-label
Text contained between the opening [a] and closing [/a] elements (including alt text on images)
title attribute (note that this is considered a last resort method for screen readers to find something; it should not be considered a primary technique for giving names to links)
16
Q
True or False - links can have an accessible name by providing an image with alt text within the [a] tag?
A
True, this is valid: [a href=”https://dequeuniversity.com/curriculum/”] [img src=”info.png” alt=”Web accessibility curriculum”] [/a]
17
Q
What are some best practices for links?
A
- They should describe purpose or destination when read out of context 2. They should say if they open in a new window 3. They should say the document type if applicable (PDF Document) 4. They need to be visually distinguishable from surrounding text
18
Q
What contrast ratio is needed for links in comparison to surrounding text?
A
3 to 1
19
Q
What are the best practices for navigations?
A
They should be labelled by [nav] or role=”navigation”. They should denote which page is active visually and by using aria-current (or an aria-label or clip-text technique). Navigation should be consistent and not change order from page to page.
20
Q
What are the best practices for skip links?
A
They should be at the beginning of the DOM. They should be visible all the time or on keyboard focus. Do not use display:none or else keyboard wont be able to access it.
21
Q
What are the best practices for focus/reading order?
A
The reading and navigation order must be logical and intuitive. Don’t use positive tabindex. Focus order will follow the DOM order, not the visual order.
22
Q
What are the rules for single-key shortcuts
A
If they exist there must be a way to turn them off, re-map them, or are only active when the relevant component has focus. Users who navigate with speech accidentally say ‘D’ and delete something instead of their intended word of ‘D-enote’
23
Q
What are best practices for pagination?
A
Pagination should have a visual way to denote the active page, and it should denote to blind users as well - either through aria-current, aria-label, ect. Ex: ( [li][a href=”#” aria-current=”page”]3[/a][/li])
24
Q
Best practices for semantic markup of tables?
A
Tabular data should be represented in a [table]. Don’t create fake tables (create the look of a table without using actual table semantics)
25
What are the rules for table names?
The table must have a programatically associated name using the caption element or aria-label/aria-labelledby. SR users can pull up a list of tables on the page that will announce their name and size. Without a name, they will all say just a table size with no info on what they are about.
26
Examples of how to name tables the right way?
Best: [table][caption]1st Quarter Results[/caption] OR [table aria-label="Second quarter Results"] OR [h3 id=tableCaption]x[/h3] [table aria-labelledby="tableCaption"] Or [table aria-labelledby="tableCaption"] [figcaption id=tableCaption]
27
What things must every table have?
Tables must use the correct semantic [table] markup. Tables must have a programatic name, usually [caption]. Table headers must all be identified using [th]. It is a good idea to add the scope to the [th] by adding a scope of one of the following: col, row, colgroup, or rowgroup.
28
How to make complex tables with irregular stucture
These should be avoided, however you can do it by utilizing headers element and id's.
29
While layout tables must be avoided, what are best practices if they must be used?
the table should have role="presentation" so that SR will not interprate them as a table. They also should NOT contain any data table markup, such as: [caption], [summary], [th], scope attribute, headers attribute.
30
What are best practices for lists?
They must be semantically correct. I.e [ul] or [ol] with [li] elements. Screen readers can also correctly identify lists within lists with correct markup. For definition lists use ([dl]) render as paired terms ([dt]) and definitions ([dd]).
31
What are best practices for iFrames?
They must have a [title] attribute with a meaninful description and is unique to the page
32
What is true regarding [em] (italics) and [strong] (bold), in regards to screen readers?
They are ignored by screen readers of most types, some readers have a setting to have them aknowledged but it is not common. Some work arounds are to add words like "Important:" or a visually hidden text using clip-text method
33
Explain each semantic element and wether it will be read by screen readers? (and work arounds for those who don't): [blockquote], [em], [q], [strong]
[blockquote] will be recognized by SR and can be used. Don’t use it for visual styling alone. [em] (italics) will not be recognized. [strong] (bold) will not be recognized. You can add inline text or clip method to add hidden context for these. [q] is a quote tag but is not recognized by SR.
34
What is true about the [pre] and [code] elements?
[code] will be ignored completely by screen readers but is good for sighted users. [pre] formats the code to distinguish it from surrounding text. Good for sighted but not for SR.
35
What is true about the [ins] and [del] elements?
[del] is strikethrough. The text will be read by SR, but will not indicate it has been strikethrough. [ins] is to inset text, usually for legal documents. The text will be read but will not indicate it has been inserted. Need to use hidden text techniques to add this context.
36
What is the [mark] element and is it supported?
[mark] highlights the text and is useful for visual users. For SR users, they are not notified that it is highlighted. Will have to use hidden text techniues to add context.
37
How would you make an image map accessible?
Each [area] section needs its own alt-text, as well as the image itself.
38
What are best practices for implementing SVG images?
You should use [img] as the tag for svg's or implement them inline in the html with [svg]. In either case it needs role="img". The downside of using [img] is the css and js cannot be manipulated. Svg in an [img] tag should always have alt-text, aria-label, or aria-labelledby. using inline [svg] should have a [title] element at the beginning of the [svg]
39
What is needed for complex SVG images?
You need to add a longer description of the content within the html, in a collapsed section, within a button dialog, etc. Or you can use the [desc] element in the SVG, but this is not preferred since sighted users can't see it. It is a last resort however, if the others are not provided. The [desc] attribute of an [svg] element MUST be programmatically associated with the [svg] element (via aria-labelledby).
40
What are the best practices for text within SVGs?
If the text is within the SVG, it should be tagged with an id to be referenced, along with the svg title, by an aria-labelledby on the svg element. There should also be a background color behind the text, so high contrast mode does not create a contrast issue.
41
What are best practices for SVG animations?
Use Javascript and not [animate]. Do not flash more than 3 times a second. Do not last longer than 5 seconds. Allow users to pause animation
42
What are best practices for Interactive SVGs?
Interactive [svg] objects MUST be fully keyboard-accessible. Interactive [svg] objects MUST be fully touchscreen-accessible. Interactive [svg] objects MUST communicate the applicable name, role, and value of controls, events, and semantic elements within the [svg] object.
43
How does the way a SR treat alt text differ from regular text on a page?
1. You cant pause or restart alt-text reading 2. You can't navigate alt-text by word or character 3. older SRs may stop reading after a certain length.
44
Name three ways to hide an image from a SR
1. you can add null alt-text (alt=""). 2. You can add role="presentation" 3. you can add the image as a css background-image property
45
What are the benefits and best practices for icon fonts?
The benefit is they will change color with the rest of the text if the user customizes text and bg colors. They need role="img" and alt text (usually aria-label).
46
How do you make canvas elements accessible?
They need role="img". They need alt text provided using aria-label (or sometimes aria-labelledby). You can add fallback text within the canvas itself as a regular text element. Canvas elements should have a fill background in case user changes to high contrast mode.
47
Do canvas elements support keyboard controls?
Not initially. You will need to add name and role values to any actionable content within the canvas, as well as using javascript to add keyboard focus and spacebar/enter events.
48
True or False - All live and prerecorded video must have syncronized captions?
TRUE
49
True or false - Videos must include audio descriptions
TRUE
50
What is the [object] element and what does it need to be accessible?
used to display content like images, PDF files, videos, and audio, among other things. It needs an aria-label or aria-labelledby
51
What are the best practices for color contrast of text?
Under 18pt regular or 14pt bold needs 4.5:1 contrast. 18pt or over and 14pt bold or over needs 3:1. note pt is not pixels, each pt is 1.33 pixels.
52
What are the touch size requirements
Must be 24 x 24 for AA, unless the offset between the other components is more than 24px. AAA is 44 x 44 pixels and what is recommended
53
What are the best practices for inline link text?
link text must be 3:1 contrast unless it has another identifier such as a background color, underline, etc. The best practice is to have an underline and a 3:1 color contrast
54
What is true regarding Color to Distinguish UI Components
Must not be used unless the contrast is 3:1
55
What are best practices for line spacing and paragraph spacing?
line spacing should be at least 1.5 but not more than 2. Paragraph spacing should be at least 1.5 larger than the line spacing.
56
What are two techniques to hide content from both visual users and SR users?
Display: none; and visibility: hidden;
57
What is a technique for hiding content solely for SR users but not for sighted users?
aria-hidden="true"
58
What is a technique for hiding content solely for visual users but not for keyboard?
position:absolute; clip:rect(0 0 0 0);
59
What are the best practices for CSS generated content?
CSS generated content like ::before and ::after has mixed support from SR software and should be avoided. One technique is to use aria-hidden and provide a text alternative some other way, such as via aria-label, if the item is a link, button, form control, or other focusable item. If it is not a focusable item, it may be necessary to use the css clip technique.
60
What is true about visually hidden and inactive content?
It must be hidden from SR users until it is made visible and active to visual users (equivalent experience)
61
What are the rules for content that is triggered by hover or focus?
The additional content must be dismissable, hoverable, and persistent. Most commonly used for hover-tips and submenus on hover
62
What is the appropriate technique for content triggered by hover or focus?
Users need to be able to dismiss the new content, usually using the escape key. Users also need to be able to hover their mouse pointer over the new content, it should persist while they are inside of the content pane. Finally, content should not disappear until keyboard or mouse hover leaves it.
63
Name two tools for screen magnification for low vision users?
ZoomText and MAGic
64
What criteria is set for spacing of text and paragraphs?
Line height (line spacing) to at least 1.5 times the font size
Spacing following paragraphs to at least 2 times the font size
Letter spacing (tracking) to at least 0.12 times the font size
Word spacing to at least 0.16 times the font size
65
What are the rules regarding scrolling in two directions? What zoom level and pixels limit does this apply to?
Content must not require scrolling in two directions even when the viewport is set or zoomed to 320 CSS pixels wide or 256 CSS pixels high. (320 is 1280 width ar 400% zoom, 256 is 1024 height at 400% zoom) unless it is essential to the usage or meaning of the content.
66
What is true in regards to zoom on mobile phones?
Users must be able to pinch to zoom, do not add the two properties on the meta viewport element that will effectively suppress pinch-to-zoom: user-scalable=no and maximum-scale=1.0.
67
What is true in regards to mobile screen orientation?
Content MUST NOT restrict its view and operation to a single display orientation
68
What is the difference between captions and subtitles?
captions describe outside things like laughter or music playing, subtitles just describe what is being said.
69
According to AA, pre-recorded multimedia needs what alternatives?
Captions and audio descriptions
70
According to AA, pre-recorded video (only) needs what alternatives?
audio descriptions OR Transcript
71
According to AA, pre-recorded Audio needs what alternatives?
Transcript
72
According to AA, live multimedia needs what alternatives?
captions
73
Difference between open and closed captions?
Open captions cannot be turned off
74
What level is sign language interpretation needed?
AAA
75
What is true in regards to audio that plays automatically on a web page?
If it plays for longer than 3 seconds there must be a way to pause, stop, mute, or adjust volumne level
76
Autoplaying audio on a webpage may make it IMPOSSIBLE for which user category/categories to use your web page?
Screen reader users, if there is no way to pause or stop the audio. Without a stop, the audio will play over the SR audio, and turning down the page audio will also turn down the SR audio.
77
WCAG Level AA allows for content to flash more than 3 times per second as long as certain conditions are met. These qualifying conditions include:
The flashing area is small enough, and the colors are low contrast
78
What is a vestibular disorder?
Vestibular disorders encompass a broad category of conditions that affect a person's balance.They can be prompted by the appearance of being off balance, like web page background motion or parallax effects
79
True or false: Background videos that autoplay are not required to stop playing after 5 seconds.
TRUE
80
How long can media content autoplay before a mechanism is required to pause, stop, or hide content?
5 Seconds
81
For functionality that can be operated using a single-pointer (mouse click), what are the requirements?
At least one of the following measures is enabled: 1. The down-event of the pointer is not used to execute any part of the function.
2. Completion of the function is on the up-event and a mechanism is available to abort the function before completion or to undo the function after completion. 3. The up-event reverses any outcome of the preceding down-event. 4. The down event function is essential to operation.
82
What are examples of situations with an essential down event?
A piano plays keys when they are pressed down. A keyboard emulation presses the key when it is held down.
83
What needs to be keyboard focusable?
all links, buttons, and interactive controls must be keyboard focusable
84
What is role="link", when would you use it, and best practices?
role=link is a role used to identify an element that creates a hyperlink. Would be used when creating a link out of a [span] element for instance. It will NOT make it keyboard focusable or cause browsers to enhance the element with standard link appearance or behaviors, such as underlining, focus rings. You will have to add those behaviors. (needs tabindex="0" to be focusable, etc.)
85
What are the best practices for a tab component?
Each inside tab div will need role="tabpanel". The active tab will need tabindex="0" and aria-selected="true" and the inactive tabs will need tabindex="-1" and aria-selected="false". The active tab will be keyboard focusable, and then the other tabs will be controlled with arrow keys.
86
What are focus indicator best practices?
All focusable elements need focus indicators. All focus indicators need 3:1 contrast between the indicator and the page background
87
While semantic HTML elements will have built in functionality to enable keyboard support ([a] for instance), what is needed for custom components to be keyboard accessible? Use a [span] element turned into a link as an example.
It needs to be tab-focusable with tabindex="0". It needs a role, role="link". It needs a JS event handler for both mouse and keyboard. Onmousedown will make it clickable, but will not make it work with keyboard. The JS click() event handles both mouse and keyboard click.
88
What are the best practices for when a user initiates an event that moves focus?
1. For content added to the screen in reaction to a user-fired event, focus should be shifted to the new content.
2. For content removed from the screen in reaction to a user-fired event, focus should be shifted to the next logical place in the interaction.
89
Give examples of best practice when user initates an event that creates new content, and when content is removed from the screen.
A modal is an example of a user fired event. When user opens the modal, the focus should be moved to the modal. When they close the modal, the focus should be returned to where the modal was triggered.
90
What is the point of tabindex="-1" and how could it be used?
tabindex="-1" can be used when you need an element to be focusable but not put in the tab-order. Typically its used to set the focus to that element through JS without it being part of the tab-abble order. For instance, when user initiates a modal you can set the modal dialog to tabindex="-1" and set focus to it, so it reads out the modal text and has focus, but is not tab-able.
91
What are best practices for page specific keyboard shortcuts
When page-specified shortcuts or accesskeys are created for a web page, those shortcuts and accesskeys must not interfere with keyboard shortcuts used in the browser or keyboard shortcuts used through assistive technologies.
92
What are best practices for when custom keyboard behavior is required?
Keyboard instructions are provided for both sighted keyboard users and non-visual keyboard users.
93
What is true regarding gestures and SR users?
mobile SRs disable scripted gestures since those gestures are used to navigate between content (e.g. swiping right to move to next element). All functionality that uses multipoint or path-based gestures for operation MUST be operable with a single pointer without a path-based gesture. Multipoint = things like pinch to zoom with two fingers path-based = swiping left
94
What are the best practices around motion actuation?
Functionality that can be operated by device or user motion MUST also be operable by user interface components and MUST allow the ability to disable motion actuation.
95
What 4 things do all form input labels need?
1. They must clearly explain the purpose of the field. 2. Labels must be programmatically associated with their control. 3. Labels must be visible at all times. 4. Labels must be in close proximity to their control.
96
How do you associate a label with an input method?
Best way is to either using the 'for' role on the label element: [label for="inputid"] or by using an implicit label by putting the input inside the label itself [label first name [input][/input[/label]. Other ways include using aria-labelledby, alt text for an image in a label, or an aria-label if last resort.
97
What techniques would you use when one label is needed for multiple elements, like a social security field?
1. Combine the fields together to avoid having to label each one separately. 2. Use off-screen text with CSS to provide hidden labels. This technique uses the traditional [label] tag and is very robust, but perhaps less elegant than the aria-label technique. 3. Use aria-label to provide hidden labels. If you do this, you should probably also provide a traditional [label] for the first field, to allow users to click on the text to put the focus in the form field. 4. Use a [fieldset] for the visible label and hidden text for the other labels.
98
What is true regarding groups of form fields, like a set of radio buttons?
They need to be semantically related to each other. The best way to do this is using the [fieldset] and [legend] elements. Another way is to use aria-labelledby. The group for the aria-labelledby can have role=group which performs the function of the [legend], but is not yet supported in voiceover.
99
What techniques can you use to include instructions to forms or groups?
If the instructions are short you can include it in the legend, although it can get annoying since SRs usually announce legend text after every input. Another option is to write the instructions somewhere nearby and then use aria-describedby on the first input, so the SR will read the first input text and the instructions.
100
How can you designate required fields as required?
adding instructions at the beginning of the fields that mark required fields as required (for sighted users" and for SR users adding aria-required="true". HTML5 has a 'required' attribute but it is less preferable for various reasons.
101
What are best practices for design patterns when user submits a form with errors?
#1 A summary box at the top with tabindex=-1 that receives focus with the errors listed. #2 set focus to the first field that has an error with the error message visable and aria-invalid=true
102
What is true regarding status messages?
They must be read aloud without the new content receiving focus, usually through a live region. The live region must be present on the page previously and must be empty, prior to the message being inserted into the region.
103
what is true regarding time sensitive experiences?
If there is a session time limit, users MUST be warned before the session ends and MUST be given time to save their data and/or extend the session.
104
How long does data need to be preserved before it is okay to end the session?
20 hours
105
What is true regarding timers with fixed deadlines?
deadlines SHOULD provide users with a dynamic countdown feature. Countdown features SHOULD post ARIA live announcements at strategic intervals.(i.e 5 minutes left)
106
What is true regarding infinite scrolling pages?
An "infinite scrolling" feature MUST allow users to reach all areas of the page with the keyboard.
107
What is the purpose of the application role?
Application mode exists to allow developers complete freedom over programming the behaviors of a widget, including keyboard event handlers.
108
Why is it advised not to use the application role unless you really know what you are doing?
Because it turns of most screen reader shortcuts so that developers are able to control the logic of keyboard interactions within web applications
109
What shortcuts are not disabled when application mode is turned on?
1. The Tab key to go through focusable items, such as links, form elements, and anything with tabindex="0".
2. The Enter or Return key to activate a link or button, or to submit a form.
3. The space bar to activate a button or submit a form.
4. The arrow keys to choose elements within [select] lists or to choose between radio buttons
110
Why would someone use the document role inside of an application role?
So that a SR can use their regular keyboard shortcuts within the application or part of the application. It can be especially useful for modal dialogs (role="dialog" or role="alertdialog) that may have mixed content with regular text and form elements.
111
What is true regarding text content within an application role?
Meaningful text content must be programatically associated with a focusable element or turned into a focusable element, since No regular text is available to screen readers in application regions unless it is keyboard focusable, including paragraphs, headings, [div] elements, [span] elements, lists, tables, etc.
112
What downside is there to making something like a paragraph keyboard focusable?
The main downsides is that users expect a focusable element to be actionable. The other downside is that they can only tab to the element and listen to it in its entirety. If they pause the reader, it won't pick up where it left off. They would need to tab away from the element, then tab back to it and listen to the whole thing over again.
113
What are some roles that automatically invoke application mode?
role="dialog", role="alertdialog", role="tablist"
114
What does the presentation role do?
Marking a section as role="presentation" essentially cancels the native role of the element and turns it into the equivalent of a [span] or [div]. For example, a [h1] with role=presentation will not be identified or announced as a heading
115
What is the math role for?
Writing equations. Has limited support.
116
What is the definition role and what is a better alternative?
definition is used to define words in the text. A more supported element is to use the html definition list [dl] structure.
117
What is the note role?
similar in concept to the HTML 5 [aside] or the ARIA role="complementary", but role="note" is not a landmark region like the other two and is generally meant to be read in the context of the rest of the content around it.
118
What is the directory role?
The directory role is for designating a table of contents or other similar directory structure, whether the items are links or not.
119
What are all the aria states?
aria-checked, aria-disabled, aria-expanded, aria-hidden, aria-invalid, aria-pressed, aria-selected
120
What is an aria live region, what are the best practices, and what two designations can it have?
aria live allows you to make announcement to the user at any time, based on a timer, a user action, the result of a server process, etc. It must be empty to begin with, and be recognized by the accessibility API prior to adding a message. The two designations are polite and assertive. assertive will inturrupt whatever the SR was saying
121
what is aria-atomic modifier for live regions
aria-atomic lets the assistive technology know if a whole region needs to be reread to a user, or just the change. The default is false, which means just new changes need to be read. True means the whole region needs to be re-read
122
What is aria-relevant modifier for live regions and what attributes can it have?
aria-relevant="all" means all changes are relevant (Use sparingly). "additions" means Insertion of nodes to the live region are relevant. For example, nodes that are removed from the top of a log are merely removed for purposes of creating room for other entries, and the removal of them does not have meaning. "Removals" = Removal of nodes to the live region are relevant (i.e., a screen reader will speak the removal). "text" = Changes to the textual content (including text equivalents, such as alt text) in the live region are relevant.
123
While aria-relevant="all" and aria-relevant="removals" should be used sparingly, what is one use case where this could make sense?
Assistive technologies only need to be informed of content removal when its removal represents an important change, such as a buddy leaving a chat room.
124
what is aria-busy and when can it be used for live regions?
To suppress announcements while the region is updating, you can use the aria-busy (state) property. Set aria-busy="true" and then clear the attribute when the region is finished.
125
what is role="alert" and how is it related to live regions?
role="alert" is just another type of live region that is equivalent to aria-live="assertive", except that some screen readers say "alert," to let users know that it is an alert message.
126
What is role="status" and how is it related to live regions?
role="status" is just another type of live region that is a combination of aria-live="polite" and aria-atomic="true". So its another way to add those two attributes using one role.
127
What is role="timer"
designates it as time counter, either counting up or down. This role isn't as useful as other types of live regions, because the implied value is aria-live="off", meaning that screen readers are not supposed to announce changes to timers at all, though screen reader users will be able to read the content of the timer if they navigate to the timer and listen to the text.
128
What is role="marquee"
Setting an element to role="marquee" designates it as a scrolling area (such as a news ticker) with non-essential announcements. The implied value is aria-live="off", meaning that screen readers are not supposed to announce changes in marquees at all, though screen reader users will be able to read the content of the marquee if they navigate to the marquee and listen to the text.
129
What is role="log"
Logs keep a record of sequential events, such as a chat conversation, steps in a software installation process, or other similar sequential actions.
130
What are the four keyboard modes?
1. Document (reading) Mode 2. Focus (Forms) Mode 3. Application Mode 4. Tables Mode
