> Markdown version of [/magazine/577-spot-the-mistakes-html-forms](https://www.wearedevelopers.com/magazine/577-spot-the-mistakes-html-forms). Every page supports `.md` or `Accept: text/markdown`. Links point to the HTML versions so they work for humans too. Agent guide: [/agents.md](https://www.wearedevelopers.com/agents.md). --- # Spot the Mistakes: HTML Forms **By:** [Daniel Cranney](https://www.wearedevelopers.com/@daniel-cranney) **Published:** April 17, 2025 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. ## Related Articles - [Spot the Mistakes: A Paragraph with Problems](https://www.wearedevelopers.com/magazine/574-spot-the-mistakes-a-paragraph-with-problems) - [Spot the Mistakes: CSS](https://www.wearedevelopers.com/magazine/589-spot-the-mistakes-css) - [Spot the Mistakes: HTML Tables](https://www.wearedevelopers.com/magazine/583-spot-the-mistakes-html-tables) - [5 Tips for Using the <button> HTML Element](https://www.wearedevelopers.com/magazine/666-5-tips-for-using-the-button-html-element) ## Related Videos - [Going on a CODE100 Accessibility Scavenger Hunt](https://www.wearedevelopers.com/videos/1252-going-on-a-code100-accessibility-scavenger-hunt) - [Using all the HTML, Running State of the Browser and "Modern" is Rubbish](https://www.wearedevelopers.com/videos/1291-using-all-the-html-running-state-of-the-browser-and-modern-is-rubbish) - [Making Interactions Accessible to All Users](https://www.wearedevelopers.com/videos/649-making-interactions-accessible-to-all-users) - [82 Bugs I Collected in a Year You Won’t Believe Made It to Production](https://www.wearedevelopers.com/videos/1581-82-bugs-i-collected-in-a-year-you-won-t-believe-made-it-to-production) ## Related Jobs - [Software Engineer Frontend (all genders welcome) in the field of Water Line Integrity Solutions](https://www.wearedevelopers.com/jobs/ext/127888-software-engineer-frontend-all-genders-welcome-in-the-field-of-water-line-integrity-solutions) at **Rosenxt Group** - [Remote Senior Full-Stack Engineer](https://www.wearedevelopers.com/jobs/ext/679408-remote-senior-full-stack-engineer) at **Edge Impulse** - [Remote Senior Full-Stack Engineer](https://www.wearedevelopers.com/jobs/ext/356601-remote-senior-full-stack-engineer) at **Edge Impulse** - [Remote Senior Full-Stack Engineer](https://www.wearedevelopers.com/jobs/ext/643147-remote-senior-full-stack-engineer) at **Edge Impulse** - [Remote Senior Full-Stack Engineer](https://www.wearedevelopers.com/jobs/ext/646086-remote-senior-full-stack-engineer) at **Edge Impulse** - [Remote Senior Full-Stack Engineer](https://www.wearedevelopers.com/jobs/ext/682327-remote-senior-full-stack-engineer) at **Edge Impulse**