As well as the error alignment issue raised in the discord chat, I can see a few issues with the html here
- this is not appropriate for an article
- header must be outside of main. They are distinct landmarks
- the logo must have alt saying the same text as the logo image
- the input must have a label. It is not enough to use the label element when there is no text that can be read as the label text. Usually only checkboxes or radio inputs would be wrapped in the label element because they always contain label text as well
- the button must be labelled too (have an accessible name). It is effectively empty when it only contains a decorative image
- to programmatically link the error message and input, add a unique ID to the error, and aria-desciribedby on the input pointing to that ID
I'm really surprised you've used jQuery in this to be honest. It's such a huge bloated library and you really don't need it for such a simple bit of form validation. Maybe challenge yourself to refactor this and do a version with vanilla js. The only time you'll encounter jquery now is in pretty old projects and it's more valuable to focus learning on the underlying tech if possible
Marked as helpful
0
kubas33• 180
@kubas33
Posted
@grace-snow
Thanks for your feedback! I will try to work more on this. What do you suggest instead of article? I have troubles to guess what tags to use in what situations.
0
