HTML Labels and Placeholders
The <label> tag labels the input element. It is used to improve form accessibility (for screen readers) and form input clickable area.
The for attribute must match the id of the corresponding input.

Syntax:
<label for="id_of_input">Label Text</label> <input type="text" id="id_of_input" name="name">
Example
<label for="email">Email Address:</label> <input type="email" id="email" name="email">
What is a placeholder ?
The placeholder is an attribute in the <input> and <textarea> tags. It displays a hint or guide in the field until a user enters text.
The text disappears when the user starts typing.
Syntax:
<input type="text" placeholder="Enter your full name">
Example
<input type="email" name="email" placeholder="name@example.com">
Label vs Placeholder
| Feature | Label | Placeholder |
|---|---|---|
| Element | <label> tag | placeholder attribute |
| Visibility | Always visible | Only visible before typing |
| Accessibility | Improves screen reader support | Not accessible for screen readers |
| Purpose | Describes the input field | Gives a hint or example |
| Best Practice | Use with input fields for clarity | Use as a supplement, not a replacement for labels |
Quickly Find What You Are Looking For
OnlineTpoint is a website that is meant to offer basic knowledge, practice and learning materials. Though all the examples have been tested and verified, we cannot ensure the correctness or completeness of all the information on our website. All contents published on this website are subject to copyright and are owned by OnlineTpoint. By using this website, you agree that you have read and understood our Terms of Use, Cookie Policy and Privacy Policy.
point.com