Design comparison
Solution retrospective
I'm most proud of how I successfully applied semantic HTML5 markup, Sass for better CSS structure, and responsive design techniques to make the project look great on various screen sizes. Using mixins to streamline styling in Sass was a key highlight for me, and I also feel accomplished in balancing the layout with Flexbox, ensuring a clean and functional design. Next time, I would focus more on optimizing my workflow by planning ahead for potential improvements in interactivity—maybe by integrating some JavaScript for dynamic content. I would also consider experimenting with CSS Grid for more complex layouts, to continue expanding my skill set.
What challenges did you encounter, and how did you overcome them?One of the biggest challenges I encountered was making sure each element's size matched the design precisely. At first, it was tricky to get everything aligned and scaled correctly, especially when balancing padding, margins, and responsive adjustments. To overcome this, I carefully analyzed the design requirements and experimented with different unit types, ultimately settling on rem
for consistency. I also relied heavily on Chrome's developer tools to inspect and adjust each element in real-time, ensuring they met the design specs. This process taught me the importance of precision and patience when working with design measurements.
I would love to get more insights on improving accessibility in my projects, especially when it comes to ARIA labeling. Although I’ve used basic alt text and role attributes, I want to ensure that my components are as accessible as possible for all users, including those who rely on screen readers. Additionally, I’d appreciate guidance on writing more advanced @mixin rules in Sass, as I see a lot of potential in using them for cleaner, more reusable code. Learning best practices for both accessibility and Sass techniques would really help me level up my development skills.
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