Submitted over 1 year ago

Responsive Designo Multi-Page Website with Grid and Flexbox

#accessibility#bem#lighthouse#progressive-enhancement#sass/scss

Vanza Setia• 27,835

@vanzasetia

Preview site View code

This is a solution for...

Designo multi-page website

HTML
CSS
JS

5guru

View challenge

Design comparison

SolutionDesign

Solution retrospective

Hello everyone! 👋

I finished my first guru challenge! It felt amazing to complete this challenge at the end of 2022.

I learned a lot of things when building this project. I wrote everything that I had learned in README. There are eight things that I learned. I hope it can help developers to do this challenge.

If you notice there is something wrong or things that can be improved, please do let me know. I am happy to fix or improve the README so that it can be helpful for developers.

Grace Snow answered all my questions in Slack so I do not have any questions. Thank you, Grace! 😊

Any suggestions for improvements are welcome. Also, you can ask me any questions about the technique that I used.

If you have finished this challenge and would like me to give feedback on it, please include a link to your solution. I would be glad to help you! 😀

Thanks!

Community feedback

LarryTheFatCat• 50

@LarryTheFatCat

Posted over 1 year ago

Hey, @vanzasetia!

Great work on this Guru Leveled challenge, the replication was very precise and the overall code looks great! Fix up the 2 very simple issues on the HTML report and overall great job!

Vanza Setia• 27,835

@vanzasetia

Posted over 1 year ago

Hi, @TwoThreeTwo!

Thank you for the nice comment!

About the HTML validation report, those are not issues. They are labeled as "INFO".

I used role="contentinfo" on <footer> to make sure that VoiceOver reads it as a footer.

Reference: <footer> - HTML: HyperText Markup Language | MDN #accessibility_concerns

I added role="list" to the <ul> to bring back the semantic meaning of the list element after I set list-style: none.

Reference: A Modern CSS Reset

Hamzat Lawal• 580

@EngineerHamziey

Posted about 1 year ago

Hello sir, how have you been? please I'll be glad to have your review on my new solution

Vanza Setia• 27,835

@vanzasetia

Posted about 1 year ago

@EngineerHamziey

Hi, Hamzat! I am doing great. Also, just call me Vanza. 😄

I am still learning React. Also, I never did the challenge. So I can't give advice on your solution. Sorry!

Hamzat Lawal• 580

@EngineerHamziey

Posted about 1 year ago

@vanzasetia ok Vanza, thanks for being honest

Please log in to post a comment

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