CodeCow/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-07-13 21:15:35 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix(curriculum) : Added missing cute puppy and tropical-resort images (#62926)

Browse Source 
Co-authored-by: Ilenia <26656284+ilenia-magoni@users.noreply.github.com>
This commit is contained in:
Ayush Sharma 2025-10-23 22:36:01 +05:30 committed by GitHub
parent 62e0170cc3
commit 808d0d0d74
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
curriculum/challenges/english/blocks/lecture-accessible-media-elements/672a55b5c0c14493328fe36e.md
View File

@ -13,7 +13,11 @@ It's essential for making websites accessible to people with visual disabilities
Alternative text is also used by search engines to understand images. Some browsers may also display it when an image is not loaded properly. This can happen when the image file is missing or when the user has connectivity issues. So it's helpful for many different purposes.
A person with a visual disability will not be able to know what's in the image unless it's described in the alt text. An example of bad alt text for an image of a puppy would be "A cute puppy." This text is not specific enough to convey the important details of the image, like what does the puppy look like? Where is the puppy? Are there any important objects around the puppy?
A person with a visual disability will not be able to know what's in the image unless it's described in the alt text. An example of bad alt text for an image of a puppy would be "A cute puppy."
<img src="https://cdn.freecodecamp.org/curriculum/lecture-transcripts/puppy.png" alt="A cute puppy." />
This text is not specific enough to convey the important details of the image, like what does the puppy look like? Where is the puppy? Are there any important objects around the puppy?
Let's improve this. An example of good alternative text would be: "A black and white puppy with an orange collar lies on its belly in the sand, looking off to the side. A bright orange ball rests near its front paws."
@ -27,6 +31,8 @@ It is important to note that there is no one correct way to write alt text for a
Here we have another example of a beautiful tropical resort. Let's describe it.
<img src="https://cdn.freecodecamp.org/curriculum/lecture-transcripts/resort.jpg" alt="Resort.">
An example of bad `alt` text for this image would be "Resort."
This is too short and it doesn't provide enough information about the image. To improve this description, you could expand it to include the most important elements of the image: