AiCanCodewith Aria

Home/Learn/HTML, CSS & Responsive

HTML, CSS & Responsive

The track most likely to be skipped, and the reason take-homes get returned. Semantic HTML, the cascade and box model, flexbox and grid, responsive design for a mid-range Android, and the accessibility a reviewer checks first. CSS as a set of models, not a pile of tricks.

Semantic HTMLCSS FundamentalsLayoutResponsiveAccessibility

26 Concepts

Beginner (3)

→Intermediate (17)

→Advanced (6)

Ask Aria on every concept

Semantic HTML

5 concepts

Document Structure and Landmarks

Text, Links and Buttons

Forms — Labels, Input Types and Autofill

Tables — Real Data, and Making It Fit a Phone

Images, Media and Page Metadata

CSS Fundamentals

6 concepts

The Cascade, Specificity and Inheritance

The Box Model and Spacing

Selectors and Pseudo-Classes

Units — px, rem, em, %, and the Viewport

Colour and Typography

Custom Properties and Theming

Layout

6 concepts

Display, Normal Flow and Formatting Contexts

Flexbox

CSS Grid

Positioning — relative, absolute, fixed and sticky

Stacking Contexts and z-index

Overflow and Scrolling

Responsive

4 concepts

Media Queries, Breakpoints and Container Queries

Fluid Type and Spacing

Responsive Images and Media

Responsive Patterns and Testing

Accessibility

5 concepts

Accessible Structure — What a Screen Reader Hears

Keyboard Access and Focus Management

ARIA — When to Use It, and When Not To

Visual Accessibility — Contrast, Zoom and Motion

Testing Accessibility