courses / html / level 2

level 2 · medium

intermediate
html.

Build forms, tables and pages that work for everyone, then bring them together in a real booking page.

  • 28 lessons
  • 7 units
  • 4 h 22 m in all
  • £0, for good

what’s inside.

For people who finished Level 1, or can already write small programs with variables, decisions, loops and functions.

HTML Level 2 picks up where Level 1 ended. In 28 lessons you build forms that check their own answers, tables that screen readers can follow, pages whose parts say what they mean, and video and sound that everyone can enjoy. It ends with a level check: a booking page for a pottery class, tested like a real visitor would use it.

every lesson goes the same way.

  1. meet it
  2. guess first
  3. your turn
  4. fix it
  5. nailed it

unit 1

Forms that ask well

Ask the right questions and get answers you can use.

4 lessons · 37 min

  1. What a form sends9 minGive every answer a name so the form sends something useful.
  2. The right box for the job9 minPick input types that bring the right keypad, calendar or hidden dots.
  3. Answers you must give9 minMake the browser hold a form back until key answers are filled in.
  4. Answers in the right shape10 minSet limits on numbers and lengths, and match answers to a pattern.

unit 2

Choices and longer answers

Offer choices, group questions and make room for longer replies.

4 lessons · 36 min

  1. Pick one with radio buttons9 minLet visitors choose exactly one answer from a short list.
  2. Group questions with fieldset9 minWrap related fields in a box with their question on top.
  3. Drop-down lists9 minOffer a long list of choices without filling the page.
  4. Room for longer answers9 minLet visitors write whole sentences, and give them a helpful example.

unit 3

Tables done properly

Build tables that people and screen readers can follow.

4 lessons · 38 min

  1. Give a table a caption8 minName a table so everyone knows what it shows before reading it.
  2. Head, body and foot10 minSplit a table into its column names, its facts and its totals.
  3. Headers for rows and columns10 minTell screen readers whether a header names a column or a row.
  4. Cells that stretch10 minMerge cells across columns or down rows with colspan and rowspan.

unit 4

Parts with meaning

Say what each part of a page is, not how it looks.

4 lessons · 35 min

  1. Articles that stand alone9 minMark up posts, reviews and cards that make sense on their own.
  2. Sections with headings9 minSplit a page into topics, each with a heading in the right order.
  3. Asides for extras8 minMark side notes and related links so they never interrupt the main story.
  4. Figures with captions9 minPair a picture with words that explain it.

unit 5

Dates, contacts and quotes

Mark up dates, contact details, pairs of facts and reviews.

4 lessons · 36 min

  1. Dates computers understand9 minWrite a date for people and for computers at the same time.
  2. Contact details9 minMark up how to reach you, with links that start an email or a call.
  3. Description lists9 minList pairs of facts, like questions and answers or names and details.
  4. Quotes and reviews9 minQuote people properly and say where their words came from.

unit 6

Pages everyone can use

Make pages that work with screen readers and keyboards.

4 lessons · 38 min

  1. Alt text that helps9 minDecide what each picture's alt text should say, including nothing at all.
  2. Names with aria-label10 minGive buttons and landmarks names that a screen reader can say.
  3. Hints joined to boxes10 minJoin help text to its box so screen readers read it too.
  4. Skip links9 minLet keyboard users jump straight past the menu to the content.

unit 7

Media and a booking page

Add video and sound, then build a booking page that works.

4 lessons · 42 min

  1. Video on the page10 minAdd a video with buttons to play it and a picture to show first.
  2. Sound and file formats10 minAdd a sound player, and offer the file in more than one format.
  3. Captions and transcripts10 minMake video and sound work for people who cannot hear them.
  4. Build a booking form12 minPlan, build and test a booking form that people can fill in.
end of level 2 level check: a booking page Build one small project with everything from this level. Pass it and your face levels up. see the check

next, level 3

advanced
html.

Write HTML like a professional: fast, findable, shareable pages that work in every language.

see level 3