Lesson 8 Developing HTML5 Forms

Which HTML5 feature recognizes text input and completes the text entry automatically?

Autocomplete

Which type of Web form field allows a user to select more than one choice from a group of pre-determined choices?

Check box

Consider the following code to create a search field: <input type="search" name="search"> What occurs if the input type of "search" is not supported by a browser?

The search field will degrade to a standard text box.

If a specified field includes the autofocus attribute, what occurs when a user starts typing after loading your Web form in a browser?

The text is entered into the field identified with the autofocus attribute.

Consider the following code: <form> User Name: <input type="text" name="username"> Encryption: <keygen name="encryption"> <input type="submit"> </form> What does the <keygen> element display?

A key-pair generator field that creates a private key and a public key when the form is submitted

What is the term for an attribute that can be used by many different HTML elements?

Global attribute

Which term describes a backward-compatibility feature of code in which older or non-compatible browsers will render an acceptable substitute if they do not support the newer code?

Graceful degradation

What does the range form input type allow the user to do?

Select a number using a slider control

Which HTML5 form input type allows the user to enter a date (without time zone) using a drop-down date-picker calendar?

date

What does the number form input type allow the user to do?

Enter rational integers or float values

How can you best ensure that the Web forms you develop using HTML5 and CSS3 render properly on various browsers?

Test the Web forms thoroughly on various browsers and browser versions.

Into which type of Web form field can a user type alphanumeric characters of his or her choice?

Text box

Which HTML5 form element should you use to specify a list of pre-defined choices for an <input> element?

The <datalist> element

Which HTML5 element should you use to group related elements on a form by placing a box around the elements to make the form easier to read?

The <fieldset> element

Consider the following code: <input list="continents" name="continent"> <datalist id="continents"> <option value="North America"> <option value="South America"> <option value="Europe"> <option value="Asia"> <option value="Africa"> <option value="Australia"> <option value="Antarctica"> </datalist> Which attribute must you use to bind the input field to the <datalist> element?

The <input> element's list attribute

Which HTML5 form element should you use to enable asymmetric cryptography to encrypt communications between the user and your server?

The <keygen> element

Which element can you use to add a label to an input element in a Web form?

The <label> element

Consider the following figure: Figure 8-6: The <fieldset> element grouping feature What element do you use to create the "Personal Information:" and "Experience:" text at the top of the two boxes shown in the figure?

The <legend> element

What element should you include on your Web form if you want to ask an open-ended question that may result in a fairly lengthy answer?

The <textarea> element

When you use the <input> element to create form fields, what occurs if you neglect to include the type attribute, or if the specified value of the type attribute is not supported by the browser?

The browser will infer the default type of text.

What attribute should you specify with the <textarea> element if you want the textarea field to be able to accept no more than 500 characters?

The maxlength attribute

For what can you use the <legend> element?

To add a caption for a group of items created by the <fieldset> element

For which purpose can you use the <select> element?

To create a drop-down list of options

Why should you use the placeholder attribute with HTML5 form elements that require text input from the user?

To provide the user with a hint identifying the expected input in the form field

For what can you use the HTML5 <output> element?

To save and reuse the result of a calculation performed by a script

HTML5 includes Web form additions, such as semantic input types, new selection options and new validation tools, that make it easier to:

enter information into forms when using touchscreen keyboards and small mobile device screens.

Many of the new HTML5 elements and attributes are semantic, which means that:

they clearly describe their purpose to a human reading the code.