fix: make img alt attribute empty

[motou]

Closes #1819

set the image alt attribute empty so that screen reader won't annonce the text twice.

Changelog

Changed

• change the image alt text to empty string
  See: https://www.gatsbyjs.com/plugins/gatsby-remark-images/?=gatsby-remark#usage-in-markdown

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/carbon-design-system/carbondesignsystem/1heb77bf5
✅ Preview: https://carbondesignsystem-git-2b32751df4854799f48ac960e8260e911acd1be7.carbon-design-system.vercel.app

[jaknas]

correct me if I'm wrong, but I think ![](image) syntax erases alt tag altogether and this is not ideal, the desired behaviour is to have alt="" [1] according to decorative images spec.

IMO this is some constraint on gatsby-remark-images plugin as they don't allow for null alt text as far as I know.

[1] https://www.w3.org/WAI/tutorials/images/decorative/

[tw15egan]

@Kleyu nice catch! You are correct, seems like this is currently not possible (passing in an alt="") due to Gatsby setting a default value if one is not passed. Looks like we'll need to get this fixed upstream before we can fix it on our end.

Issue: gatsbyjs/gatsby#20179
Gatsby source: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-remark-images/src/index.js#L173

[motou]

@Kleyu nice catch! You are correct, seems like this is currently not possible (passing in an alt="") due to Gatsby setting a default value if one is not passed. Looks like we'll need to get this fixed upstream before we can fix it on our end.

Issue: gatsbyjs/gatsby#20179
Gatsby source: https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-remark-images/src/index.js#L173

Okay, then let me fix that issue at first 🙃

[motou]

@tw15egan thanks for approving. The fix PR gatsbyjs/gatsby#27218 is already merged. When the new version 3.3.33 is published, then this PR is ready to be merged as well.

[pieh]

IMO this is some constraint on gatsby-remark-images plugin as they don't allow for null alt text as far as I know.

(I'm maintainer of gatsby-remark-images). The behaviour like that (falling back to filename as alt) was unfortunate choice in the past, that I hope to remove in the next major release (probably will have a way to maintain that behaviour for anyone that wish to keep it). There is also opportunity to add global plugin setting to disable this behaviour in current major version line too (without causing breaking changes and forcing major version bump just yet)

[tw15egan]

@pieh @motou thanks for working together so quickly to tackle this! 🙏 🥇

[motou]

@tw15egan since the new version 3.3.33 is already published (gatsbyjs/gatsby#27218 (comment)), this PR is ready to be merged :)

[andreancardona]

@motou yay! 🥳 thanks for the contribution!