Git Basics: <Accessibility of screenshots>

[MatthewWestDev]

Checks

• This is not a duplicate of an existing issue (please have a look through our open issues list to make sure)
• I have thoroughly read and understand The Odin Project Contributing Guide
• Would you like to work on this issue?

Describe your suggestion

I'm a low-vision user and this is the first page that I had some difficulty receiving the lesson information due to heavily relying on screenshots. In step 2 of Create the Repository, I am directed to click the button shown in the screenshot. I was able to enlarge the image quite a bit to get the information but a written description of the button itself and where it is located would be helpful. In the rest of the lesson I was unable to use the screenshots of the shell outputs to compare to my local output. It would be some work but it would greatly help if actual text was used instead of the screenshot. Most steps included key information of what to look for in my output which was helpful to confirm I was on the right track. My suggestion moving forward is to use text instead of screenshots if the screenshot is essentially text. Thanks!

Path

Foundations

Lesson Url

https://www.theodinproject.com/lessons/foundations-git-basics

(Optional) Discord Name

No response

(Optional) Additional Comments

No response

[MaoShizhong]

Thank you for opening the issue @MatthewWestDev!
Accessibility is definitely something we're steadily working on improving throughout the site and curriculum.

@thatblindgeye I think we'd greatly value your thoughts here

[thatblindgeye]

We definitely do rely too heavily on screenshots to convey important information. Where providing a screenshot is helpful we should also provide a text alternative (beyond just alt text, because that will only be visible for users navigating via AT such as screen readers or only when the image fails to load). Otherwise, yes we should replace screenshots with text. Relying on screenshots so much also just makes it even more upkeep if even the slightest thing changes on the UI vs the screenshot ("Well now there's another field between these two fields from the screenshot")

I'll open this as help wanted for now, but may try to get around to it myself if I can/nobody else asks to do it.

[kol3x]

Looks like there is a lot of work to do here. I'd like to take it, but don't know if I will have time in the coming days.

[thatblindgeye]

@kol3x I'll assign you for now. If you end up not having the time no worries, just let us know. And if you need any help don't hesitate to reach out.

Just to clarify, the solution for this lesson could be one or both of:

• Replacing screenshots as needed with text based instructions
• Adding/tweaking additional text based context around the screenshots, e.g. instead of "Click the button shown in the following screenshot," we'd say "Click [description or text content of the button, possibly with additional context of where it is on the page], as shown in the following screenshot." or something.