Design comparison
Solution retrospective
What did you find difficult while building the project? Which areas of your code are you unsure of? Do you have any questions about best practices?
Community feedback
- @correlucasPosted about 2 years ago
πΎHello @tiger8707, Congratulations on completing this challenge!
Great code and great solution! Iβve few suggestions for you that you can consider adding to your code:
1.Add the website favicon inserting the svg image inside the
<head>
.<link rel="icon" type="image/x-icon" href="./images/favicon-32x32.png">
2.Add transitions to make the interaction smoother while the element gets hovered, you can use a value like
transition: all ease-in 0.5s
.3.Replace the
<h2>
containing the main title with<h1>
note that this title is the main heading for this page and every page needs one h1 to show which is the most important heading. Use the sequence h1 h2 h3 h4 h5 to show the hierarchy of your titles in the level of importance, never jump a level.4.To reduce your CSS file and improve the performance of loading your page you can use a tool called
CSS minify
that reduces the CSS code by removing the unnecessary characters. You can use aVSCode
plugin calledminify css
or this website tool to reduce your code:https://www.toptal.com/developers/cssminifier
βοΈ I hope this helps you and happy coding!
Marked as helpful1 - @VCaramesPosted about 2 years ago
Hey, great job on this project!
Some suggestions to improve you code:
1.To make your content fully accessible use em instead of px for your media queries.
Happy Coding!
Marked as helpful1
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