-
Notifications
You must be signed in to change notification settings - Fork 378
Proposed Failure Techniques for 1.4.13 (Content on hover and focus) #4934
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Open
detlevhfischer
wants to merge
18
commits into
main
Choose a base branch
from
detlevhfischer-patch-7
base: main
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
+86
−0
Open
Changes from 17 commits
Commits
Show all changes
18 commits
Select commit
Hold shift + click to select a range
3885469
Create F114.html
detlevhfischer a8d49c2
Update F114.html
detlevhfischer 78ecd24
Update F114.html
detlevhfischer 387bc83
Update F114.html
detlevhfischer 1895f1e
Update F114.html
detlevhfischer 25d1982
Update F114.html
detlevhfischer 7569cd3
Update F114.html
detlevhfischer 3f63651
Update F114.html
detlevhfischer a4e1504
Update F114.html
detlevhfischer e3ee1b6
Failure Technique for 1.4.13 Content on hover and focus (F115.html)
detlevhfischer 1e53189
Create F115.html
detlevhfischer fa38e6a
Delete techniques/F114.html
detlevhfischer 070f8e9
Merge branch 'main' into detlevhfischer-patch-7
kfranqueiro 864bbc4
Apply suggestion from @patrickhlauke
patrickhlauke 67a8786
Apply suggestion from @patrickhlauke
patrickhlauke 50dbc96
Apply suggestion from @patrickhlauke
patrickhlauke e4aeaed
Apply suggestion from @patrickhlauke
patrickhlauke d94ede6
Apply suggestion from @patrickhlauke
patrickhlauke File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,53 @@ | ||
| <!DOCTYPE html><html lang="en"><head><title>Failure of Success Criterion 1.4.13 Content on hover and focus when content cannot be dismissed without moving the pointer or the keyboard focus</title> | ||
| <link rel="stylesheet" type="text/css" href="../../css/sources.css" class="remove"> | ||
| </head> | ||
| <body> | ||
| <h1>Failure of Success Criterion 1.4.13 Content on hover and focus when content cannot be dismissed without the pointer hover or the keyboard focus</h1> | ||
| <section class="meta"><p class="id">ID: F114</p><p class="technology">Technology: failures</p><p class="type">Type: Failure</p></section><section id="applicability"> | ||
| <h2>When to Use</h2> | ||
| <p>Applies when the user, by hovering over parts of content or by focusing an element via the keyboard, causes popup content to appear that cannot dismissed without moving the focus.</p> | ||
| </section><section id="description"> | ||
| <h2>Description</h2> | ||
| <p>Content elements may respond to receiving keyboard focus or pointer hover by inserting additional popup content that may now cover other parts of content. For users, especially those that use strong page magnification, this addition of popup content without activation can be disorienting in different ways:</p> | ||
| <ul> | ||
| <li>the new popup content may cover content that the user may want to access</li> | ||
| <li>The new popup content may not appear fully in the magnified viewport, necessitating a move of the viewport by panning, tabbing, or pointer focussing in order to access the popup content</li> | ||
| </ul> | ||
| <p>Since popup content on hover and focus can unexpectedly cover page content that users may want to access, it is important that there is an easy way to dismiss such popup content. The most common method is for that is to press the ESC key. Another possible method is activating the pointer at the current location.</p> | ||
| </section><section id="examples"> | ||
| <h2>Examples</h2> | ||
| <ul> | ||
| <li><strong>Custom tooltip:</strong> When focussing an icon with a question mark that is placed after an input field, a popup window with an explanation of the expected input appears that covers a part of the form. Pressing the ESC key or activating the pointer at the same position fails to close the submenu.</li> | ||
| <li><strong>Sub-menu:</strong> When the mouse pointer is moved over the entry in a horizontal menubar, a submenu appears. Pressing the ESC key or activating the pointer at the same position fails to close the submenu.</li> | ||
| <li><strong>Sub-menu over decorative content or whitespace:</strong> When the mouse pointer is moved over the entry in a horizontal menubar, a submenu appears over a decorative image or whitespace. Across different viewport widths, the submenu does not cover information. This is not a failure.</li> | ||
| </ul> | ||
| </section> | ||
| <section id="tests"><h2>Tests</h2> | ||
| <section class="procedure"><h3>Procedure</h3> | ||
| <ol> | ||
| <li> | ||
| <ul> | ||
| <li>Using the tab key, navigate through interactive content. </li> | ||
| <li>If popup content appears that hides information, press the ESC key and check whether this closes the popup content</li> | ||
| </ul> | ||
| </li> | ||
| <li> | ||
| <ul> | ||
| <li>Move the pointer over interactive elements. </li> | ||
| <li>If popup content appears that hides information: | ||
| <ul> | ||
| <li>press the ESC key and check whether this closes the popup content</li> | ||
| <li>Activate the pointer device at the current pointer position</li> | ||
| </ul> | ||
| </ul> | ||
| </li> | ||
| </ol> | ||
| </section> | ||
| <section class="results"><h3>Expected Results</h3> | ||
| <ul> | ||
| <li>If popup content on keyboard focus does not disappear when pressing ESC or popup content on hover does not disappear when pressing ESC or activating the pointer at the same position then this failure | ||
| condition applies and content fails the success criterion.</li> | ||
| </ul> | ||
| </section> | ||
| </body> | ||
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| <!DOCTYPE html><html lang="en"><head><title>Failure of Success Criterion 1.4.13 Content on hover and focus when the pointer cannot be moved over the new popup content without that content closing</title> | ||
| <link rel="stylesheet" type="text/css" href="../../css/sources.css" class="remove"> | ||
| </head> | ||
| <body> | ||
| <h1>Failure of Success Criterion 1.4.13 Content on hover and focus when the pointer cannot be moved over the new popup content without that content closing</h1> | ||
| <section class="meta"><p class="id">ID: F114</p><p class="technology">Technology: failures</p><p class="type">Type: Failure</p></section><section id="applicability"> | ||
| <h2>When to Use</h2> | ||
| <p>Applies when the user, by hovering over parts of content causes popup content to appear and the pointer cannot be moved over that new popup content without it automatically closing.</p> | ||
| </section><section id="description"> | ||
| <h2>Description</h2> | ||
| <p>Content elements may respond to receiving keyboard focus or pointer hover by inserting additional popup content. For users, especially those that use strong page magnification, this new popup content may not be fully visible. It is therefore important that they can move the pointer over it to access it fully.</p> | ||
| <p>In some cases, popup content is designed in a way where it automatically closes as soon as the pointer leaver the target area of the trigger that caused the content to appear on hover.</p></p> | ||
| </section><section id="examples"> | ||
| <h2>Examples</h2> | ||
| <ul> | ||
| <li><strong>Custom tooltip:</strong> When focussing an icon with a question mark that is placed after an input field, a popup window with an explanation of the expected input appears next to the icon. Moving the pointer away form the icon and over the popup automatically closes the popup content.</li> | ||
| <li><strong>Sub-menu:</strong> When the mouse pointer is moved over the entry in a horizontal menubar, a submenu appears. Moving the pointer away from the main menu item toward the submenu closes this submenu.</li> | ||
| </ul> | ||
| </section> | ||
| <section id="tests"><h2>Tests</h2> | ||
| <section class="procedure"><h3>Procedure</h3> | ||
| <ul> | ||
| <li>Using thepointer, explore page content, especially menus and icons like help or information icons. </li> | ||
| <li>If popup content appears, move the pointer over the popup content</li> | ||
| </ul> | ||
| </section> | ||
| <section class="results"><h3>Expected Results</h3> | ||
| <ul> | ||
| <li>If popup content disappears when moving the pointer over it then this failure condition applies and content fails the success criterion.</li> | ||
| </ul> | ||
| </section> | ||
| </body> | ||
| </html> | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.