Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
Getting it to look as close I could to the original.
What specific areas of your project would you like help with?I'm not sure if there is anything specific that needs fixed. So any feedback would be much appreciated.
Community feedback
- @MikDra1Posted 3 months ago
To improve the HTML and CSS, consider the following:
- Semantic HTML: Use more descriptive HTML5 elements like <header>, <nav>, <main>, and <footer> to enhance accessibility and structure.
- CSS Organization: Group related CSS rules (e.g., typography, layout, colors) for better readability. Consider using a preprocessor like SASS for modularity.
- Responsive Design: Ensure the layout adapts smoothly across various screen sizes, possibly integrating media queries for better control.
- Accessibility: Improve ARIA roles and labels for screen readers. Ensure high contrast for text and background colors.
Hope you found this comment helpful 💗
Good job and keep going 😁😊😉
Marked as helpful1 - @AffanRMPosted 4 months ago
Hey, good work on the website! There are a couple of suggestions I have for you:
- Firstly, it's better to specify the font size in rem/em units rather than pixels (px) as it helps improve the acesssibility of the website
- Secondly, you can add the following code to your buttons so that the cursor changes to pointer when the user hovers on them:
button {cursor : pointer;}
Marked as helpful1@AbdopaminedPosted 4 months ago@AffanRM Thank you I will learn about these units and will keep the cursor in mind when I improve the solution.
1@AffanRMPosted 4 months ago@Abdopamined I'm glad I could help. Let me know if you need any further assistance!
1
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