Early Black Friday Sale: 60% Off

Intro to Web Development Course

Welcome to Intro to Web Development Course for kids, Learn to create responsive web pages using HTML and CSS.

Intro to Web Development Course

Welcome to Intro to Web Development Course for kids, Learn to create responsive web pages using HTML and CSS.

Course card image for Intro to Web Development
Tynker gets kids coding with confidence. Access this and 5,000 more fun activities today!
Get Started for Free

Give as Gift

Web Pages with HTML and CSS Course

Advanced Level
100% Online
10 lessons
83 Activities

Access this and 5,000 coding activities!

Get Started for Free

Give as Gift

Recommended for Ages 12+

Web

No Prerequisites

HTML/CSS

HTML (HyperText Markup Language) and CSS (Cascading Style Sheets) are the languages used in tandem all across the world to display web pages. A web page's contents are laid out with HTML, while CSS governs how the contents are styled.

What Kids Learn

  • Learn web design with HTML and CSS
  • Progress through 120+ activities
  • Design responsive websites
  • Create an interactive photo gallery
  • Build an Instagram clone

How Kids Learn with Tynker

Kids learn on their own with a guided, hands-on approach that individualizes the learning experience. Tynker's online courses provide a complete learning system for your child to master the fundamentals of programming. Tynker's visual programming language makes it easy to learn, and once kids gain proficiency, they can seamlessly transition to Javascript coding within the Tynker learning system. Enroll in one of our plans for unlimited play across all courses.

Game-Based Learning

Tynker's self-guided lessons break down coding concepts while solving puzzles and making cool apps.

Interactive Assessments

Quick practice quizzes and assessment tests evaluate a child's comprehension of subjects taught.

Captivating Topics

There's always something to learn with multiple subjects, projects, and coding languages available.

System Requirements

Online courses require a desktop computer, laptop computer, Chromebook, or Netbook with Internet connection and a Chrome (29+), Firefox (30+), Safari (7+), or Edge (20+) browser. No downloads required. Courses are not supported on tablets.

Minecraft courses and server access is available to verified accounts. Minecraft for Windows 10 is required for Training Day, Agent Recall, Gears of Time, Mythicraft, and Mind Crafters courses. Content and courses are subject to changes. NOT AN OFFICIAL MINECRAFT PRODUCT. NOT APPROVED BY OR ASSOCIATED WITH MOJANG.

Lesson image for: Introduction

Introduction

Create your first web page using HTML and CSS.

12 Modules:

  • Introduction
  • What is the World Wide Web?
  • What is HTML?
  • HTML Document
  • Title Metadata
  • Paragraphs
  • Line Breaks
  • What is CSS?
  • Background and Text Color
  • Colors in CSS
  • Project 1: My First Web Page
  • Quiz
Lesson image for: Headings and Images

Headings and Images

Using images and font styles, create a poster, a poem and a photo gallery.

14 Modules:

  • What are Headings?
  • Nested Headings
  • Font Family
  • Font Size
  • Font Style and Font Weight
  • Adding Images
  • Image Attributes
  • More on Images
  • Aligning Text and Images
  • Border Styling
  • Project 2: My Poster
  • Project 3: Acrostic Poem
  • Project 4: My Favorite Photos
  • Quiz
Lesson image for: All About Lists

All About Lists

Learn about ordered and unordered lists to organize content on a web page.

11 Modules:

  • Lists
  • Ordered Lists
  • Unordered Lists
  • List Item Type Attribute
  • Inline Styling
  • Revisiting List Types
  • Nested Lists
  • Lists with Images
  • Spacing and Sizing
  • Project 5: My Pets
  • Quiz
Lesson image for: Adding Hyperlinks

Adding Hyperlinks

Use hyperlinks to link to other pages. Create image links. Use CSS to style links.

10 Modules:

  • What are Hyperlinks?
  • Linking Files
  • Link Attributes
  • Identifying Elements
  • CSS Classes
  • Images as Links
  • Link Scrolling
  • Styling Links
  • Project 6: Home Page Navigation
  • Quiz
Lesson image for: Using Containers

Using Containers

Use container elements such as div and section to structure your page.

11 Modules:

  • Containers
  • Block vs Inline
  • More Elements
  • Semantic Markup
  • Using Floats
  • Positioning Elements
  • CSS Background Images
  • CSS Background Gradients
  • CSS Overflow
  • Project 7: Hero Unit
  • Quiz
Lesson image for: Tables and Media

Tables and Media

Learn to format content using tables. Embed video and audio in your page.

9 Modules:

  • Tables
  • Table Attributes
  • Table Styling
  • Embedding Video
  • More on Videos
  • Embedding Audio
  • Embedding GIFs
  • Project 8: My Channels Page
  • Quiz
Lesson image for: More on Styling

More on Styling

Learn about forms and more CSS features for advanced layouts and designs.

11 Modules:

  • Forms
  • Passwords and Buttons
  • More Form Controls
  • CSS Media Queries
  • CSS Pseudo-classes
  • More Pseudo-classes
  • Creating Tooltips
  • CSS Transitions
  • Project 9: Profile Card
  • Project 10: Responsive Page
  • Quiz
Lesson image for: Pixel Art

Pixel Art

Create fun pixel art shapes by using CSS and divs.

3 Modules:

  • Pixel Art
  • Project 11: Space Invaders Art
  • Project 12: Game World Creator
Lesson image for: Photo Gallery

Photo Gallery

Final Project 1: Create a picture gallery with thumbnails.

1 Module:

  • Final Project 1: Photo Gallery
Lesson image for: Pictogram

Pictogram

Final Project 2: Create your own Instagram clone.

1 Module:

  • Final Project 2: Pictogram

Problem Solving

Evaluate task goals and identify steps to reach them.

Critical Thinking

Analyze and develop logical solutions to problems.

Creativity

Produce varied artistic output using coding and other digital skills.

Web Pages

Apply HTML and CSS to create and design a standalone web page.

Choose a Plan to Accelerate Learning

All plans include access for up to 3 children

Choose Live Online Courses

Choose a Plan to Accelerate Learning

All plans include access for up to 3 children

Choose a 3-Year Self-Paced Plan

60% OFF

Yearly

$25 $10 /month Now $120 billed annually cancel any time
Add to Cart
60% OFF

Lifetime*

$780 $312 one time payment 28% savings over Quarterly
Add to Cart
60% OFF

Quarterly

$30 $12 /month Now $36 billed quarterly cancel any time
Add to Cart
60% OFF

Quarterly

$30 $12 /month Now $36 billed quarterly cancel any time
Add to Cart
60% OFF

Yearly

$25 $10 /month Now $120 billed annually cancel any time
Add to Cart
60% OFF

Lifetime*

$780 $312 one time payment 28% savings over Quarterly
Add to Cart

Access everything Tynker offers

  • Thousands of hours of creative projects in Game Design, Minecraft, Python concepts, and more
  • Personalized assessments and certifications in real-world languages
  • Access to our highly rated mobile apps: Tynker, Tynker Junior & Mod Creator
  • 5,000+ lessons built to improve problem solving skills and academic performance
  • Parent dashboard with mastery stats - watch as they progress from novice to expert
  • 30 Day Money-Back Satisfaction Guarantee

3-Year All-Access plans include:

  • 70+ courses
  • 5,000+ activities
  • Block Coding
  • Text Coding
  • 3 Mobile Apps
  • Minecraft Modding
  • Game Design
  • Robotics
  • Hardware
  • Web Development
  • Python
  • JavaScript
  • Processing (P5.JS)
  • Data Science
  • Advanced CS

Tynker is designed to progress with your child. A three year plan accelerates their coding mastery from block coding to advanced text languages.