Design comparison
SolutionDesign
Community feedback
- @0xabdulPosted over 1 year ago
Hey there well congrats on completing the results summary card component π€©
- A Some recommendation for improve your code π
- In Html π·οΈ :
- whenever using the img tag put the alt attribute
- Ensure all informative <img> elements have short, descriptive alternate text and all decorative <img> elements have empty alt attributes (e.g. alt="").
- There are three main ways to add alternate text to an image:
Using an alt attribute i.e.
<img alt="drawing of a cat" src="...">
Using an aria-label i.e.<img aria-label="drawing of a cat" src="...">
Using an aria-labelledby attribute i.e.<img arialabelledby="someID" src="...">
- Heading π·οΈ
- you must use the <h1> , <h2> , <h3> , <h4> ect.. for Accessibility reports
- using the header tag line by line or sequence
- Ex :
<h1>Your results</h1> <h2>Great</h2> <h3>Summary</h3>
- I Hope it's useful for youβ
- Happy Coding
toolboxal
π€©
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord