☑️ - Meet expectations requirement
✅ - Exceeds expectations requirement
Form Structure
☑️ Only one <form> tag is being used
☑️ Fieldsets and legends have been added for "Contact Information" and "Newsletter" sections
Form fields and labels
☑️ Includes text input
☑️ Includes email input
☑️ Includes telephone input
☑️ Includes select menu
☑️ Includes checkboxes
☑️ Includes radio buttons
☑️ Includes textfield
☑️ Includes submit button
☑️ Each input field includes id, type and name attributes
☑️ Each select and textarea includes id and name attributes
☑️ Each form field has a label with for attribute that maches the unique id of the form field
Placeholder text
☑️ input field's placeholder attribute has been used to add "required" to FULL NAME and EMAIL ADDRESS
☑️✅ Form contains additional placeholder text for other text fields
☑️✅ Uses the required attribute to add HTML5 validation for required fields (email?)
Mobile-first
☑️ HTML file includes viewport meta tag
☑️ A mobile-first approach is utilized using min-width in media queries
☑️ Appropriate media query is in place for tablet/mobile and desktop screens
Design and styling
☑️ Roughly matches BOTH mockup in general spacing and arrangement
☑️ The label text position matches the mockup for both mobile & desktop
☑️ Uses a Google font
☑️ Includes focus states for text fields
☑️✅ Change the background color for at least one main section (header and main section)
☑️✅ Use CSS transitions for focus states
Valid Code
☑️ HTML and cSS code passes validation