@YariMorcus
Posted
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
@aevim
Posted
@YariMorcus Thank you very much for thoses tips. I don't know how I forgot that the button could be clicked without any number being selected... I did fix it by doing a preventDefault if there's no number selected. I'll be using more css background images in my next projects. I did fix all the issues, at least I think I did..