
Please log in to post a comment
Log in with GitHubCommunity feedback
- @KumaKorin
1. Semantic HTML
- But, did you know there’s no such thing as
<h7>
in HTML? 🤔 Maybe consider using a<span>
or<p>
instead and style it with CSS. Using proper semantic tags is super important for accessibility and SEO!
2. Accessibility
- Good stuff: Your design is clean and easy to understand, yay! 🎉
- Improvements:
- Alt for images: Don't forget to add
alt
attributes to your images in HTML! It helps screen readers understand what the image is about. - Focus states: You added a hover effect on
.component
(which is awesome, by the way 😄), but what about keyboard users? Maybe you could add a similar:focus
state for better accessibility!
- Alt for images: Don't forget to add
3. Responsiveness
- I love that you added a media query for screens under 500px! It’s so nice to see that
.component
shrinks to 90% width and the profile image adjusts too. 🌟 - But, um, what about larger screens (like desktops)? Maybe you could think about adding styles for screens wider than 1200px to make it look even better on big monitors! 🖥️
4. Code Structure
- Your CSS looks neat and organized! The class names are super clear, so it’s easy to guess what they’re doing. Nice job! 🥳
- But… I noticed a few repetitive rules, like
margin-left: auto; margin-right: auto;
. Maybe you could move those into a reusable class or a parent container? It’ll save you some work later!
Marked as helpful - But, did you know there’s no such thing as
Join 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