Section 1.3 Advanced Topics in HTML5

Learning Objectives

After you have completed this section, you should be able to

• build HTML5 forms using the new HTML5 input types.
• use self-validating input elements.
• specify temporary placeholder text in various input elements.
• use autocomplete input elements to help users to speed up input.
• use datalist to specify a list of values that can be entered in an input element.
• delineate parts of a web page using HTML5’s new page structure elements including header, footer, nav, figure and figure caption, section, aside, meter, and some others.

Activities

• Carefully read the learning objectives.
• Watch presentation for the section;
• Read Chapter 3, Introduction to HTML5: Part 2, of the e-text.
• Study the material you find at https://www.w3schools.com/html/default.asp
• Write a web page showing a list of courses you are taking, with links to the course syllabi and test the web page on your web server.
• Find answers to the study questions below.
• Do exercises 3.6, 3.8, 3.9, 3.10, and 3.11 in Chapter 3 of the e-text.

Study Questions

1. What new input types can you use in HTML5 documents?
2. What does HTML5 input type color do?
3. What does HTML5 input type date do?
4. What does HTML5 input type datetime do?
5. What does HTML5 input type datetime-local do?
6. What does HTML5 input type email do?
7. What does HTML5 input type month do?
8. What does HTML5 input type number do?
9. What does HTML5 input type range do?
10. What does HTML5 input type search do?
11. What does HTML5 input type tel do?
12. What does HTML5 input type time do?
13. What does HTML5 input type url do?
14. What does HTML5 input type week do?
15. What does the autocomplete attribute in HTML5 input do?
16. What does the datalist element in HTML5 input do?
17. What page-structure-related elements are available in HTML5?

Review

Do the self-review exercises in Chapter 3 of the e-text.

Summary

Read the chapter summary for Chapter 3 of the e-text.