For decades now, developers have half-jokingly debated the question, “is HTML a programming language?”.
While it’s technically a markup language, it is - for many developers - the first language they learnt, and was the first step they took on the path to becoming a developer.
Even with it being perceived as easier to learn and write than programming languages, it’s surprising how often developers of all levels make basic HTML mistakes.
So, we thought we’d put your skills to the test and see if you can spot some mistakes in our code. This time, we’re focusing on forms, and we’ve included five mistakes below.
Can you find them?
The Code
<form action="/submit" method="POST">
<label for="email">Email</label>
<input id="email" type="email" placeholder="Enter your email">
<label>Password</label>
<input type="password" name="password" aria-label="Enter your password">
<p>Please fill all fields before submitting.
<button type="button" disabled>Submit</button>
</p>
</form>
The Answers
Think you’ve found the answers? See if you found them all below.
Mistake 1
Missing name on the email input
No name="email" = no email data submitted.
Mistake 2
Unassociated password label
<label>Password</label> isn’t connected to the input (for="password" is missing), so screen readers can’t associate the label with the field.
Mistake 3
aria-label on password field is redundant/confusing
Used instead of proper label linkage. It also doesn’t add value because a visible label is present — could confuse assistive tech.
Mistake 4
Button is type "button" instead of "submit"
The form won’t submit unless JavaScript handles it, which may not be intended.
Mistake 5
Button nested inside a <p> tag
Invalid HTML structure. Interactive elements shouldn't be nested inside <p> tags — can break styling and behavior in some browsers.
