← All courses
Beginner friendly4 weeks36 lessons
Watch a free lesson

HTML

Build and publish real web pages from scratch using HTML — structuring text, images, links, tables and forms the way employers and clients expect. By the end you'll have three hand-coded pages hosted online that you can show in a portfolio or job application.

Instructor: Alex Olam

Course content

Module 1: Set Up and Publish Your First Page

  • 1.1Install VS Code and Chrome (plus a phone-only setup with Acode)▶ Watch free preview
  • 1.2Create your project folder and write your first index.html file▶ Watch free preview
  • 1.3Open your page in a browser and reload after every change
  • 1.4Use the HTML boilerplate: doctype, html, head and body explained
  • 1.5Inspect any live website with Chrome DevTools to read its HTML

Module 2: Structure Text Content

  • 2.1Write headings h1 to h6 in a logical outline
  • 2.2Format paragraphs with strong, em, br and line breaks that behave
  • 2.3Add comments and fix broken tags with proper nesting and indentation
  • 2.4Use HTML entities for naira signs, arrows and special characters
  • 2.5Build a one-page personal bio using only text elements

Module 3: Links, Images and Media

  • 3.1Link between pages with relative paths and to sites with absolute URLs
  • 3.2Create email, phone and WhatsApp links that open the right app
  • 3.3Add images with alt text and compress them for slow connections
  • 3.4Jump to sections on the same page with anchor IDs
  • 3.5Embed a YouTube video and a Google Map into your page

Module 4: Lists, Tables and Page Layout Structure

  • 4.1Build ordered, unordered and nested lists for menus and steps
  • 4.2Lay out a price list in a table with thead, tbody and th
  • 4.3Group content with div and span versus semantic tags
  • 4.4Structure a page with header, nav, main, section, article and footer
  • 4.5Build a reusable navigation bar and copy it across three pages

Module 5: Forms That Collect Real Data

  • 5.1Build a contact form with labels, text inputs and a submit button
  • 5.2Collect choices with select dropdowns, radio buttons and checkboxes
  • 5.3Use email, tel, number and date input types for better mobile keyboards
  • 5.4Validate entries with required, pattern, minlength and placeholder
  • 5.5Connect your form to Formspree so submissions land in your inbox

Module 6: Accessibility, SEO and Clean Code

  • 6.1Write title and meta description tags that show up well in Google
  • 6.2Add the viewport meta tag and a favicon for mobile users
  • 6.3Make your page screen-reader friendly with alt text, labels and landmarks
  • 6.4Check your page through the W3C validator and fix every error
  • 6.5Organise files and folders the way real projects are structured

Module 7: Capstone: Build and Launch a Three-Page Business Site

  • 7.1Plan the pages and content for a real local business or your own brand
  • 7.2Build the home page with hero section, services list and footer
  • 7.3Build the about page and a gallery page with optimised images
  • 7.4Build the contact page with a working form and map
  • 7.5Publish the site free on GitHub Pages or Netlify and get your live link
  • 7.6Test on a real phone, fix issues and write your portfolio case study

Free

Sign up to enroll