Structuring and Organizing HTML5 FormsAquent Gymnasium
What you'll learn on the course
- Chapter 1: Lesson Intro
In this chapter you will learn what to expect from the course and some of the reasons it's important to build your forms right.
- Chapter 2: Setting Up The Project Files
In this chapter you will walk through the process of using the lesson files on CodePen. Additionally you will review the HTML structure of the page you will be working with throughout the course.
- Chapter 3: Coding For Standards
In this chapter you will begin to replace some of the existing tags of a form in order to make it more standards compliant. Specifically you will be working with label tags and the fieldset tag which have the additional benefit of improving the accessibility of your form.
- Chapter 4: New Input Types
In this chapter you'll take a tour of some of the new input types available for web forms including email, tel, number, and range. You'll learn about the use of placeholder text and autofocus and see how all these features work on mobile as well as desktop.
- Chapter 5: Working With The Datalist
In this chapter you will dive into the datalist element which will create an "autocomplete" feature for users interacting with your form.
- Chapter 6: Form Layout
In this chapter you will work with CSS media queries in order to design a form that is optimized for smaller devices such as mobile phones as well as for the more "traditional" desktop layouts.
- Chapter 7: Backwards Compatibility
In this chapter you will learn how to find the level of browser support for the various HTML5 form elements you have added to your page. Additionally you will learn strategies for ensuring that your forms will still work on older browsers.