Learning Webflow, the definitive guide

A compendium of resources for designers on their webflow learning path

I decided I wanted to do a one month immersion into Webflow. Before diving into this magical tool, I did the same with Shopify and Wordpress DIVI. And after having done a deep dive on them I choose webflow. But this is not a comparison post. This is about how to make an immersion in webflow.

I would say there are some steps on your process whether you begin from zero or whether you can design and code (or nocode!). So I made this graphics simulating what I consider the appropiate learning path.

If you know nothing, go first to web design, then get familiar with CSS and layouts. Learn something about SEO and interactions and also performance. Next step would be to use some Class naming convention in your workflow. Finally you could dive into CMS, integrations and so on.

The webflow learning path

I rearranged the courses from webflow university with what I consider to be the proper order, going from beginner to advanced. Do not forget about business and freelancing.

Webflow courses

Beginner Courses

• Webflow 101 crash course: Jump right in to Webflow — get an overview of the basics and get started on building your first website, without learning or writing code.
• 2021 design portfolio course: Build and visually design a full portfolio website within the span of 21 days. Covering everything from the basics of grid and flexbox to advanced interactions and accessibility work, this course takes us through each and every step of building and launching a site in Webflow.
• Ultimate web design course: From the fundamentals to advanced topics — learn how to build sites in Webflow and become the designer you always wanted to be.
• SEO fundamentals: An overview of search engine optimization (SEO) fundamentals and best practices — learn how to optimize your content from the start.
• Webflow Ecommerce: Learn how to build and design your Webflow Ecommerce store. Customize every detail and launch a fully functional online store — without writing code.

Advanced

• CSS layout & positioning: Dig into the world of…