HTML & CSS for Beginners

1.1 Websites, Webpages, Web Applications, and Static versus Dynamic Content

1.2 FrontEnd, BackEnd, Databases, APIs

1.3 Browsers, Rendering, DOM

1.4 Clients, Servers, Domains, HTTP

1.5 Editor, Folders, Filenames

1.6 First Page, Local Server, DevTools

Module 1 Quiz – How Websites Work and Workspace Setup

2.1 Elements, Tags, Attributes, Values, Void Elements, and Nesting

2.2 Indentation, Whitespace, Character References, Comments, and Readable Source

2.3 The Doctype, `html`, `head`, and `body`

2.4 Character Encoding, Document Language, Text Direction, and Viewport Metadata

2.5 Page Titles, Descriptions, Favicons, Stylesheet Links, and Essential Head Content

2.6 HTML Validation, Nesting Errors, Obsolete Markup, and a Correction Workflow

Module 2 Quiz – HTML Syntax and Document Structure

3.1 Headings, Paragraphs, Thematic Breaks, and Content Hierarchy

3.2 Meaningful Inline Text

3.3 Ordered, Unordered, Description, and Nested Lists

3.4 Quotations, Citations, Abbreviations, Dates, and Contact Information

3.5 Code, Preformatted Text, User Input, Sample Output, and Variables

3.6 Semantic Page Regions, Generic Containers, and Global Attributes

Module 3 Quiz — Text, Lists, and Semantic Content

4.1 Anchors, Destinations, Fragments, and Meaningful Link Text

4.2 Absolute, Relative, Root-Relative, and Parent-Directory Paths

4.3 Linking Pages, Folders, Files, and Sections

4.4 Email, Telephone, Download, and External Links

4.5 Primary and Secondary Navigation, Breadcrumbs, Skip Links, and the Current Page

4.6 Building and Testing a Multipage Structure

Module 4 Quiz – Links, Navigation, and Multipage Websites

5.1 Raster and Vector Graphics and Web Image Formats

5.2 The `img` Element, Source, Alternative Text, and Dimensions

5.3 Alternative Text for Different Image Purposes

5.4 Figures, Image Links, Licensing, and Attribution

5.5 Responsive Images with `srcset`, `sizes`, and `picture`; Basic SVG Use

5.6 Accessible Audio, Video, Text Tracks, Iframes, and Privacy

Module 5 Quiz – Images, Graphics, Audio, Video, and Embeds

7.1 CSS Rules, Selectors, Declarations, Properties, Values, and Comments

7.2 External, Internal, and Inline CSS

7.3 Type, Class, ID, Universal, Grouped, Combinator, and Attribute Selectors

7.4 Pseudo-classes, Pseudo-elements, Inheritance, and Browser Default Styles

7.5 Cascade Order, Specificity, Source Order, IDs, and `!important`

7.6 Inspecting Computed Styles, Finding Conflicts, and Writing Readable Selectors

Module 7 Quiz – CSS Syntax, Selectors, and the Cascade

8.1 CSS Value Types, Keywords, Numbers, Strings, URLs, Percentages, and Invalid Declarations

8.2 Pixels, Percentages, `em`, `rem`, `ch`, and Viewport Units

8.3 Hex, RGB, HSL, Alpha, `currentColor`, and CSS Math Functions

8.4 Content, Padding, Borders, Margins, Collapse, `gap`, and `box-sizing`

8.5 Width, Height, Intrinsic Sizing, `aspect-ratio`, and Object Fitting

8.6 Overflow, Scrolling, Clipping, Custom Properties, and Box Debugging

Module 8 Quiz – Colours, Units, Sizing, and the Box Model

9.1 Typeface Categories, System Font Stacks, Fallbacks, and Responsible Selection

9.2 Font Family, Size, Weight, Style, Line Height, Measure, Spacing, Alignment, and Rhythm

9.3 Web Fonts, `@font-face`, WOFF2, Fallbacks, and `font-display`

9.4 Backgrounds, Borders, Outlines, Radii, Separators, and Focus Rings

9.5 Linear and Radial Gradients, Shadows, Opacity, and Restrained Effects

9.6 Styling Lists, Tables, Buttons, and Form Controls Without Removing Usability

Module 9 Quiz – Typography and Visual Styling

10.1 Normal Flow, Block and Inline Behaviour, Display Roles, Wrappers, and Content-Driven Layout

10.2 Flex Containers, Items, Axes, Direction, and Wrapping

10.3 Flex Basis, Growth, Shrinkage, Gaps, Alignment, Auto Margins, and Common Patterns

10.4 Grid Containers, Lines, Tracks, Cells, Areas, and Explicit and Implicit Grids

10.5 fr, repeat(), minmax(), Automatic Placement, and Introductory Responsive Grids

10.6 Choosing Normal Flow, Flexbox, or Grid; Introductory Positioning and z-index

Module 10 Quiz – Flexbox and CSS Grid

11.1 Viewports, Mobile Browser Behaviour, Mobile-First Design, and Responsive versus Adaptive Layouts

11.2 Fluid Containers, Flexible Media, Intrinsic Design, and Content-Based Breakpoints

11.3 Media Queries, Range Syntax, Orientation, Pointer and Hover Capabilities, and Short Screens

11.4 Fluid Typography and Spacing with Relative Units and CSS Functions

11.5 Responsive Navigation, Cards, Tables, Forms, Videos, and Embeds

11.6 Testing Narrow and Wide Viewports, Zoom, Reflow, Touch Targets, Source Order, and Real Content Extremes

Module 11 Quiz – Responsive Web Design

12.1 Accessibility Principles, Semantic HTML, Landmarks, Headings, Names, and Descriptions

12.2 Keyboard Navigation, Focus Order, Visible Focus, and Component Auditing

12.3 Contrast, Colour Independence, Zoom, Reflow, Orientation, Target Size, and User Preferences

12.4 Validation, Manual Checks, Automated Tools, Screen Readers, and Cross-Browser Testing

12.5 Image, Font, Stylesheet, and Layout-Shift Performance Basics

12.6 Hosting, Domains, HTTPS, Deployment, 404 Pages, Release Checks, and a README

Module 12 Quiz – Accessibility, Testing, Performance, and Publishing