More than thirty years ago, Tim Berners-Lee deployed HTTP and introduced the foundations of the World Wide Web. What began as a simple hypertext system has grown into a global infrastructure that shapes communication, commerce, education, and civic life. As web designers today, we are not just arranging text and images on a screen, we are shaping access to knowledge and participation in society.
If we believe in “Computer Science for All,” then web design must also be for all learners and all users. That means thinking beyond aesthetics and functionality. It means designing with accessibility, equity, and inclusion at the forefront. Drawing from inclusive frameworks like Universal Design for Learning (UDL) and justice-centered computing education, we can reimagine web design not just as a technical skill, but as a civic responsibility.
Learning Goals for Teaching Web Design
When teaching web design in a K–12 setting, the goals should extend beyond simply “building a website.” Students should learn:
- The structure and purpose of HTML
- The separation of structure (HTML) and presentation (CSS)
- How responsive design works across devices
- Why accessibility and inclusive design matter
- How web design decisions affect different communities
Students should understand that code is not neutral. The choices we make in layout, navigation, color contrast, font size, and interaction design can either reduce or create barriers.
The Foundations: HTML and CSS
HTML: Structure and Meaning
Hypertext Markup Language (HTML) provides the structure of a webpage. Like an English teacher marking up a draft, HTML uses tags inside angle brackets to define meaning.
The basic structure includes:
<!DOCTYPE html><html><head><title><body>
Within the body, common tags include:
- Headings (
<h1>through<h6>) - Paragraphs (
<p>) - Anchors (
<a>) for links - Images (
<img>) - Divisions (
<div>) - Emphasis (
<em>) - Strong (
<strong>)
HTML is not just about appearance, it conveys structure and meaning. For example, <strong> and <em> do more than visually bold or italicize text. They provide semantic information that screen readers use to interpret emphasis.
This is where inclusive design begins.
CSS: Presentation and Flexibility
Cascading Style Sheets (CSS) separate content from presentation. Instead of embedding visual styling inside HTML, CSS defines:
- Colors
- Fonts
- Layout
- Spacing (margin and padding)
- Width and height
- Responsive behaviors
There are three main types of CSS rules:
- Tag rules
- Class rules
- ID rules
CSS allows designers to create consistent styling across pages while maintaining flexibility. It also includes media queries, such as:
@media (min-width: 1200px) { … }These allow websites to respond to screen size, orientation, and device type. A site should not look identical on a desktop and a smartphone. Responsive design is not just convenient, it is an access issue.
If a site forces horizontal scrolling on mobile devices or shrinks text too small to read, it excludes users.
Web Design as Inclusive Practice
The UDL framework encourages educators to provide:
- Multiple Means of Engagement (the “why” of learning)
- Multiple Means of Representation (the “what” of learning)
- Multiple Means of Action and Expression (the “how” of learning)
These principles apply directly to web design.
Multiple Means of Representation
A website should not rely on one mode of communication. For example:
- Images should include alt text.
- Videos should include captions.
- Color should not be the only indicator of meaning.
- Text should have sufficient contrast.
These choices support users with visual, auditory, or cognitive differences.
Multiple Means of Action and Expression
Websites should be navigable:
- With keyboard shortcuts
- With screen readers
- Without requiring precise mouse control
Designing with accessibility tools in mind is not an “add-on.” It is central to inclusive design.
Multiple Means of Engagement
Students learning web design should be allowed to:
- Choose project topics relevant to their culture and community
- Design sites that address real-world needs
- Collaborate and test each other’s designs
This aligns with justice-centered computing, which encourages connecting technical skills to broader social goals.
Justice-Centered Web Design
Justice-centered computing education challenges us to move beyond simple participation metrics and consider power, history, and systemic barriers.
In web design, this means asking:
- Who is this site for?
- Who might be excluded?
- What assumptions are embedded in the design?
- Whose language and cultural references are represented?
For example:
- Are forms accessible to multilingual users?
- Does the site assume high-speed internet?
- Are images culturally inclusive?
- Are users with disabilities considered from the start?
If web design education only teaches aesthetics and code syntax without discussing these questions, we risk reinforcing inequities.
Barriers in Teaching Web Design
Teaching web design comes with predictable barriers:
- Limited access to devices
- Lack of accessible design tools
- Teachers unfamiliar with inclusive frameworks
- Students discouraged from advanced computing pathways
At the microsystem level (classroom), barriers include assumptions that some students “aren’t technical.”
At the mesosystem level (school), access to advanced CS courses may be restricted.
At the macrosystem level (policy), accessibility standards may not be enforced
Understanding these layers helps educators design pathways rather than perpetuate exclusion.
An Interdisciplinary Approach
Web design is not just computer science. It intersects with:
- Art and design (visual hierarchy, color theory)
- English (writing for digital audiences)
- Civics (public communication and information access)
- Social studies (representation and power)
- Accessibility law (ADA and inclusive technology standards)
Students can create:
- Community resource websites
- Multilingual information portals
- Advocacy campaign sites
- Accessible educational tools
This positions web design as a tool for civic engagement.
Why Web Design Matters
The web is infrastructure. It shapes how people:
- Apply for jobs
- Access healthcare
- Learn
- Vote
- Communicate
If websites are inaccessible, people are excluded from society.
Teaching web design responsibly means teaching students that they are building public spaces. Every <div>, every CSS rule, every responsive breakpoint is a design decision that affects real users.
TL;DR
Web design is often introduced as a creative and technical skill, but it is also ethical work.
By integrating:
- HTML and CSS fundamentals
- Responsive design practices
- Accessibility standards
- UDL principles
- Justice-centered computing perspectives
we move from simply teaching students how to build websites to teaching them how to build inclusive digital spaces.
In a world increasingly shaped by the web, designing for all is not optional.
It is the responsibility of every web designer.