Web

The web topic covers what happens in the browser, on the client side. This page collects the best learning resources for the web platform — from HTML and CSS to accessibility and performance.

Where to start

New to web development? Start with MDN Learn Web Development and the Frontend Roadmap. They'll give you a structured path from zero to productive.

MDN

• MDN Web Docs — The gold-standard reference for HTML, CSS, JavaScript, and Web APIs. If the topic is on MDN, start there.
• MDN Learn Web Development — A structured curriculum that takes you from beginner to comfortable with the web platform.

Roadmaps & Curricula

• Frontend Roadmap — A visual step-by-step guide to becoming a frontend developer.
• JavaScript Roadmap — Structured learning path from JS fundamentals to advanced topics. For more JavaScript and TypeScript resources, see JavaScript & TypeScript.
• TypeScript Roadmap — From basic types to generics and decorators. For Aliz's TypeScript recommendation, see Tech Stack — TypeScript.
• React Roadmap — Step-by-step React learning path. For Aliz's React recommendation, see Tech Stack — React.
• web.dev Learn — Free structured courses by the Chrome team on HTML, CSS, JavaScript, accessibility, performance, and more.

Patterns & Architecture

• Patterns.dev — Modern design, rendering, and component patterns for the web. Covers SSR, SSG, Islands Architecture, and React patterns with visual examples.

HTML & CSS

• Can I Use — Check browser support for any HTML, CSS, or JS feature before using it.

Accessibility

• web.dev Learn Accessibility — Free course covering ARIA, keyboard navigation, color contrast, and screen reader support.
• The A11y Project — Practical checklist and guides for making websites accessible.

Performance

• Performance & Core Web Vitals — Aliz guide to Lighthouse and Core Web Vitals — start here.
• Frontend Performance Best Practices — Actionable checklist covering page weight budgets, compression, critical CSS, and image optimization.
• web.dev Performance — Deep dive into Core Web Vitals, loading strategies, and resource optimization.

Design & UX

Our in-depth design guides for developers who build web interfaces:

• Laws of UX — psychological principles behind effective UI design
• Visual Design — typography, color, spacing, and visual hierarchy
• UI Patterns — navigation, forms, data display, and feedback patterns
• Accessibility — WCAG compliance, ARIA, keyboard navigation, and inclusive design
• Design Tools & Resources — contrast checkers, color palettes, type scales, and icon libraries

External resources:

• UX Design Roadmap — Visual roadmap for understanding UX design principles.
• Design System Roadmap — Roadmap for building and understanding design systems. See also Tech Stack — MUI and Tech Stack — shadcn/ui.
• Laws of UX — A collection of UX principles backed by psychology research. We cover these in detail in Laws of UX.
• Material Design 3 — Google's design system, which Aliz implements through Tech Stack — MUI.

Newsletters & Extras

• JavaScript Weekly — Weekly newsletter curating the best JS articles, tools, and releases.
• Frontend Focus — Weekly roundup of HTML, CSS, and frontend news.
• Spellbook of Modern Web Dev — Massive curated link collection covering the entire modern web dev landscape. Best used as a reference directory.

More newsletters and podcasts on the Other Resources page.

Related Docs

• Rendering Strategies — choosing between CSR, SSR, SSG, and Islands Architecture for your project
• Security — web security essentials: XSS, CSRF, CSP, and supply chain safety
• Design Systems — choosing and implementing a design system for your project