Light mode Switch to Dark mode High contrast

All courses

Webflow 101

Webflow moves fast — some details here may not match the current product.

The core concepts still apply. Specific UI details may differ.

Login with your Webflow account to track your progress

Webflow 101

Introducing Webflow 101, the ultimate course to learn the fundamentals of web design and development.

Learn the powers of web design, web development, and Webflow. Throughout this course, you’ll build a full landing page — step by step — and learn best practices for responsive and accessible design. Let’s do this.

Want to test your basic Webflow building knowledge? Click Test your knowledge in the Assessments section of the course progress box on the right to access a quiz.

Table of contents

1

Getting started

Coming soon

1

Welcome & resources 1:01

Welcome & resources

Coming soon

1

Intro to Webflow 101 2:16

Intro to Webflow 101

Coming soon

1

Intro to the box model 3:04

Intro to the box model

Coming soon

1

Intro to HTML 5:17

Intro to HTML

Coming soon

1

Intro to CSS 5:22

Intro to CSS

Coming soon

1

Welcome to the Webflow UI 8:13

Welcome to the Webflow UI

Coming soon

2

Site build

Coming soon

2

Recent updates to the Webflow Designer 1:32

Recent updates to the Webflow Designer

Coming soon

2

Site build: Hero 15:01

Site build: Hero

Coming soon

2

Site build: Navigation 6:31

Site build: Navigation

Coming soon

2

Site build: Logos 4:33

Site build: Logos

Coming soon

2

Site build: Cards 11:50

Site build: Cards

Coming soon

2

Site build: Form 15:07

Site build: Form

Coming soon

2

Site build: Footer 8:46

Site build: Footer

Coming soon

2

Site build: Responsiveness 14:12

Site build: Responsiveness

Coming soon

2

Site build: Interactions 14:07

Site build: Interactions

Coming soon

2

Site build: Design review & accessibility 16:11

Site build: Design review & accessibility

Coming soon

2

Site build: Publishing the site 6:19

Site build: Publishing the site

Coming soon

3

Additional layout learning

Additional layout learning

Additional layout learning

Coming soon

3

Quick Stack 5:32

Quick Stack

Coming soon

3

V Flex and H Flex 0:36

V Flex and H Flex

Coming soon

Progress

0%

Details

Beginner

2h 30m

20

Lessons

Assets & links

• Download the course assets
• Clone the completed project

Assessment

Test your knowledge

Enroll Now →

Continue Learning

<h3>Intro to Optimize</h3>Learn how to use Webflow Optimize to improve your site's conversion rate using testing, personalization, and AI Optimize.

<h3>Prepare to publish your site</h3>Learn how publishing works in Webflow, manage site changes with confidence, and prepare for launch.

<h3>Webflow SEO fundamentals</h3>Learn how to plan, build, and maintain a search-friendly Webflow site using best practices and built-in SEO tools.

<h3>Take your app live with Webflow Cloud</h3>Prepare and deploy an existing app, connect live data, and keep it running.

<h3>Collaborate with your team</h3>Learn how to set up roles, permissions, and workflows in Webflow so your entire team can work together safely, confidently, and efficiently.

<h3>Set up your team in Webflow</h3>Invite your team, assign the right roles, and scope access so everyone can work safely.

{
  "@context": "https://schema.org",
  "@type": "Course",
  "name": "Webflow 101",
  "description": "Introducing Webflow 101, the ultimate course to learn the fundamentals of web design and development.",
  "url": "https://university.webflow.com/courses/webflow-101",
  "inLanguage": "en",
  "provider": {
    "@type": "Organization",
    "name": "Webflow University",
    "sameAs": "https://university.webflow.com"
  }
}