Add alt text to all images for W3C accessibility compliance

Copilot · gvegayon · Copilot · commit 9d73958cfab8 · 2026-02-21T00:43:03.000Z
Co-authored-by: gvegayon &lt;893619+gvegayon@users.noreply.github.com&gt;
diff --git a/01-git/lab.qmd b/01-git/lab.qmd
@@ -35,7 +35,7 @@ To start you just need to use the Fork button available on the project you would
 [^githubmanualfork]: For more details, take a look at the [Forking Projects](https://guides.github.com/activities/forking/) article in GitHub guides.
 
 <figure>
-<img src="https://github-images.s3.amazonaws.com/help/bootcamp/Bootcamp-Fork.png" width="400px">
+<img src="https://github-images.s3.amazonaws.com/help/bootcamp/Bootcamp-Fork.png" width="400px" alt="GitHub fork button on a repository page">
 <figcaption>Source: GitHub Help</figcaption>
 </figure>
 
@@ -46,14 +46,14 @@ Once you "Fork" a project, GitHub will:
 2. Set up a pipeline to generate pull requests.
 
 <figure>
-<img src="https://github-images.s3.amazonaws.com/help/pull_requests/recently_pushed_branch.png" width="600px">
+<img src="https://github-images.s3.amazonaws.com/help/pull_requests/recently_pushed_branch.png" width="600px" alt="GitHub notification showing a recently pushed branch with a Compare and pull request button">
 <figcaption>Source: GitHub Help</figcaption>
 </figure>
 
 Or 
 
 <figure>
-<img src="https://user-images.githubusercontent.com/893619/132388465-849ef04d-ad4f-4365-a646-27e88cb9d828.png" width="600px">
+<img src="https://user-images.githubusercontent.com/893619/132388465-849ef04d-ad4f-4365-a646-27e88cb9d828.png" width="600px" alt="Screenshot of GitHub interface showing pull request creation">
 <figcaption>Source: Screenshot!</figcaption>
 </figure>
 
@@ -105,7 +105,7 @@ This is the final step. Overall, pull requests (PR) are as complex as the propos
 To create the PR, you just need to go to your online copy of the project and click on the "Compare & pull request" link:
 
 <figure>
-<img src="https://github-images.s3.amazonaws.com/help/pull_requests/recently_pushed_branch.png" width="600px">
+<img src="https://github-images.s3.amazonaws.com/help/pull_requests/recently_pushed_branch.png" width="600px" alt="GitHub notification showing a recently pushed branch with a Compare and pull request button">
 <figcaption>Source: GitHub Help</figcaption>
 </figure>
 
diff --git a/01-git/quarto.qmd b/01-git/quarto.qmd
@@ -75,7 +75,7 @@ opts_chunk$set(warning = FALSE, message = FALSE, echo = FALSE, comment = "")
 ::: {.r-fit-text}
 
 ::: {.fragment}
-![](fig/rstudio-qmd-how-it-works.png){style="width: 800px;"}
+![](fig/rstudio-qmd-how-it-works.png){style="width: 800px;" fig-alt="Diagram showing how Quarto works: a .qmd file is processed by knitr and Pandoc to produce HTML, PDF, or Word output"}
 :::
 
 Source: Quarto website https://quarto.org/docs/faq/rmarkdown.html
diff --git a/01-git/slides.qmd b/01-git/slides.qmd
@@ -90,7 +90,7 @@ Throughout the course, we will be using the following tools:
 :::
 
 ::: {.column width="20%"}
-![](https://upload.wikimedia.org/wikipedia/commons/a/af/Revision_controlled_project_visualization-2010-24-02.svg)
+![](https://upload.wikimedia.org/wikipedia/commons/a/af/Revision_controlled_project_visualization-2010-24-02.svg){fig-alt="Diagram of version-controlled project history showing branching and merging of revisions over time"}
 <!-- <img src="https://upload.wikimedia.org/wikipedia/commons/a/af/Revision_controlled_project_visualization-2010-24-02.svg" alt="Diagram of version control" width="100%"> -->
 :::
 :::
@@ -166,7 +166,7 @@ In these cases, and no doubt others, a version control system should make your l
 ::: {.r-fit-text}
 During this class (and perhaps, the entire program,) we will be using
  <!-- <a href="" target="_blank"> -->
-[<img style="width: 100px;vertical-align: middle;" src="https://upload.wikimedia.org/wikipedia/commons/e/e0/Git-logo.svg">](https://commons.wikimedia.org/wiki/File:Git-logo.svg) 
+[<img style="width: 100px;vertical-align: middle;" src="https://upload.wikimedia.org/wikipedia/commons/e/e0/Git-logo.svg" alt="Git logo">](https://commons.wikimedia.org/wiki/File:Git-logo.svg) 
 
 ::: {.fragment .fade-in}
 - Git is used by [most developers in the world](https://insights.stackoverflow.com/survey/2018#work-_-version-control).
diff --git a/02-essentials/slides.qmd b/02-essentials/slides.qmd
@@ -204,23 +204,23 @@ attributes(HairEyeColor)
 
 * An Integrated Development Environment (IDE) to organize and facilitate common tasks coding in R
 
-<img src="./fig/RStudio_0.png" style="width:400px;">
+<img src="./fig/RStudio_0.png" style="width:400px;" alt="RStudio IDE screenshot showing the overall layout">
 
-<img src="./fig/RStudio_1.png" style="width:400px;">
+<img src="./fig/RStudio_1.png" style="width:400px;" alt="RStudio IDE screenshot showing the console panel">
 
-<img src="./fig/RStudio_2.png" style="width:400px;">
+<img src="./fig/RStudio_2.png" style="width:400px;" alt="RStudio IDE screenshot showing the source editor panel">
 
-<img src="./fig/RStudio_3.png" style="width:400px;">
+<img src="./fig/RStudio_3.png" style="width:400px;" alt="RStudio IDE screenshot showing the environment and history panel">
 
-<img src="./fig/RStudio_4.png" style="width:400px;">
+<img src="./fig/RStudio_4.png" style="width:400px;" alt="RStudio IDE screenshot showing the files and plots panel">
 
-<img src="./fig/RStudio_5.png" style="width:400px;">
+<img src="./fig/RStudio_5.png" style="width:400px;" alt="RStudio IDE screenshot showing packages panel">
 
-<img src="./fig/RStudio_6.png" style="width:400px;">
+<img src="./fig/RStudio_6.png" style="width:400px;" alt="RStudio IDE screenshot showing the help panel">
 
-<img src="./fig/RStudio_7.png" style="width:400px;">
+<img src="./fig/RStudio_7.png" style="width:400px;" alt="RStudio IDE screenshot showing the viewer panel">
 
-<img src="./fig/RStudio_8.png" style="width:400px;">
+<img src="./fig/RStudio_8.png" style="width:400px;" alt="RStudio IDE screenshot showing the connections panel">
 
 ---
 
diff --git a/03-debugging-and-profiling/slides.qmd b/03-debugging-and-profiling/slides.qmd
@@ -103,7 +103,7 @@ With debugging start top-down.  Assume lower-level functions are correct until f
 
 An example from collaboration:
 
-<img src="./fig/modular_collaboration.png" style="width:1000px;">
+<img src="./fig/modular_collaboration.png" style="width:1000px;" alt="Diagram showing modular collaboration pattern in software development with top-level and lower-level function modules">
 
 
 An example from an R package: [SeqSGPV](https://github.com/chipmanj/SeqSGPV/blob/master/R/SeqSGPV.R)
diff --git a/04-more-functions-and-datatable/slides.qmd b/04-more-functions-and-datatable/slides.qmd
@@ -277,7 +277,7 @@ Before we continue, let's learn a bit more on `data.table` and `dtplyr`
 square brackets. Here is common way to imagine DT:
 
 <div align="center">
-<img src="datatable-syntax-paths.svg" width="700px">
+<img src="datatable-syntax-paths.svg" width="700px" alt="Diagram illustrating data.table syntax: DT[i, j, by] where i filters rows, j selects or computes columns, and by groups results">
 </div>
 
 - Any time that you see **:=** in **j** that is "Assignment by reference." Using
@@ -349,7 +349,7 @@ address(dat_ldt$parent)
 dat_ldt <- lazy_dt(dat, immutable = TRUE) 
 ```
 
-![](pointer-paths.svg){width="800px"}
+![](pointer-paths.svg){width="800px" fig-alt="Diagram illustrating R object pointer behavior: showing memory address sharing and copying when modifying a data.table object"}
 
 Question: What is the `immutable = FALSE` option used for?
 
diff --git a/06-rcpp/slides.qmd b/06-rcpp/slides.qmd
@@ -29,8 +29,8 @@ slides_eval <- TRUE
 ## Before we start {style="font-size: 16pt"}
 
 <div style="text-align: center; margin: auto;">
-<a href="https://imgflip.com/i/38ji3q"><img src="https://i.imgflip.com/38ji3q.jpg" title="made at imgflip.com" width="30%"/></a>
-<a href="https://imgflip.com/i/38jiku"><img src="https://i.imgflip.com/38jiku.jpg" title="made at imgflip.com" width="30%"/></a>
+<a href="https://imgflip.com/i/38ji3q"><img src="https://i.imgflip.com/38ji3q.jpg" title="made at imgflip.com" alt="Meme: one does not simply avoid writing C++ when using Rcpp" width="30%"/></a>
+<a href="https://imgflip.com/i/38jiku"><img src="https://i.imgflip.com/38jiku.jpg" title="made at imgflip.com" alt="Meme: Emergency broadcast - your R code will get a serious speed boost with Rcpp" width="30%"/></a>
 </div>
 
 1.  You need to have Rcpp installed in your system:
@@ -373,7 +373,7 @@ Rcpp::sourceCpp("norm.cpp", verbose = TRUE)
 <div style="text-align:center;margin:auto;">
 Now, get ready for some Rcpp action!
 
-<img src="https://giphygifs.s3.amazonaws.com/media/8rOtpl0yzFe6I/giphy.gif" width="800px"/>
+<img src="https://giphygifs.s3.amazonaws.com/media/8rOtpl0yzFe6I/giphy.gif" width="800px" alt="Animated GIF of an excited crowd cheering"/>
 </div>
 
 
diff --git a/07-parallel-computing/slides.qmd b/07-parallel-computing/slides.qmd
@@ -23,7 +23,7 @@ embed-resources: true
 
 # Fundamentals {background-color="#515A5A"}
 
-![](https://raw.githubusercontent.com/USCbiostats/hpc-with-r/df60e1cfdc0f848f4f0de5a0aa7d0833f4cfe3d5/fig/bulldog-teaches-baby-crawl.gif){fig-align="center"}
+![](https://raw.githubusercontent.com/USCbiostats/hpc-with-r/df60e1cfdc0f848f4f0de5a0aa7d0833f4cfe3d5/fig/bulldog-teaches-baby-crawl.gif){fig-align="center" fig-alt="Animated GIF of a bulldog teaching a baby to crawl"}
 
 
 
@@ -94,7 +94,7 @@ f(1:4)
 - 3 idle cores.
 :::
 ::: {.column width="60%"}
-![](fig/pll-computing-explained-serial.svg){width=450px}
+![](fig/pll-computing-explained-serial.svg){width=450px fig-alt="Diagram showing serial computing: one core processes tasks one element at a time while other cores are idle"}
 :::
 :::
 
@@ -115,7 +115,7 @@ f_pll(1:4)
 - 4 times faster.
 :::
 ::: {.column width="60%"}
-![](fig/pll-computing-explained-parallel.svg){width=450px}
+![](fig/pll-computing-explained-parallel.svg){width=450px fig-alt="Diagram showing parallel computing: four cores each process one element simultaneously with no idle cores"}
 :::
 :::
 
@@ -124,7 +124,7 @@ f_pll(1:4)
 
 <text style="color:white;">Let's think before we start...</text>
 
-![](https://media.giphy.com/media/Dwclsfe6Gb91m/giphy.gif){style="width:500px"}
+![](https://media.giphy.com/media/Dwclsfe6Gb91m/giphy.gif){style="width:500px" fig-alt="Animated GIF illustrating a thinking or decision-making moment"}
 
 <text style="color:white;">When is it a good idea to go HPC?</text>
 
@@ -320,7 +320,7 @@ And there's also a more advanced set of options
 - Multiple types of cluster: `PSOCK`, `Fork`, `MPI`, etc.
 :::
 ::: {.column width="50%"}
-![](fig/parallel-package.svg)
+![](fig/parallel-package.svg){fig-alt="Diagram showing the R parallel package architecture with clusters composed of local and remote R sessions"}
 :::
 :::
 
@@ -760,7 +760,7 @@ Using a Fork cluster instead of a PSOCK cluster can further reduce the overhead
 
 ## {style="text-align:center!important;"}
 
-```{r thanks, out.width="300px", echo=FALSE}
+```{r thanks, out.width="300px", echo=FALSE, fig.alt="Animated GIF of a runner celebrating a fast finish, representing speed gains from parallel computing"}
 knitr::include_graphics("fig/speed.gif")
 ```
 
diff --git a/09-openmp-slurm/lab.qmd b/09-openmp-slurm/lab.qmd
@@ -75,7 +75,7 @@ We will use OpenMP to accelerate the function.
 # RcppArmadillo and OpenMP
 
 <p style="text-align:center;color:white;font-size:200%;">
-RcppArmadillo + OpenMP<br>=<br><img src="https://media.giphy.com/media/WUq1cg9K7uzHa/giphy.gif" style="width:400px">
+RcppArmadillo + OpenMP<br>=<br><img src="https://media.giphy.com/media/WUq1cg9K7uzHa/giphy.gif" style="width:400px" alt="Animated GIF of a happy celebration, representing the power of combining RcppArmadillo with OpenMP">
 </p>
 
 *   Friendlier than [**RcppParallel**](http://rcppcore.github.io/RcppParallel/)...
@@ -269,7 +269,7 @@ squeue -u$(id -u)
 
 Once your job is submitted, the R script should generate a boxplot like the following:
 
-<img src="openmp-exampl.png" style="width: 80%">
+<img src="openmp-exampl.png" style="width: 80%" alt="Boxplot comparing execution times of serial versus parallel OpenMP implementations in R">
 
 ## Single job
 
diff --git a/15-autoreport/README.md b/15-autoreport/README.md
@@ -1,7 +1,6 @@
 
 
-![GitHub last
-commit](https://img.shields.io/github/last-commit/UofUEpiBio/PHS-7045-egga.png)
+![GitHub last commit](https://img.shields.io/github/last-commit/UofUEpiBio/PHS-7045-egga.png)
 
 # Latest papers on Agent-Based Modeling in PubMed
 
diff --git a/15-autoreport/slides.qmd b/15-autoreport/slides.qmd
@@ -47,7 +47,7 @@ The resulting report can be viewed at [https://github.com/UofUEpiBio/PHS-7045-eg
 
 We need to extract the information from [this website](https://pubmed.ncbi.nlm.nih.gov/?term=agent-based+model&sort=date){target="_blank"}:
 
-![](fig/pubmed.png){width="70%" fig-align="center"}
+![](fig/pubmed.png){width="70%" fig-align="center" fig-alt="Screenshot of PubMed search results page showing recent papers about agent-based models"}
 
 ::: {.fragment}
 Let's start by looking into the Quarto document used to do so. You can download it from [here](https://github.com/UofUEpiBio/PHS-7045-egga){target="_blank"}.
diff --git a/projects/02-langtons-ant/README.md b/projects/02-langtons-ant/README.md
@@ -24,6 +24,6 @@ directions at each step it takes. The "ant" moves according to the rules below:
 
 Here is an animation of the expected result.
 
-![](ant.gif)
+![Animation of Langton's Ant cellular automaton showing the ant's path creating complex patterns on a grid](ant.gif)
 
 <div>The ant icon was made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
diff --git a/projects/04-monopoly-game/README.md b/projects/04-monopoly-game/README.md
@@ -35,7 +35,7 @@ If everything goes as expected, you should be getting something like the followi
 plot in which the distribution of the number of times an indivual steps into any
 of the 40 locations of the board (excluding chance and community chest).
 
-![](monopoly.png)
+![Bar chart showing distribution of landing frequencies across the 40 Monopoly board locations based on 50,000 simulated games](monopoly.png)
 
 The simulation was carried out 50000, each time throwing the die 500 times.
 
@@ -47,7 +47,7 @@ To create the simulation, use the following description of the board and cards.
 
 ## Board
 
-![](monopoly-board-us-edition-after-sep-2008.png "Downloaded from http://monopoly.wikia.com/wiki/Monopoly_Board")
+![US Monopoly board showing all 40 property spaces, railroads, utilities, and corner spaces](monopoly-board-us-edition-after-sep-2008.png "Downloaded from http://monopoly.wikia.com/wiki/Monopoly_Board")
 
 ## Community Chest ([source](http://monopoly.wikia.com/wiki/Community_Chest))
 
diff --git a/projects/07-rejection/README.md b/projects/07-rejection/README.md
@@ -26,7 +26,7 @@ For i = 1 to n do:
 The following plot shows the result of a simple implementation of the algorithm
 (not very computationally efficient)
 
-![](rejection.png)
+![Scatter plot of rejection sampling results: uniformly distributed points in a 2D ball (left) and exponentially decreasing acceptance rates for higher dimensions (right)](rejection.png)
 
 The figure on the left shows the distribution of 10,000 points distributed
 uniformly distributed in a d=2 ball, and the figure on the right shows the
