Visualization issues

[thatbudakguy]

notes from the meeting:

• 404 is b/c references don’t have their own page as a stand alone. Add anchors and link to the reference page of a work? But not every work has a page to go to.
• Have a CSS snippet hidden on the page that only loads for a screen reader...possible to do here?
• Since it’s a link have it set up to load the text content when they click it? Might be too slow. Try doing that and set it on the area label?
• If it’s a button instead of a link (still get hover state) and hitting the button will take you somewhere. Need to figure out how to load content via AJAX in a way that works.
• Which content would we need to include? Probably everything

[rlskoeser]

Also doesn't work on touch devices. Maybe we can make click/tap perform the same action as current hover.

@xinyil how do you feel about making the dots larger? It seems like a small target for touch.

[xinyil]

@rlskoeser I think it's a question of which do we care more: individual record access or the overall visual comparison of the numbers of dots

[meg-codes]

Updated this to:

• [x] fix 404 issues on click
• [x] make dots buttons that accept tab focus
• [ ] give dots a dynamic aria-describedby attribute that will read the text of the popover for screen readers
• [x] keep popover displayed until user clicks outside the popover
• [ ] chapter or author has aria-label that gives the total references for the chapter / author

[rlskoeser]

@bwhicks could we also add an aria-only total of references for each section? As a counterpart to the visual indicator/histogram functionality.

[meg-codes]

@rlskoeser I don't see why not. I'll add that to the list.

[meg-codes]

I've got a working solution for this (used JS because for chapter divisions, the template iterates over each reference and determines whether to print it for each), but this side steps that by dynamically setting aria-label based on the number of marker nodes.

[rlskoeser]

@bwhicks this is so much better than it was. A few small issues, wondering if we can easily fix.

• I see the label with the count of references in the html, but when I use the screen reader I don't hear it.
• listening to the screen reader go through the buttons is strange because it reads button plus the number; what do you think if I switch the text to "Reference on p. #" (use derridawork_page, which we already have available)?
• The reference text is loading and reading for me with the screen reader.