Using Placeholders Instead of Labels in Account Engagement Forms

Publish Date: Sep 30, 2025

Description

Labels are captions that tell visitors what information a particular form field is asking for. Placeholders are example content or hints that provide visitors with visual clues to help them complete forms. Labels appear outside of a form field, and placeholders appear inside of a form field and disappear when visitors click or tab into the field.

Label	Placeholder
Email Address	example@address.com

Labels and placeholders serve two distinct purposes and one should not be used in place of the other; however, for sake of space and/or aesthetics, form authors are increasingly using placeholders as labels.

Yes, it’s compact, but there are consequences that come along with this practice. We’ll use this last example to demonstrate a few reasons why placeholders are not substitutes for labels.

Resolution

Issues with using Placeholders as Labels

Placeholders Disappear

This one is pretty obvious. Placeholders are supposed to disappear, but when placeholders are used as labels, visitors lose form field context when they click or tab through form fields. Suppose a visitor is briefly distracted while in the process of filling out your form. If the visitor forgot what the last field was asking for, they would have to delete whatever is currently there and click or tab out of the field to get the placeholder text to reappear. Disappearing placeholder text can also affect visitors who use the tab key to advance to the next form field. If visitors don't read ahead to the next field’s placeholder before hitting the tab key, they’ll be in the same situation.

Auto-Focus

By default, Account Engagement forms will focus on the first form field automatically as a convenience for visitors. This allows them to start typing immediately without having to click or tab into the first field. If placeholders are used instead of labels, and auto-focus is not disabled, a visitor would see the cursor in a blank field without knowing what information is supposed to go in the field.

Disabled Javascript

Placeholders are not supported by Internet Explorer prior to version 10, meaning many web users can't see them. To get around this, form authors use Javascript to create the same effect. However, if any visitors using older versions of Internet Explorer have disabled Javascript, they would not see the placeholders, only blank boxes.

Placeholders are (almost) always grey

Placeholders appear as grey text inside of a form field. Although some web browsers are starting to allow them to be styled differently, this is not yet the norm. Depending on the background color of the form field and page, there may not be enough contrast between it and the placeholder for some visitors to be able to read.

Accessibility Issues

Placeholder support is fairly inconsistent with screen readers which are used by the visually impaired to read the contents of a web site to them. Without labels, these visitors may not be able to complete the form properly.

Confusing to Some Visitors

Data suggests that some web users think that form fields with placeholders are already filled in and may skip over them.

Against the HTML Specification

The W3C, which is the primary standards organization for the web, is very clear on the distinction between placeholders and label in the HTML specification : 'The placeholder attribute represents a short hint intended to aid the user with data entry... The placeholder attribute should not be used as an alternative to a label.'

Recommendation

We recommend that you always use a proper label and use placeholders only when you feel that it would help visitors complete your form. Some examples might be where the information needs to be in a specific format such as an email address.

Knowledge Article Number

000383677

Did this article solve your issue?

Let us know so we can improve!