class: center, middle, inverse, title-slide # Learning accessibility in community ## <br> Accessible DataVis <br> Meetup R-Ladies East Lansing ### Andrea Gómez Vargas; Claudia A. Huaylla; Virginia A. García Alonso; <br> Joselyn Chávez; Denisse Fierro Arcos, Paola Corrales ### January, 31st 2022 --- # Overview - R community - Our journey towards accessibility - Where do we begin? - Best practices - Additional references -- ??? Hello everyone, my name is Andrea. I am a sociologist and an organizer of the rladies Buenos Aires chapter. On this occasion I will tell you a little about our experience preparing a talk for useR 2021 and the accessibility practices we applied to our presentation, which may be useful to you when preparing a presentation using R. This talk will cover 5 topics, first I will discuss where the accessibility initiative was born, second I will talk about how we organized ourselves, third I will discuss how we started our journey towards accessibility and the questions we asked ourselves, then I will show you some best practices that we applied to our work, and finally I will share some useful resources that you can refer to when applying accessibility to your own work. --- class: middle, inverse, title-slide # R Community ??? About the R community --- <img src="data:image/png;base64,#fig/community.jpg" title="Illustration by Allison horst that shows the importance of community in learning, which is exemplified as a person being supported by their circles of friends, teachers and mentors represented in aerostatic balloons, along with the support and containment of the community represented in the form of a trampoline. The person is a woman, who is inspired to start doing things on her own with all those around her and accompanying her." alt="Illustration by Allison horst that shows the importance of community in learning, which is exemplified as a person being supported by their circles of friends, teachers and mentors represented in aerostatic balloons, along with the support and containment of the community represented in the form of a trampoline. The person is a woman, who is inspired to start doing things on her own with all those around her and accompanying her." width="65%" style="display: block; margin: auto;" /> ??? I chose this illustration by Allison Horst for this section because it represents what the R community and rladies in particular mean to me. It shows how the work we did for useR would have not been possible without the support of these communities. --- # The team: collective and interdisciplinary work <img src="data:image/png;base64,#fig/team.png" title="Picture of the Survey team, with the headshots of Paola, Andrea, Virginia, Joselyn, Claudia and Denisse" alt="Picture of the Survey team, with the headshots of Paola, Andrea, Virginia, Joselyn, Claudia and Denisse" width="50%" style="display: block; margin: auto;" /> From top left to top right: Paola Corrales (**Atmospheric Scientist**); Andrea Gómez Vargas (**Sociology**); Virginia A. García Alonso (**Marine Biologist**); From bottom left to lower right: Joselyn Chávez (**Biotechnology engineer**); Claudia A. Huaylla (**Mathematical Scientist**); Denisse Fierro Arcos (**Marine Scientist**) ??? And here is where I want to introduce you to the team, all of us belong to 4 rladies chapters based in different cities and countries across Latin America, including Mexico, Ecuador, Colombia and Argentina. All our work is done virtually, in a collaborative manner. I believe that everything that was achieved would not have been possible without our team members. I want to emphasize that we all have different areas of training and knowledge of R, which helped to integrate different perspectives and views of reality and consider the different applications of R into our work. --- class: middle, inverse, title-slide # Our journey towards accessibility ??? So, how did we create accessible presentations? How was our path to accessibility? --- <br> - Understand the needs of latam R users - Call for collaborators - Initial survey design (31 questions and 5 areas of interest) - Reviewed by members of R latam community - Survey translated (Spanish, Portuguese and English) - Survey published and advertised - Presentation of results in useR 2021 ??? In 2020 the Latin American survey project began to emerge, we were interested in knowing how widely R was used across our region where English is not the official language. We wanted data, we needed data to better understand Latin American R users. In August 2020, a group of about 18 people belonging to R communities in Latin America started to develop a survey to know the people who use R in Latin America, The survey was made up of 31 questions that addressed 5 main themes/topics: interest in R, demographic information, education level, relationship with the R user community and the area in which they use R. The survey was conducted in three languages: Spanish, Portuguese and English, so that people could answer in the language they felt most comfortable with. The survey was disseminated through all available communication channels, resulting in more than 900 people completing the survey. And what were we going to do with all that information? In 2021, a group of 6 rladies who wanted to take on the challenge of analyzing and presenting the first survey results got together, and that is how we arrived at useR 2021. --- # Using R in Latin America: the great, the good, the bad, and the ugly <img src="data:image/png;base64,#fig/icono.png" title="Illustrative image of Latin America with the text 'First Latin American survey on the use of R’" alt="Illustrative image of Latin America with the text 'First Latin American survey on the use of R’" width="20%" style="display: block; margin: auto;" /> [Slides in English](https://encuesta-user2021-en.netlify.app/#1) [Slides in Spanish](https://encuesta-user2021-es.netlify.app/#1) [Youtube Presentation](https://www.youtube.com/watch?v=LyBLJlN6dqo) ??? For useR 2021, we presented our results in a presentation entitled: ‘Using R in Latin America: the great, the good, the bad, and the ugly’. We presented our work in two languages: English and Spanish, both in the slides and in the video transcript. Our motivation two use both languages was to represent Latin America in the conference and to bring awareness about the participation of other non-English speakers in the R community. Although data visualization work is done in R, we began to wonder what practices we could implement to make our work more accessible to other users. --- class: middle, inverse, title-slide # Are we inclusive enough? ??? We began to wonder if what we were doing in R was enough to make our results available to as many people as possible. --- class: middle, inverse, title-slide # Where do we begin? ??? Where do we start if we never studied accessibility --- <br> # Identifying what does accessibility mean - the quality of being able to be reached or entered. - the quality of being easy to obtain or use. - the quality of being easily understood or appreciated. ??? The first step was to ask ourselves what accessibility means to each one of us, and discuss our different viewpoints. We also looked for open source resources, and with the information we had, we started to find people who could provide more advice about applying these best practices to our work. --- class: big-font, middle, inverse, title-slide <br> # Accessibility is a RIGHT ??? And here the message I want to give you is that we should think of accessibility as a right, an indispensable human right for the development of a dignified life for people with disabilities, with any type of disability, mild or major, every action we promote and carry out makes us part of this guarantee of rights. For us, it may represent a few more minutes of extra work or training, but for the person benefiting from these actions, it may mean complete access to information they could not access previously. --- <br> # Accessibility basics - **see** well or at all, - **hear** well or at all, - **move** well or at all, - **speak** well or at all, or - **understand** information presented in some ways well or at all ??? So, what's the first thing to keep in mind? Be open to diversity in your audience and any accessibility issues. Basically, be aware that some of your audience might not be able to or have difficulties with: Distinguishing colors Reading text in small font or with poor contrast against its background Hearing you or understanding when you speak at a fast pace Poor internet connection --- class: middle, inverse, title-slide # Best practices for accessible conferences ??? And here I want to share some simple practices that you can implement in your work, regardless of what software or programming language you use. --- # Accessible presentations - Give priority to screen-reader friendly formats - R Markdown (.Rmd) - Xaringan - Avoid using PDF - Use a readable font and font size. - Arial or any Sans serif typeface - At least a 28 point size ??? Some good first steps that you can take towards accessibility include: 1. Use file formats that are screen reader friendly. In R, you could use rmarkdown and xaringan to prepare your slides. This will allow people with visual disabilities to truly access all information included in your presentation through their screen reader. Remember to add an alternative text to all your text and tables to maximize data access. 2. Avoid using PDF format because most screen readers do not work well with it. Often alternative text is lost in this format. 3. Not all fonts are made equal. Fonts like Arial and any in the Sans serif family are best to improve readability. Larger font size is better, for presentations try using font size number 28 or larger. --- # Accessible presentations - Alt-text. - Briefly explaining what you are showing and why. - Describe your images during the presentation. - Colorblind-friendly palettes (viridis, MetBrewer, colorblindr). <img src="data:image/png;base64,#fig/ggplot.png" title="Two ggplot panels, comparing deafult ggplot2 colors versus the ggplot2 result using viridis color palette, Each panel shows three superposed color-filled histograms. The default scale uses the colors salmon, light green and light blue, but viridis scale uses purple,aquamarine and yellow, which gives a better contrast." alt="Two ggplot panels, comparing deafult ggplot2 colors versus the ggplot2 result using viridis color palette, Each panel shows three superposed color-filled histograms. The default scale uses the colors salmon, light green and light blue, but viridis scale uses purple,aquamarine and yellow, which gives a better contrast." width="95%" style="display: block; margin: auto;" /> ??? I mentioned alternative text in the previous slide, you may be wondering what exactly I mean by this. Alternative text, also simply known as alt-text, is a written description of any figures or photos in a presentation. Alt-text is becoming more mainstream and it is now available in many social media platforms, websites, and software used to prepare presentations, including rmarkdown, xaringan and even powerpoint. Before adding the alt-text to a figure, we should not only aim to include a description of the image, but also how it is related to our presentation. Providing some context to the image is key when preparing alt-text. It is always useful first mentioning the type of graph or image presented, what kind of information is included in each of the axis in case of graphs, and whether information is grouped according to a secondary category shown in different colors Another thing to consider for images, especially graphs presenting results is the colour palette being used. We should consider that close to 10% of the world population are affected by some sort of colour blindness, which makes it difficult for them to differentiate some colours. When deciding what palette to use, consider the palettes/packages: viridis, metbrewer, colorblindr, which make great colour blind friendly palettes easy to use in your graphs. The image in this slide gives you an example of what a colour palette looks like to people with different types of colour blindness. The palette shown is viridis, which allows different colours to be easily identifiable across the colour blindness spectrum, and even better, you can identify different colours in gray scale. --- class: middle, inverse, title-slide # How can I implement these best practices in R? ??? Well, here I want to show you a little bit where you can add an alternative text, modify font size and include speaker notes using R. This is the rmarkdown script I used for this presentation, here you can see that I am using the rladies template that already has accessible colors and fonts incorporated, in the chunks are the alternative texts for each of the images that I used, where it is important to describe the images in a thorough and organized manner, and also in each slide you can add speaker notes. All this together is reflected in an optimal way in html. --- class: big-font, middle, inverse, title-slide # Small changes # to include more people ??? And these examples that I have just mentioned are some small actions that only require a few clicks and maybe a little more time and detail, but they will make your presentation more inclusive and guarantee access to information to more people. --- <br> # Additional references - <https://bit.ly/usertheme> - <https://bit.ly/guideudl> - <https://bit.ly/userblog> - <https://bit.ly/guidealttext> - <https://bit.ly/accessiblepresentation> - <https://bit.ly/imagecontent> ??? Finally, I want to share with you some online resources where you can read more about the topic and what new accessibility practices we can continue to apply. --- class: middle, inverse, title-slide # Thank you from our team! <br> <br> [<svg aria-label="GitHub" role="img" viewBox="0 0 496 512" style="height:1em;width:0.97em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:#FFFFFF;overflow:visible;position:relative;"><title>GitHub</title><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg> GitHub repo Rladies East Lansing](https://github.com/rladies-eastlansing/2022-accessible_dataviz) [<svg aria-label="Twitter" role="img" viewBox="0 0 512 512" style="height:1em;width:1em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:#FFFFFF;overflow:visible;position:relative;"><title>Twitter</title><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"/></svg> @RLadiesEastLansing](https://twitter.com/RLadiesELansing) [<svg aria-label="Link" role="img" viewBox="0 0 512 512" style="height:1em;width:1em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:#FFFFFF;overflow:visible;position:relative;"><title>Link</title><path d="M326.612 185.391c59.747 59.809 58.927 155.698.36 214.59-.11.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.699 59.262-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.106-37.106c9.84-9.84 26.786-3.3 27.294 10.606.648 17.722 3.826 35.527 9.69 52.721 1.986 5.822.567 12.262-3.783 16.612l-13.087 13.087c-28.026 28.026-28.905 73.66-1.155 101.96 28.024 28.579 74.086 28.749 102.325.51l67.2-67.19c28.191-28.191 28.073-73.757 0-101.83-3.701-3.694-7.429-6.564-10.341-8.569a16.037 16.037 0 0 1-6.947-12.606c-.396-10.567 3.348-21.456 11.698-29.806l21.054-21.055c5.521-5.521 14.182-6.199 20.584-1.731a152.482 152.482 0 0 1 20.522 17.197zM467.547 44.449c-59.261-59.262-155.69-59.27-214.96 0l-67.2 67.2c-.12.12-.25.25-.36.37-58.566 58.892-59.387 154.781.36 214.59a152.454 152.454 0 0 0 20.521 17.196c6.402 4.468 15.064 3.789 20.584-1.731l21.054-21.055c8.35-8.35 12.094-19.239 11.698-29.806a16.037 16.037 0 0 0-6.947-12.606c-2.912-2.005-6.64-4.875-10.341-8.569-28.073-28.073-28.191-73.639 0-101.83l67.2-67.19c28.239-28.239 74.3-28.069 102.325.51 27.75 28.3 26.872 73.934-1.155 101.96l-13.087 13.087c-4.35 4.35-5.769 10.79-3.783 16.612 5.864 17.194 9.042 34.999 9.69 52.721.509 13.906 17.454 20.446 27.294 10.606l37.106-37.106c59.271-59.259 59.271-155.699.001-214.959z"/></svg> rladies.org](https://rladies.org) [<svg aria-label="Twitter" role="img" viewBox="0 0 512 512" style="height:1em;width:1em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:#FFFFFF;overflow:visible;position:relative;"><title>Twitter</title><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"/></svg> @RLadiesGlobal](https://twitter.com/rladiesglobal) [<svg aria-label="Slack Logo" role="img" viewBox="0 0 448 512" style="height:1em;width:0.88em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:#FFFFFF;overflow:visible;position:relative;"><title>Slack Logo</title><path d="M94.12 315.1c0 25.9-21.16 47.06-47.06 47.06S0 341 0 315.1c0-25.9 21.16-47.06 47.06-47.06h47.06v47.06zm23.72 0c0-25.9 21.16-47.06 47.06-47.06s47.06 21.16 47.06 47.06v117.84c0 25.9-21.16 47.06-47.06 47.06s-47.06-21.16-47.06-47.06V315.1zm47.06-188.98c-25.9 0-47.06-21.16-47.06-47.06S139 32 164.9 32s47.06 21.16 47.06 47.06v47.06H164.9zm0 23.72c25.9 0 47.06 21.16 47.06 47.06s-21.16 47.06-47.06 47.06H47.06C21.16 243.96 0 222.8 0 196.9s21.16-47.06 47.06-47.06H164.9zm188.98 47.06c0-25.9 21.16-47.06 47.06-47.06 25.9 0 47.06 21.16 47.06 47.06s-21.16 47.06-47.06 47.06h-47.06V196.9zm-23.72 0c0 25.9-21.16 47.06-47.06 47.06-25.9 0-47.06-21.16-47.06-47.06V79.06c0-25.9 21.16-47.06 47.06-47.06 25.9 0 47.06 21.16 47.06 47.06V196.9zM283.1 385.88c25.9 0 47.06 21.16 47.06 47.06 0 25.9-21.16 47.06-47.06 47.06-25.9 0-47.06-21.16-47.06-47.06v-47.06h47.06zm0-23.72c-25.9 0-47.06-21.16-47.06-47.06 0-25.9 21.16-47.06 47.06-47.06h117.84c25.9 0 47.06 21.16 47.06 47.06 0 25.9-21.16 47.06-47.06 47.06H283.1z"/></svg> Join the Slack](https://rladies-community-slack.herokuapp.com/) ??? And thank you very much rladies from east lansing for this invitation and allowing us to share our experience! This presentation was also done as a group. Here are the links where you can find the presentation and learn more about rladies global. And you are all welcome to be part of the change.