Design comparison
SolutionDesign
Community feedback
- @StroudyPosted 2 months ago
Hey great solution here, few things i noticed,
- Missing a
<meta>
description tag for SEO purposes - It is best practice to have a
<main>
tag inside your body highlighting the main section. - Using a naming convention like BEM, Using proper naming will prepare you for the changes in design of the website.
- You should apply a full modern reset to make things easier as you build, check out this site for a Full modern reset.
- Line height is usually unitless instead of
line-height: 150%;
should useline-height: 1.5;
this means it is 1.5 x the font-size, unitless value ensures that the line height will scale proportionately. - Using
max-width: 100%
ormin-width: 100%
is way more responsive then justwidth:100%
, check out this article also from the same Frontend mentor dev responsive-meaning, she goes into more detail. - Check out this article from a Frontend mentor dev about responsive-meaning.
- Having an aspect ratio on your images will increase performance to reduce layout shifts and improve CLS,
Really good job, Nice to see you using responsive units like
rem
andem
, Happy Coding!Marked as helpful1@StroudyPosted 2 months ago@Artiqq Your welcome, Will be good to see some more from you soon! Good luck.
0 - Missing a
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