Design comparison
Solution retrospective
Added main tag to contents section, alt attributes for image elements and an h1 heading to help screen readers identify the main heading of the page.
Community feedback
- Account deleted
Hi there!! βοΈ
Congrats on completing this challenge!! π₯³
Answering your question.
You can use BEM Methodology, this methodology helps you to create shorter and more efficient code, and thus avoid specificity problems.
Also here are some tips to improve your code... π
HTML: π§±
Your main content should be inside the
main
tag, more info hereYou should not forget to use the
h1
tag, it is very important on your website. You must remember that it is only used once, and continue successively with h1, h2, ..., h6 and NOT SKIP HEADER LEVELS. More info about that hereYour
img
tags must have thealt
attribute. You should not forget it. More info hereCSS: π¨
I can see that you have a little reset for the default styles that the browser gives, that's ok. But you can improve it by using other resets like the following:
Your solution is very good. π―
Happy coding! βοΈπ
Marked as helpful1 - @ayushkanyalPosted about 1 year ago
Hey Christian,
Thank you so much for your thorough feedback! I have improved my solution because of your insights. I did the following changes:
- Added main tag to contents section.
- Alt text attributes for image elements.
- An h1 heading to help screen readers identify the main heading of the page.
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