Petrit Nuredini• 2,860
@petritnuredini
Posted
Congratulations on completing your Frontend Mentor project! Here are a few best practices to consider:
-
Accessibility and Semantic HTML:
- Enhance accessibility by providing meaningful alternative text for your images. For instance, in the
<img>
tags within.card__image
and.card__avatar
, add descriptive alt texts. This is crucial for screen reader users and SEO. Here's a resource to learn more about accessible images.
- Enhance accessibility by providing meaningful alternative text for your images. For instance, in the
-
Responsive Design:
- Great job on implementing a media query for smaller screens! Consider adding more breakpoints to ensure your design remains consistent across various device sizes. Explore using relative units like
em
orrem
instead ofpx
for font sizes, margins, and paddings to enhance scalability and responsiveness. Check out this guide on responsive design.
- Great job on implementing a media query for smaller screens! Consider adding more breakpoints to ensure your design remains consistent across various device sizes. Explore using relative units like
-
CSS Optimization:
- Refactor your CSS to avoid repetition. For example, the transition properties in
.card__heading
can be shortened totransition: all 0.3s;
. Also, consider organizing your CSS properties alphabetically within selectors for better readability. Here's a helpful article on CSS organization best practices.
- Refactor your CSS to avoid repetition. For example, the transition properties in
Keep up the excellent work! Each project is a step forward in your development journey. Remember, coding is about continuous improvement and learning. Your progress is impressive, and I'm excited to see what you'll create next! 🌟💻👍
Marked as helpful
0