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

Replace hidden elements with SRT classes & ARIA labels #429

Closed
jomurgel opened this issue Oct 26, 2018 · 2 comments
Closed

Replace hidden elements with SRT classes & ARIA labels #429

jomurgel opened this issue Oct 26, 2018 · 2 comments
Assignees
@coreymcollins
Labels
enhancement r4r

Comments

@jomurgel
Copy link
Contributor

Note from Corey in #382.

I know this is already in the theme, but I think it might be best to remove this and instead add the screen-reader-text class and ARIA labels to the entry titles of posts where we want to hide the title. Right now, the post title is hidden so on an archive page I don't have any context about the post when the screen reader gets to it.

But maybe that's intentional? I'm not sure why these were hidden in the first place. 🤔

This seemed like an update that we should move into it's own issue as it requires discussion about original intent and an audit of elements that might also need to be updated.
@jomurgel jomurgel mentioned this issue Oct 26, 2018
Merged
@coreymcollins
Copy link
Contributor

@gregrickaby do you remember at all why we are hiding post titles on archive/search results pages if they're set to Post Format "Aside"? Might just be a carry-over from _s, and I know we don't use Post Formats often (ever?), so I'm guessing it's something that's just been around forever.

As Jo noted above, my note in the other task was to conditionally add classes for screen-reader-text and set ARIA labels when we want to hide these elements rather than hiding them with CSS so screen readers can still read the post title. I can't think of why we wouldn't want the post title to be discoverable by a screen reader on a page like search results.

Thoughts?

Link to the styles in question: https://github.com/WebDevStudios/wd_s/blob/master/assets/sass/modules/_content.scss#L74

@mharis
Copy link
Contributor

mharis commented Dec 10, 2018

Agreed with @coreymcollins. A hidden post title should still be screen reader accessible unless there is a post title already on the page.

Maybe this was an accident?

@ghost ghost assigned coreymcollins Jan 18, 2019
@ghost ghost added the In Progress label Jan 18, 2019
@coreymcollins coreymcollins mentioned this issue Jan 18, 2019
Merged
3 tasks
ImBigWill pushed a commit that referenced this issue Jan 18, 2019
@coreymcollins
Feature/#429 replace hidden elements (#454)
1eae31f 
* Removes the CSS hiding aside post format post titles

* Adds screen reader class if the post is an aside

* Actually, just remove the whole screen reader thing

* Compiles styles
coreymcollins added a commit that referenced this issue Jan 18, 2019
@coreymcollins
Squashed commit of the following:
ed31dca 
commit 1eae31f
Author: Corey M Collins <coreymcollins@gmail.com>
Date:   Fri Jan 18 13:51:15 2019 -0600

    Feature/#429 replace hidden elements (#454)

    * Removes the CSS hiding aside post format post titles

    * Adds screen reader class if the post is an aside

    * Actually, just remove the whole screen reader thing

    * Compiles styles
coreymcollins added a commit that referenced this issue Jan 18, 2019
@coreymcollins
Squashed commit of the following:
ff90fa1 
commit 1eae31f
Author: Corey M Collins <coreymcollins@gmail.com>
Date:   Fri Jan 18 13:51:15 2019 -0600

    Feature/#429 replace hidden elements (#454)

    * Removes the CSS hiding aside post format post titles

    * Adds screen reader class if the post is an aside

    * Actually, just remove the whole screen reader thing

    * Compiles styles
ImBigWill pushed a commit that referenced this issue Jan 18, 2019
@coreymcollins
Feature/#434 social links menu (#455)
29320d6 
* Adds styles to replace social icon links in a menu with the icons and hidden text (still screen reader accessible)

* Compiles

* Squashed commit of the following:

commit 1eae31f
Author: Corey M Collins <coreymcollins@gmail.com>
Date:   Fri Jan 18 13:51:15 2019 -0600

    Feature/#429 replace hidden elements (#454)

    * Removes the CSS hiding aside post format post titles

    * Adds screen reader class if the post is an aside

    * Actually, just remove the whole screen reader thing

    * Compiles styles

* Compiles styles

* Squashed commit of the following:

commit 1eae31f
Author: Corey M Collins <coreymcollins@gmail.com>
Date:   Fri Jan 18 13:51:15 2019 -0600

    Feature/#429 replace hidden elements (#454)

    * Removes the CSS hiding aside post format post titles

    * Adds screen reader class if the post is an aside

    * Actually, just remove the whole screen reader thing

    * Compiles styles
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@coreymcollins coreymcollins

Labels
enhancement r4r
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@mharis @coreymcollins @jomurgel