View All Guides

How to Learn Webflow

Last Updated:
September 21, 2023

You've decided Webflow is the right option for you. Now it's time to learn. How should one learn Webflow?

Short answer: It depends.

It depends on you.

ONE: It depends on what you want to build.

Are you looking to build brochureware? An ecommerce store? A membership platform? An online publication? Focus on articles, videos, and courses focused on the types of sites that you want to build.

TWO: It depends on your existing design and development skills.

Since Webflow is a visual development tool, no existing programming experience required. The interface is more akin to say a design tool, like Photoshop, than a code editor, like Visual Code.

THREE: It depends on how you enjoy learning.

Do you learn best by tinkering? By reading detailed articles? Look for sources that fit with your natural learning style. Even if a source is highly recommended, it may not be for you if the format doesn't align naturally with how you learn best.

With those disclaimers out of the way -- and the caveat that I am still learning Webflow -- these mostly free resources have helped me or have looked interesting to me (but were not my style or not a fit for me at the time):

Webflow University: I HATE tutorial videos. More often than not, they are thinly disguised marketing videos with long intros and lacking "how to" detail. Webflow University videos are the exception.

The videos respect you and your time.

The videos are concise.

The videos are funny.

The videos do not need to be watched in sequence.

If you would like more structure to your learnings, consider the Webflow Portfolio course which organizes lessons from working on the homepage, to project pages, to adding interactions.

Made in Webflow (fka Webflow Showcase): Spend time browsing the directory of community projects, especially the Cloneables. See a site you like? Duplicate it. Open it up and examine how it was built. Try changing it. Would you create it the same way? What would you do differently? Is there a better way? What could you add to the cloned project to give it your unique point of view?

After completing a few projects, share your work to the Showcase. No separate domain purchase required. Not sure what to build in Webflow? Look to sites like Dribbble, awwwards, or One Page Love for inspiration. Or -- your personal bookmarked list of favorite website designs.

Tip: Knowing how to name your classes in Webflow can be intimidating at first. A class naming strategy like Client-First or MAST helps. Don't expect to understand it all at once. Learn a little with each project.

An alternate approach to working with a cloneable is to start building using components or libraries. In addition to the components that you can make and are availalbe within Webflow, there are third party sources like Relume.

Webflow Meetups: Attend an in person or virtual meetup to meet and learn from others. Attendees range in abilities from beginners to experts. To see upcoming events, visit the iheartnocode events page or Webflow's dedicated community page.

Webflow Forums: Browse the forums. See an interesting solution? Bookmark for later reference. And take one more step: Search for the person's profile in the Webflow Showcase and give the person a follow.  

YouTube Videos and Livestreams: Ever approachable, Nelson Abalos Jr.'s (aka PixelGeek) videos show how to build popular designs in Webflow. Timothy Ricks regularly posts videos that will take your designs to new levels, as does Web Bae. Finsweet, Edgar Allan, Relume and *flow party regularly stream. Visit the resources page for more ideas.

Online Courses:

‍

Connect with Others: Find a community that matches your interests. Regularly attend livestreams and ask questions in the chat. Follow other Webflow users on your favorite social media platforms. Join a Slack, Discord, or other online community like State of Flow, *flow party, NoCode North, Webflow Café, New 2 The Flow, Floxies. Get to know other users by listening to interviews via The Great Design Lead or Webflail. Visit the resources page for community, newsletter, and podcast suggestions.

‍

Additional Resources:‍‍

One final tip: Invest in learning HTML and CSS fundamentals. Don't spend too much time -- In Webflow, you won't be coding HTML and CSS from scratch (unless you need to for a specialized use case), but a general understanding can speed up the time it takes you to learn Webflow. Jen Kramer offers basic foundational information via ebooks and emails.

‍