Hi @3cstudio –
I checked the report and right now, your site is showing several flagged issues but they are coming from a different tool (something seemingly called sharify):
I tested the sharing buttons in Jetpack v16.3.1, but I didn’t see the SVGs being flagged. Is there a specific way that you are configuring the buttons that causes the issue to appear?
Screenshots of what I saw here (I tested on a site with only Jetpack installed and a default classic theme [Twenty Sixteen]):
-
This reply was modified 3 days, 3 hours ago by
lastsplash (a11n). Reason: accidentally linked wrong image
Thanks @lastsplash,
I stated we had to turn off Jetpack’s Sharing option, due to there being 16 Errors attributed to it.
Thank you for locating the other 3 items shown as errant via Sharify. I’ll look into that as well….
Overall, it appears that the issue is due to changes in WAVE’s checker and its recent addition checking <svg> files, since it is not just one sharing plugin that is getting dinged.
Thanks again.
Hi @3cstudio,
Glad that clears it up!
If you do spot anything that looks like a genuine Jetpack-side regression down the line, just start a new thread and we’ll take a look.
Thanks!
Thanks @fujifika. I did have a related question: in WAVE, it obviously flags images without alt tags. This issue with that is, when Jetpack optimizes an image, it doesn’t seem to take the alt tag info with that new (typically .webp) image’s meta data. Or does / should it? The site Editor is often frustrated that the image he uploaded is “replaced” by the optimized .webp image by Jetpack, and then it shows up in the WAVE accessibility tool as an Error (and subsequently, a lower AIM score). Thoughts?
And also, are Jetpack developers looking into the recent addition of <svg> accessibility policing by WAVE and other tools for checking a site’s overall accessibility? I had to turn off Jetpack > Sharing to get a much better rating from WAVE… is that even something on Jetpack’s radar to fully flesh out alt tags/text for <svg>s? If not, can it be added to a “wish-list” of some sort? 🙂 Thanks for your consideration, if so.
@3cstudio –
I tested the issue with <svg> coming from Jetpack being flagged by WAVE, but I wasn’t able to reproduce the issue. It certainly is something we would want to address, but I couldn’t get the same warnings to appear (I tried to show that in the screenshots I shared above: https://wordpress.org/support/topic/wave-accessibility-tool-red-flag-errors/#post-19046300)
Are you able to test with a default theme (ex: Twenty Sixteen) and only Jetpack installed? Do you still see the issue? If so, can you share the specifics of how you configured the buttons? I’d like to raise the issue with our team, but we need to be able to reproduce it first.
Hi @3cstudio –
I was also unable to reproduce the issue with Alt tags being stripped from Site Accelerator.
When I publish a new post, the Alt tags come through and aren’t flagged by the WAVE audit:
I’d recommend testing with a default theme and all plugins other than Jetpack disabled. It’s possible that something may be interfering.
If it still happens, please open a new thread with the results. It will be a bit easier for us if we have one thread for each topic 🙂
@lastsplash thanks for the response — however, you didn’t read my post correctly — I stated: I had to turn off Jetpack > Sharing to get a much better rating from WAVE…
I’ve toggled Jetpack > Sharing back to ON: https://wave.webaim.org/report#/wktvjournal.org — now getting the 6.3 (out of 10) once again after it went up to 8.8 with it toggled OFF.
Hi @3cstudio –
I apologize for the confusion here.
I tested on a test site with only Jetpack and the sharing buttons enabled and that’s where I was unable to reproduce the issue. However, I see that it is happening on your site with the official button styles.
Looking into this most of the “Missing alternative text” errors come from the LinkedIn sharing button. In that style, Jetpack doesn’t create the buttons itself. It loads each network’s own script, and that script draws the button. The LinkedIn button that LinkedIn’s script creates contains a small logo graphic without the code that tells accessibility tools to skip it, so WAVE flags it.
The good news is that this isn’t a real barrier for visitors. The button still has a visible “Share” label, so screen readers announce it correctly. WAVE is just strict about the logo graphic. Since the markup comes from LinkedIn, it’s not something Jetpack can change.
To clear these errors, switch your sharing buttons to a style that Jetpack draws itself:
- Go to Jetpack → Settings → Sharing and open the sharing buttons settings.
- Change Button style from “Official buttons” to “Icon + text”, “Icon only”, or “Text only”.
- Save, then run WAVE again.
These styles use Jetpack’s own accessible markup, so the LinkedIn errors should disappear. They also load a bit faster, because they don’t need LinkedIn’s script.
I hope that helps.
Ah, thanks @lastsplash – I changed to each of the 3 Change Button styles, and it showed each style properly on a homepage refresh each time… but the WAVE view remained the original Official Buttons style no matter how many times I cleared cache on all levels (browser, server, site etc.). So, while I saw the 3 styles: Icon + text, Icon only, and Text only when selected and Saved, for whatever reason WAVE would not stray from its showing of Official Buttons — even when I opened a completely clean (never been to the WAVE tool in it before) browser. Any thoughts as to how to get WAVE to clear its cached rendering of the homepage? I left the Button Style on: “Text only” … Keep me posted.
Apparently I needed to do all the caching clearing things 6-8 times 😮 After a number of attempts, it’s now showing that the “Text only” option is doing the trick finally!
The 3 remaining Errors in the WAVE report are from a Plugin named Sharify, so I’ll work on those next. 🙂 Thanks for sticking with me on this… hopefully it can now be put to bed.
Hi @3cstudio,
I’m glad this is now resolved. I’m going to resolve this thread, but please let us know if you run into any more issues related to these sharing buttons.
