Skip to content

Web development · Corporate training

Sample curriculum

Web foundations: HTML, CSS & JavaScript

Build responsive, semantic web pages and understand how browsers, JavaScript, and HTTP work together.

  • Foundation
  • Live online and in person

At a glance

Who it’s for

Freshers or teams building a foundation in this technology, with the starting knowledge listed here.

Starting point: Foundation

Bring these foundations

  • Comfort using a computer and a browser; no coding experience required.
Foundation sessions can be included when needed.

Technologies & tools

  • HTML
  • CSS
  • JavaScript
  • Browser DevTools
  • Code editor
Setup and versions agreed for your environment.

A practical destination

Skills to practise.

The sample path works towards these capabilities. Final goals reflect your team’s starting point and agreed scope.

  1. 01

    Explain the journey from a browser request to a rendered page.

  2. 02

    Build a responsive page with semantic content and keyboard-friendly interactions.

  3. 03

    Connect browser JavaScript to an API with useful loading and error states.

Sample curriculum

Follow the learning route.

Each module connects the concepts to practical work. Open a module to explore both.

01Module 1

How the web works

Concepts to understand

  • URLs, HTTP, requests and responses
  • Browser rendering and developer tools
  • Files, editors, and a local development server

Practical work

Inspect a page in DevTools. Trace its document, styles, scripts and network requests, then explain how they connect.

Show the result. Explain one decision. Identify what you would improve.
02Module 2

Semantic HTML & accessible content

Concepts to understand

  • Document structure, headings, and landmarks
  • Links, images, tables, and forms
  • Labels, keyboard navigation, and validation

Practical work

Build a small profile or product page with meaningful headings, navigation and a labelled form. Try the page using only a keyboard.

Show the result. Explain one decision. Identify what you would improve.
03Module 3

CSS & responsive layouts

Concepts to understand

  • Selectors, cascade, and the box model
  • Flexbox, Grid, and responsive breakpoints
  • Typography, spacing, and reusable styles

Practical work

Adapt the same page to narrow and wide screens with Flexbox or Grid. Explain how spacing, wrapping and the box model affect it.

Show the result. Explain one decision. Identify what you would improve.
04Module 4

JavaScript in the browser

Concepts to understand

  • Variables, functions, arrays, and objects
  • DOM manipulation and event handling
  • Fetch, JSON, and loading and error states

Practical work

Add a form interaction and load a list from an API. Show what the user sees while waiting, when the list is empty and when a request fails.

Show the result. Explain one decision. Identify what you would improve.

A sample project

Bring the skills together.

Build a responsive website with accessible navigation, a validated form, and API-driven content.

Shorter engagements can focus on selected exercises. A larger, learner-owned capstone can be scoped for a longer programme.

Review the work & reasoning

Four useful questions.

  1. 01

    Does the work meet the agreed requirements?

  2. 02

    Can the learner explain the key decisions and trade-offs?

  3. 03

    What happens with invalid input, failure or an unexpected condition?

  4. 04

    What would they change or explore next?

Designed & delivered by Ragav Kumar V.

Training since 2016 · 100+ batches · 3,000+ professionals trained

Live demonstrations, guided exercises, pair work and project reviews connect the concepts to implementation. We agree the goals, starting knowledge, cohort size, delivery and schedule before shaping the final curriculum.

Shape this for your team