Design comparison
SolutionDesign
Solution retrospective
I actually enjoyed doing this challenge. My media query isn't the greatest - i know - too much work and too many little fixes but i hope to improve on my media query knowledge in the future. Would you recommend using the mobile first approach or the desktop first approach? Thanks :)
Community feedback
- @tesla-ambassadorPosted over 2 years ago
Hey Leverh. Congrats on completing this great challenge! Your solution is looking pretty sharp!
- It doesn't really matter whether you use mobile first or desktop (I use both π) but most of the time I'd recommend desktop cause It's much easier to add appropriate styles (You are able to see what fits and what doesn't fit easily). On some occasions, you might want to use mobile first (Usually when I don't have that many components on my desktop) It's faster! You might want to also add some media queries on screens between 375px and 1170px to improve your website's responsiveness. follow this link to learn more about media queries.
- You might also want to wrap your
div
with the attribution class in a landmark, in your case you could use the<footer>
tag. To resolve some of your accessibility issues. - You might wanna use heading tags (
<h2> - <h6>
) in your<sections>
. In your case, you have two options, you can use<div>
instead of the<section>
because thediv
doesn't require you to add heading tags or you can make the headings to your sections<h2>
tags. This will clear all your HTML validation issues Happy coding and keep up the good work!
Marked as helpful1@leverhPosted over 2 years ago@tesla-ambassador Thanks! that's some great feedback. I got a bit lazy in the end with the media query but i'll go back to it and do some more later. Thank you again x
1
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