A beginner's guide to building websites with Webflow in 2022

A beginner's guide to building websites with Webflow in 2022

Learn how to go about building Webflow sites. Take all of these steps and you'll go from complete beginner to Webflow pro!
Rachel A
Rachel A

Webflow has been around for almost a decade, but in the last few years, its popularity as a website builder has really started to take off.

More and more businesses and agencies are choosing to build sites on Webflow because of its accessibility to designers and marketers. Unlike other platforms, it's possible to create powerful, custom websites without the need to hire a developer. Take this interactive 3D solar system built purely in Webflow, for example.

And it gets better. The Webflow team is constantly developing and improving the platform, so it's only going to get easier and more powerful in the years to come. At the 2021 No-Code Conf, some exciting new features were announced that will make it even easier to build and launch websites in 2022 and beyond.

Why learn Webflow?

Webflow's growth in recent years has been impressive, but the team has made it clear that they're just getting started.

Compared to other CMS platforms and website builders like WordPress, Webflow's market share is still relatively low. The platform powers 0.9% of websites powered by a known CMS.

However, Webflow seems to be a popular choice for high-traffic sites (or Webflow sites attract a lot of traffic, depending on how you want to look at it). As you can see in the chart below, Webflow sites get more traffic than sites built on Wix, Squarespace, Joomla, Shopify, and WordPress.

The data also shows that while Webflow has only a small market share, its popularity is growing rapidly. In fact, its market share growth is outpacing many of its competitors. Data from W3Techs shows that Webflow's market share has more than quadrupled in less than five years.

If this growth continues alongside the boom in no-code apps and platforms, Webflow could soon become one of the most popular website builders in the world.

So if you're an aspiring designer or a fledgling agency, there's no better time to learn how to use Webflow.

In this guide, we'll take you through everything you need to get started building websites with Webflow. We'll take a look at some of the best resources for learning how to use Webflow, as well as share some tips on how to get the most out of the platform.

By the end of this guide, you'll be well on your way to becoming a Webflow pro. Let's get started.

What you need to know before you start

Before we dive into how to use Webflow, it can be helpful to have a bit of background knowledge on website building in general.

While you can get started building a site in Webflow with zero experience, it will really help later on if you know some basic HTML and CSS. This is optional, but if you want to get a head start, it can be helpful to go through some basic beginner's courses such as those offered by Codecademy.

Having a solid foundation in the principles of good UX design will also be invaluable when creating a website on any platform. There are plenty of free resources available online if you do a quick search, including plenty of high-quality YouTube videos that will give you a handle on the basics.

1. Start with Webflow University

Surprised? The best place to start if you’re learning Webflow is right at the source.

Webflow University is packed with step-by-step video tutorials, lessons, and courses that will take you from complete beginner to confident Webflow user. The best part? It’s completely free!

You can learn at your own pace, and the tutorials are structured so that you don't need to complete an entire course from start to finish. Instead, you can simply choose the topics that you're most interested in or learn as you're building your own site. This, along with the fact that information is presented in both video and text format, makes Webflow University really accessible and customizable to the way you learn best.

Webflow University is undoubtedly the best place to start your journey to becoming a Webflow pro. But once you get past the basics, there are some other fantastic third-party resources that can help you take your skills to the next level.

Connor Finlayson has some great YouTube tutorials that are really valuable if you're trying to do something specific with Webflow. He also reviews other tools that can be useful when you're building a site in Webflow, as well as some general tips for workflow and productivity.

Also, make sure to check out NoCodeDevs for some useful video tutorials on Webflow, as well as lots of helpful information about other no-code tools that work well with the platform.

2. Dive into existing projects

One of the best things about Webflow is that you have access to a huge library of existing sites built by the community that you can explore, study, and even copy to use as a starting point for your own projects.

There are some incredible examples of sites built with Webflow in the "Made in Webflow" section of the Webflow website. Spend some time browsing through them and exploring how they work.

Unlike websites built on other platforms, there's no need to sit down and try to figure out how a particular feature or design was achieved. In the Webflow showcase, you can filter results to show you "cloneable" sites only. This means that you can simply click a button and have an exact copy of that site added to your Webflow account.

Once you have a clone of the site in your account, you can explore how it was built from the back end and start to make customizations and changes. This is an incredibly powerful way to learn as you can take existing projects and make them your own, all while understanding how everything works under the hood.

3. Build something from scratch

The best way to learn anything is by doing it. And that's especially true when it comes to learning Webflow.

It can seem a little overwhelming when you're starting out, but the best way to learn is simply to jump in and start building something.

Start with a simple project like a one-page site or a basic blog. Then, as you become more confident, you can start tackling more complex projects.

Building something from scratch will help you to understand how everything works together and give you the confidence to experiment with different features. It's also a great way to get a feel for the platform before committing to using it for a major project.

One of the great things about Webflow is that you're never far from help if you do get stuck. The Webflow community is incredibly friendly and welcoming, and there are lots of resources available if you need them.

The official Webflow forum is a great place to ask questions and get help from other Webflow users. Or, if you're a Twitter user, you can tweet your question using the #webflow hashtag, and someone from the community is sure to be able to help. There’s also the /r/webflow subreddit, which is a great resource for problem-solving as well as finding helpful tutorials and articles.

4. Build a business with Webflow

Once you've got to grips with the Webflow platform, you might be thinking about ways that you can use your new skills to build a business. And there are plenty of opportunities out there for those with the right skill set.

There are also lots of resources out there to help you get started.

Makerpad is a free online library of courses designed for those who want to build a business using no-code tools. Some examples of the tutorials available include:

  • How to build a no-code job board
  • Using Webflow to streamline selling digital products
  • How to setup memberships with Webflow
  • Building an ebook landing page with Webflow

As well as tutorials and courses, there are also inspiring case studies and interviews with successful no-code entrepreneurs that are well worth a read, as well as a job board listing no-code jobs and freelance opportunities.

NoCode.tech is another great resource for those looking to build a business with no-code tools. Here, you'll find over 200 lessons and tutorials, as well as the opportunity to join weekly coaching sessions for expert advice.

5. Build faster with templates and resources

Starting from scratch is a great way to learn when you're just getting acquainted with Webflow. But once you've got to grips with the basics, you can save a lot of time and streamline your workflow by making use of pre-built templates and components.

There are lots of places to find templates for Webflow, both free and premium. The official Webflow templates page is a great place to start, with a range of high-quality templates available for a variety of different purposes.

There are also some fantastic templates and components available from sites like Flowbase and Webflow creators like Mackenzie Child.

On top of that, the team at Relume have put together Relume Library, a website hundreds of pre-built components that you can copy and paste into Webflow. Incredibly, the entire library is built inside of Webflow with Memberstack used to gate all of the content, which makes it a fantastic example of what is possible with Webflow.

Although the power of Webflow means you can build without coding, it's possible to add powerful functionality with just a little bit of code. Not sure how to code? No problem! Sites like CodeCrumbs offer pre-built snippets that allow you to enhance your Webflow site, such as by adding floating labels to your forms or a custom date picker.

6. Keep building and share what you've made

The most important thing is to keep building. The more you practice, the better you'll become at using Webflow. And as you become more confident, you can start sharing your work with the community.

There are lots of ways to share what you've made. Twitter is a great place to start as the Webflow and no-code communities there are very active and always keen to see what you've built, give feedback, and learn from you. Use the hashtag #MadeInWebflow to show off your work.

The official Made In Webflow showcase site is also a great place to share your work and get some exposure if you've made something you're proud of.

Leap into your Webflow journey

Get started today, and you'll be surprised at how quickly you can learn to build websites with Webflow.

If you're looking for a new opportunity or challenge for the second half of the year, putting a little time and effort into learning Webflow could be a great investment. And who knows where it might lead you?

Make sure to keep checking our blog for more tips, tutorials, and resources to help you on your journey. We'll be sharing everything we know to help you build beautiful websites with Webflow in 2022 and beyond.

More from the Blog

Thumbnail for blog post

How to set up Google Analytics for your Webflow site

Learn how to set up Google Analytics on your Webflow site.

Read Story
Thumbnail for blog post

Webflow pricing changes explained [as of October 2022]

Not sure how Webflow's pricing works? In this post, we break down each of the plans and tell you which is right for you.

Read Story
Thumbnail for blog post

14 no-code tools to help you build websites and apps (in 2022)

If you're learning to build websites or apps, save yourself some time with these no-code tools.

Read Story

Follow along.

Get new tutorials, tips and monthly product updates sent to your inbox.
We will never share your email address with third parties.