Web developmentintermediateabout 50 minutes

Build a landing page

Put HTML, CSS and JavaScript together into a page that works on a phone and validates its own form.

By the end you can

Structure a page with real sections
Lay it out so it works on a phone first
Validate a form and show useful errors
Ship something you could actually put online

Easier if you did first

0 of 3 done

step 1 of 3

Structure before style

Start with the outline: a header with the business name, a main section with what you do, and a footer.

Use the elements that say what a thing is: header, main, section, footer. Search engines and screen readers both use them, and they cost nothing over a page of divs.

Build the skeleton with a heading, a short pitch and a call to action link.

<header>...</header>
<main>
  <section>...</section>
</main>
<footer>...</footer>

What we check

There is a header
There is a main
There is a section inside main
There is one h1
There is a footer
There is a call to action link

index.htmlhtml

styles.csscss

preview

cd ../labs