-
Notifications
You must be signed in to change notification settings - Fork 504
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
Blockquote example does not need figure/figcaption #2563
Comments
Apparently added by 25f7964 changed from footer in the blockquote. |
Ah, so I can edit https://github.com/mdn/interactive-examples/blob/main/live-examples/html-examples/text-content/blockquote.html. I'll just go do that. |
It looks like this is your first issue. Welcome! 👋 One of the project maintainers will be with you as soon as possible. We appreciate your patience. To safeguard the health of the project, please take a moment to read our code of conduct. |
Another example of wrapping a Should this be removed? |
That one is in content (repo) directly, and apparently it is there from the start (migration), so hard to find who authored it. But as for OP snippet, maybe we could ask @mikoMK for pointers? Maybe there is some argument that could potentially overweight current NVDA/Firefox flaw (?) My guess is it might have been taken directly from the HTML specs where this ("fancy") I don't want to complicate it and I agree that MDN should rather promote real-world best practices than ideal but actually flawed techniques, so if original ("fancy") code is flawed in any fairly recent user agent, it is a good thing to correct it ("dumb it down") for sake of broadest support. But maybe (maybe?) if the original "fancy" structure is otherwise working and widely agreed upon and the problem in question is a problem of concrete product (NVDA/Firefox), it should be mentioned in docs and linked to relevant product bugreports? (Or we should both dumb it down AND mention reasoning why it diverges from the specs / ideal structure?) Moreover, current docs for [ (It is basically quoted from the whatwg DOM specs.) There is no |
IMO no, since that shows assorted ways to use
What NVDA/Firefox flaw?
Not problematic. Just not exposed as a landmark. |
The "unnecessary noise" produced by reading the
|
Ah. I don't consider that a bug. |
just some historical context: the example in the docs is b/c of the example in whatwg |
If it satisfies anyone's curiosity, I wrote about different announcements of 7 patterns across 6 screen readers (so far): It includes the pattern I replaced, which was the most verbose by far across NVDA, JAWS, and macOS VoiceOver. Still not a bug, IMO, just unnecessary code. |
MDN URL
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote
What specific section or headline is this issue about?
Try it
What information was incorrect, unhelpful, or incomplete?
The "Try it" section wraps the blockquote text in a figure with a figure caption, but does not explain why the figure is used nor explain the impact on screen reader announcements.
The code:
What did you expect to see?
Either:
<figure>
element, orDo you have any supporting links, references, or citations?
Fire up a screen reader and navigate it.
This is the output navigating with the virtual cursor in NVDA/Firefox:
↓
↓
The
<figure>
causes an announcement of the figure, which is fine but adds unnecessary noise. The<figcaption>
causes announcement of the text it contains at the start of the content, prior to announcing the presence of the figure or blockquote Then the contents of the<figcaption>
are announced again as the user moves the virtual cursor through the DOM.As a user, it is unclear why I am hearing this information twice (other than the code chosen). As a developer, there is no guidance on what this code will output.
This is the output navigating with the virtual cursor in JAWS/Chrome:
↓
↓
↓
Here, the "has details" announcement is a function of the
<figcaption>
.Do you have anything more you want to share?
I cannot edit this example in GitHub because it comes in from an embed with no immediately apparent documentation on where to find it:
{{EmbedInteractiveExample("pages/tabbed/blockquote.html","tabbed-standard")}}
MDN metadata
Page report details
en-us/web/html/element/blockquote
The text was updated successfully, but these errors were encountered: