Responsive design using patience, lots... of... patience... :)
Design comparison
Solution retrospective
I'm getting better at sorting out the layout in a reasonable time frame. Let me know what you think of the code and any feedback is much appreciated my fellow front enders :)
Community feedback
- @FluffyKasPosted over 2 years ago
Hey there,
Your solution looks great! Pretty much pixel-perfect on all screen sizes 😊 There are only a few things you could double-check - mostly regarding the markup:
-
I think using article elements isn't the best choice here. A simple div or section would do the job, there's no need to overthink it.
-
Footer links are typically not wrapped in a nav. Using just a ul would be fine but all the list items inside should be links (so wrapped in a tags).
-
Similar goes to the social media icons: you could wrap them in a tags and give them aria-labels (those would be useful for people who can't see the actual images).
-
The company logos are missing alt texts. This section would also benefit from some visually hidden section title (look up an sr-only class, there are some good code snippets out there), so the user knows what's the purpose of the section before the company names are announced by the screen reader.
-
Some github best practices: make sure you remove any commented out code that you no longer need (theres some in your footer section). Same goes for unnecessary/unused files. You could add the style guide and the design folder to the gitignore file so they don't get needlessly uploaded 😊 Your js file is also empty.
It's also a good idea to write a nice README file, especially since Frontend Mentor provides such a good template for it. A good documentation is something that employers tend to like :)
I hope you don't find my suggestions too nitpicky. It's always a good idea to pay attention to accessibility as well. Overall I think what you did looks great! 😊 Happy coding!
0 -
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