Skip to content
Submitted about 1 year ago

huddle landing page with single introductory section master

sass/scss
@Mohammad-Irfan-Noorzada
A solution to the Huddle landing page with a single introductory section challenge

Solution retrospective


What are you most proud of, and what would you do differently next time?

I'm proud of successfully implementing a fully responsive layout using CSS Flexbox and a mobile-first workflow. I managed to match the design closely and optimize the images for better performance. I’m proud that I understood and applied the feedback from my previous challenges to improve my code structure and semantic HTML.

What challenges did you encounter, and how did you overcome them?

I encountered challenges with making the background image responsive while maintaining the correct proportions across devices. After researching, I used a combination of background-size: cover and media queries to adjust the image dynamically.

Another challenge was understanding how to use Sass mixins for breakpoints. Initially, I had errors due to undefined mixins, but after checking my file structure and imports, I resolved the issue.

These challenges helped me deepen my understanding of responsive design and the importance of organizing Sass files properly.

What specific areas of your project would you like help with?

I’d like help with two specific areas: Responsiveness and Accessibility. For responsiveness, while my solution works on most screen sizes, I’m unsure if it’s fully optimized, especially for larger screens. Feedback on my media queries and layout adjustments would be helpful. For accessibility, I’m still learning how to make my projects more inclusive. I’d appreciate suggestions on improving semantic HTML and ensuring compatibility with screen readers.

Code
Loading...

Please log in to post a comment

Log in

Community feedback

No feedback yet. Be the first to give feedback on Mohammad Irfan’s solution.

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