Input field and form label

This content needs to be rewritten and expanded.
Related issue on GitHub #155 Topic Input fields and form labels.

The label should tell the user what information is required; the placeholder should describe how to fill it out.

For example:

<label for="search">Search for a product:</label>
<input type="text" id="search" placeholder="For example: apples, bread or milk">
<label for="search">Search for a product:</label>
<input type="text" id="search" placeholder="For example: apples, bread or milk" aria-describedby="search_description">
<span id="search_description">This store only carries fruit, grain products, and dairy.</span>

If you must hide a label or control from vision, use the CSS class .screen-reader-text and not display: none or visibility: hidden. Hiding labels is generally discouraged, but can be acceptable in some cases, such as single-field search forms.