Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Failing Technique F110 - Added examples for sticky header and sticky footer that covers completely elements receiving focus #3775

Open
wants to merge 8 commits into
base: main
Choose a base branch
from
Open

Failing Technique F110 - Added examples for sticky header and sticky footer that covers completely elements receiving focus #3775

wants to merge 8 commits into from

Conversation

giacomo-petri
Copy link
Contributor

@giacomo-petri giacomo-petri commented Apr 5, 2024 •
edited

Closes: #3764

Description:

  • Added examples showcasing the failure of Technique F110.
  • Updated F110 by incorporating links to the failing examples.

Note: The examples contain extensive content (utilizing "Lorem Ipsum" text) to ensure that regardless of the viewport, zoom level, or user preferences, at least one element receiving focus is consistently obscured by the sticky element.

Edit:
Demos available here:

@giacomo-petri giacomo-petri self-assigned this Apr 5, 2024
@giacomo-petri
Update sticky-footer.html
8f765b6 
fixed typo "land" -> "lang"
@giacomo-petri
Update sticky-header.html
4457338 
fixed typo "land" -> "lang"
ljoakley
ljoakley approved these changes Apr 8, 2024
View reviewed changes
Copy link
Contributor

@ljoakley ljoakley left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The working examples look good, were you going to add some text to inform the viewer what is going on?

@giacomo-petri
Copy link
Contributor Author

Hi @ljoakley,

The examples within the Failing Technique are thoroughly documented. In my own examples, I've included explanatory notes on how to recognize the issue. For instance:

This demo page is crafted to illustrate Example 1: Sticky header of the failing technique F110: Failure of Success Criterion 2.4.11 due to a sticky footers or headers hiding focused elements.

All links and buttons on this page are non-functional; links merely serve as focusable elements and anchor directing to the top of the page; buttons are simply not functional.

To identify the problem, please navigate through the page using the TAB key until you reach the bottom, then return to the top using SHIFT + TAB.

I'm more than happy to provide further details if necessary. Could you please advise on any additional information you believe should be included?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ljoakley ljoakley ljoakley approved these changes

Assignees

@giacomo-petri giacomo-petri

Labels
2.4.11 Focus Not Obscured (Minimum) Techniques
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Technique F110: Add screenshots to help the user see examples
2 participants
@giacomo-petri @ljoakley