Adding alt text to figures generated in R Markdown

[cmichaud]

I am building html reports using R Markdown which I intend to publish to a website. My reports contain several data visualizations in both table and graph format. I want to insure the content is accessible to everyone, consequently, i need help designing screen reader friendly visualizations.

For my tables I am using the gt package and keeping structure simple. The output appears to a me (a total novice) to be reasonably accessible. Are there other packages producing better output for reading devices?

For my figures I am using ggplot. markdown processes them into png files. I can add alt text to the image using fig.cap=" " in the chunk header. However, when rendered this string is added below the .png and displayed in the html output (as a caption). I am interested in adding alt text that remains invisible to all but a screen reader, unless the image fails to display. Is there any way to add this "traditional" alt text to a figure in markdown? I would like to add a description of the figure or a small table summarizing the figure accessible to a screen reader, while not adding redundant signal for sighted consumers.

Thanks

[HanOostdijk]

Maëlle Salmon wrote an blog entry about Miscellaneous Wisdom about R Markdown & Hugo Gained from Work on our Website. The first item she discusses is the use of knitr hooks. This could also work for you.
Be aware that this was tailored to Hugo websites, so probably you will have to remove the {{ , }} pair.
I did use it and had to change the path a little to get it working. See my blog entry Maëlle Salmon’s article about Rmd and Hugo.

After including this hook you can add an alt text. In my blog entry I use

`​``{r pressure, echo=FALSE, 
   hugoopts = list(alt="informative alternative text", 
      caption="this is a caption", 
      width=600)}
plot(pressure)
`​``

that produces the following fragment in the generated html

<p><figure>
    <img src="../../../../../post/2020-04-29-maelle-salmon-article-about-rmd-and-hugo_files/figure-html/pressure-1.png"
         alt="informative alternative text" 
         width="600"/> 
    <figcaption>
            <p>this is a caption</p>
    </figcaption>
</figure>

I hope this will work for you.