What Is Web Development? A Beginner's Guide
Web development means building websites and apps that run in a browser. Learn the difference between frontend and backend, the technologies involved, and how to take your first step — with diagrams.
Web Development Articles
20 articles · in orderWhat Is HTML? The Basics of Web Pages
HTML is the markup language that forms the skeleton of web pages. This illustrated guide for teens covers how tags work, the most common tags, and how to write your very first page.
What Is CSS? The Technology That Changes Design
CSS (Cascading Style Sheets) is the language that controls a website's appearance. This illustrated guide for teens explains the difference from HTML, how to write it, and how to handle layout, colors, and more.
Building Dynamic Sites with JavaScript
JavaScript is the language that adds interactivity to websites. This illustrated guide for teens explains how click responses work, common use cases, and the first code you should write.
How to Build Your Own Website
Publishing your own website is closer than you think. This illustrated guide for teens walks through the full process — creating an HTML file, choosing free tools, and going live with a URL.
Database and SQL Basics
Databases (DB) and SQL are technologies widely used behind web services. This illustrated guide for teens explains how data is stored in table form and retrieved with queries.
Frontend vs Backend: What Is the Difference?
Frontend and backend are two common terms in web development. This illustrated guide for teens explains the different responsibilities, technologies, and personality types that suit each role.
How Is a Login Feature Built?
What happens behind the scenes when you log in with an ID and password? This illustrated guide for teens gently explains hashing, sessions, and tokens.
How Member Sites Work
How do membership sites work? Registration, login, access control, and billing explained with diagrams for teens.
How to Build a Blog Site
Three ways to build a blog site (WordPress, static site generators, hand-coded) compared for teens with diagrams.
What Is a Portfolio Site?
A portfolio site showcases your work online. Learn what teens should include, when to start, and how to build one for free — with diagrams.
Intro to Responsive Design
Responsive design automatically adjusts layout for smartphones, tablets, and PCs. Learn the basics, media queries, and how to write your first responsive CSS — explained with diagrams for teens.
API and JSON Basics
APIs connect web services and JSON is the data format they use. Learn how they work, real examples, and how to use them in JavaScript — explained with diagrams for teens.
Domain vs URL: What's the Difference?
Domains and URLs look similar but mean different things. Learn how domains work, URL structure, and how to register a domain — explained with diagrams for teens.
Web Designer vs Engineer: What's the Difference?
What's the difference between a web designer and a web engineer? Job roles, required skills, salary, and which type suits you — explained with diagrams for teens.
How to Publish for Free with GitHub Pages
GitHub Pages lets you publish a website for free. A step-by-step guide from account creation to going live — explained with diagrams for teens.
How to Choose an HTML/CSS Practice Site
Top 6 free sites to learn HTML and CSS compared by level. Features, difficulty, and who each suits — explained with diagrams for teens.
How to Choose Web Development Tools
Editors, browsers, Git, and design tools for web development — a free starter set for teens explained with diagrams.
How to Build a Mobile-Friendly Site
Tips for building a site that reads well on smartphones — with a checklist covering viewport, tap targets, font size, and image optimization. Explained with diagrams for teens.
What Is a Web App?
Learn the difference between websites and web apps, explore the latest trends like SPA and PWA, and discover how middle and high school students can start building their own web apps.