Less, BEM, Flexbox and Jquery

Please log in to post a comment
Log in with GitHubCommunity feedback
- @YariMorcus
I took a look at your result, and it looks good.
However, I do have some feedback points, which I want to share with you (it is up to you what you do with it):
Critical feedback
- I can submit your form without selecting a number.
This action brings me to the
rated.html
page, which gives me the following message:You selected null out of 5
. This shouldn't happen in a real system, so this is something I would definitely change (like disabling the button if the user did not select a number. In this case, don't forget to enable it again haha).
Other feedback according to the design
- The padding on the top, right and left should be a little larger.
- The padding on the bottom should be a little less (if I am seeing this right in the design).
Other tips
- I see you created a hover state for your links in your footer, but not a visited and activated state (which should exist as well according to Web Accessibility).
- I personally would place
<small>
within<footer>
, to better indicate to assistive technologies (such as screen readers) that the text belongs to a footer (unless there is a reason why you don't want to convey it as footer text). - I always learned to use CSS background images for decorative images (in this case, the
icon-star.svg
). There is a side note here, and that is the following: if you do want to use HTML images for decorative images, then leave the alt attribute empty. Screen readers will otherwise read this out to their users, and this might confuse them because it doesn't offer any real value for these people. - Always supply a raster image as a fallback for your vector graphics, in the case the user disabled images, or the browser does not support an SVG. Otherwise, nothing will be shown to the user.
I hope you can do something with the feedback points and tips I gave you, but don't see it as something you need to do, but rather something for later (you are always free to correct your solution if you want).
If I made a mistake somewhere in this post, feel free to correct me and keep building awesome things :D.
Marked as helpful - I can submit your form without selecting a number.
This action brings me to the
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