Design comparison
Solution retrospective
I really liked how I managed the CSS part since I used layers for the first time. I kept it simple for this project.
Maybe, I would change the css custom property next time.
What specific areas of your project would you like help with?Any Improvement idea would be great, but maybe some tips how to deploy the page to netlify would be helpful since most of the time, I have difficult to deploy the css part of it.
Community feedback
- @MunibAhmad-devPosted 5 months ago
Great jon man! Your use of CSS layers is impressive, especially since it was your first time trying it out. The simplicity you maintained throughout the project really stands out and makes the overall design very clean and user-friendly.
Regarding your CSS custom property, it's great to see you're thinking ahead about improvements. Custom properties can significantly enhance maintainability and scalability, so experimenting more with them in future projects could be beneficial.
For areas of improvement, here are a few suggestions:
CSS Custom Properties: As you mentioned, diving deeper into CSS custom properties (variables) could help. They are excellent for maintaining a consistent design system and making global changes easier. Responsive Design: If not already implemented, ensuring your design is fully responsive would enhance user experience across different devices. Accessibility: Consider incorporating more accessibility features to make your project inclusive for all users. This could involve using semantic HTML, ARIA roles, and ensuring good color contrast. As for deploying your page to Netlify, here's a quick guide that might help:
Repository Setup: Ensure your project is on a Git repository (GitHub, GitLab, Bitbucket). Netlify Account: Create a free Netlify account and log in. New Site from Git: In Netlify, click on "New site from Git" and connect to your repository. Build Settings: Configure the build settings. For a typical static site, you might not need to change much, but ensure your build command and publish directory are set correctly (e.g., npm run build and build for a React app). Deploy: Click "Deploy site". Netlify will handle the rest. I hope these suggestions are helpful. Your project is off to a fantastic start, and with a few tweaks, it can be even more remarkable. Keep up the great work!
Marked as helpful0@AutumnsCodePosted 5 months ago@MunibAhmad-dev Thank you. Yes, I did mobil first, but since this challenge didn't offer much chances between mobil and desktop, it isn't quite noticeable.
1
Please log in to post a comment
Log in with GitHub
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