jQuery for Designers Beginner's Guide

Time for action – adding placeholder text

Follow these steps to add placeholder text to your form fields for as many of your site visitors as possible, whether or not their browser supports the new HTML5 placeholder attribute.

1. We'll keep using the same form that we've built in the last two sections. The first thing we'll do is revisit each form field and add a placeholder attribute where it makes sense. Here are some examples from my form:

   <p>
     <label for="username">Username</label>
     <input type="text" name="username" id="username" placeholder="At least 5 characters long"/>
   </p>

   Here, I've added a hint about the required length of the username.

   <p> <label for="password">Password</label> <input type="password" name="password" id="password" class="required" ...