Design comparison
Community feedback
- @petritnurediniPosted 9 months ago
Congratulations on successfully completing the testimonials grid section project! 🎉 Your dedication to mastering frontend development is evident in your work. Here are some best practices and suggestions to take your project to the next level:
HTML Best Practices:
- Semantic HTML: Great job with the structure of your HTML. Consider using
<section>
for each testimonial card for better semantic understanding. - Alt Attributes: Ensure all images have descriptive
alt
attributes. This is crucial for accessibility and SEO.
CSS Best Practices:
- Responsive Design: Your CSS grid layout for the testimonials is well-executed. To further enhance responsiveness, ensure the design remains fluid and adaptable across various screen sizes.
- CSS Variables: Good use of CSS custom properties. This practice makes maintaining and updating styles much more manageable.
- Selector Specificity: Maintain low specificity in your CSS selectors where possible. This will make your CSS easier to maintain and override if needed.
Accessibility:
- Contrast Ratio: Ensure that the text color contrasts well with the background for readability, especially with different themes like dark or light modes.
- Keyboard Navigation: Make sure that all interactive elements are accessible via keyboard.
Performance:
- Optimize Images: Compress images to reduce load times, especially for web use.
Code Organization:
- Modular CSS: Consider breaking your CSS into multiple files for easier management, especially as your project grows.
Learning Resources:
- For advanced CSS techniques, CSS Tricks is a great resource.
- To deepen your understanding of semantic HTML, check out MDN Web Docs.
- For accessibility best practices, WebAIM is an excellent resource.
- To optimize images, you can use online tools like TinyPNG.
Keep exploring and experimenting with new technologies and techniques. Every project is a new learning opportunity, and you're doing an amazing job! Keep coding and pushing your limits. 👍
Marked as helpful3@xStephxPosted 9 months ago@petritnuredini thanks for the feedback! I read some really useful information in your feedback about my solution, and I will practice the advices you gave me and I will read and try resources you gave me. If you have any other suggestions or advices, feel free to write to me, I'm glad you took the time for feedback! 🚀🚀🚀
0 - Semantic HTML: Great job with the structure of your HTML. Consider using
- @iamkishoremahtoPosted 10 months ago
Nice Work
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