Learn what is Webflow and what functions does it perform?

Webflow - functions and goals of the platform, pros and cons of the constructor, webflow integration

We'll take an in-depth look at all Webflow services (including Designer, CMS, hosting, store, etc.) to answer the most pressing questions:

  1. WHY is WEBFLOW useful and who is it for?
  2. HOW does their TARIFY SYSTEM and pricing plans work?
  3. Does WEBFLOW work with popular technology?
  4. Why is WEBFLOW BETTER than traditional tools?

Webflow's motto is "smart no code", which means that the tool was specifically designed for people who want to create websites without focusing on the technical aspect, while still relying on quality code and without being tied to any particular publishing platform.

This principle of operation will especially appeal to visual artists, as it allows designers to realize their imagination directly online, perhaps even bypassing graphics packages such as Photoshop and Sketch.

Blitz: Frequently Asked Questions

Before getting into the details, here's a selection of the most popular questions about Webflow, with short answers that include links to the relevant sections of this review:

What is Webflow?

At its core, Webflow is an online toolkit for creating and running websites. It's kind of a hybrid of traditional website builders like Wix, classic content management systems like WordPress, and actually writing website code by hand.

Confused yet? This tutorial is exactly what it's written to clear things up! First, it's best to understand the basic components of Webflow, namely its site designer, CMS, and deployment/hosting system.

How much does Webflow cost?

This is probably the hardest question about Webflow. Perhaps the best answer here is a chart we've made, which can be found in the pricing section.

To simplify, there are two pricing tiers in Webflow - account plans and site plans. Account plans determine how many people on your team can use Webflow and for how many projects. And site plans, in turn, differ between each other in terms of hosting options and e-commerce capabilities.

How easy is Webflow to use?

Here, as in all things: hard in learning - easy in battle . In other words, once you get used to Webflow, it's easy enough to use. Yes, it may seem more complicated at some points than, say, Wix or Squarespace, but the reward for the hard work is owning a much more flexible and powerful tool.

We'll touch on this topic in more detail in the next three sections, which deal directly with the core functionality of Webflow:

Webflow website designer

Webflow offers three main components: a codeless visual web design tool, a content management system (CMS), and hosting. The first of them is undoubtedly the flagship of the service - which means that first of all we will take a closer look at the Webflow site designer.

The Photoshop window-like interface is actually an HTML/CSS automation tool where the user is free to add, position and style elements as they wish, while the underlying system automatically generates the markup and all other necessary code. The interface is quite complex and takes some getting used to, but it is undoubtedly one of the most powerful and versatile real-time website builders available today.

Let's be clear right away: the Webflow site designer does not offer to simply draw any shape in the center of the monitor. After all, behind every visual element on a web page there is actual code, and such code will become exponentially more complex if you do not take into account the work of HTML and CSS.

In other words, to draw a simple square in the middle of the page, you add a new <div> element (Webflow calls it a "container" or "section"), set its position to "fixed" and its top-right and bottom-left positions to 0. Congratulations on your first programming lesson!

The Webflow Designer Panel is similar in properties to CSS, so to fully appreciate the power of this tool, you need to know the basics of HTML/CSS. However, if you check the "I don't write code" box during the registration process, Webflow will automate a significant portion of your website building processes. For example, it will handle media requests for media to ensure that the site behaves "responsively" (i.e., it will generate code on the fly to view your page from tablets and other mobile devices).

Content Management System (CMS)

In addition to the ability to modify any text or multimedia directly on the page being developed, Webflow CMS allows you to manually define custom content types (blog posts, projects, team members, etc.) using customizable fields, which can make life much easier for those managing large web projects with complex structures.

This is done using the CMS collections available on the stack icon tab on the left side of the editor's main window. Once a collection, or a specific content type, is created, you can customize fields and add elements to be used either as individual pages or as lists/grids on existing static pages. For example, you can add a collection of "team members" to create a page with photos of your company's people, names, descriptions, social links, etc.

Deployment and hosting

Publishing your child through Webflow is easy: click the appropriate button at the top of the Designer screen, and a list of available deployment options opens that includes a webflow.com domain subdomain (recommended for testing) and a custom domain. One more click and it's done, your site is published automatically.

Webflow hosting services are provided on a "create for free, add hosting for launch" basis. This means that you can create a prototype (up to 2 static pages) on the webflow.com subdomain, and then connect your domain name (not included in the free package) by subscribing to one of the Webflow hosting plans.

Store functionality (eCommerce)

One of the most recent (and most anticipated) additions to Webflow is the online store functionality.

Webflow eCommerce is offered on separate pricing plans and includes everything you need for online sales: product and inventory management, custom shopping carts, checkout, correspondence with customers, as well as self-service checkout.

The main advantage of Webflow eCommerce is the ability to fully customize every detail of your online store: from product grids and payment pages to how purchase notifications look.

By comparison, in Shopify, Wix, or even the WooCommerce + WordPress package, you would have to put a lot of effort (and also have programming skills) to achieve the same detailed level of control.

Pros and cons of Webflow

Okay, the components are sorted out. For the big picture, let's list the strengths and weaknesses of the Webflow service compared to similar website builders and popular content management systems:

Webflow Integrations as a Service

  1. Among the main advantages is the presence of Webflow integrations, which allow the user to connect the desired plugin out of the box and simply configure it, without the programming abilities.
  2. A professional real-time web design tool that easily generates clean, exportable code for both full-screen and mobile versions of the site.
  3. You can design your site from any of dozens of free and premium templates, or from scratch.
  4. Advanced CSS and JS management, allowing detailed control styles and animation, as individual elements, and the entire site.
  5. Quick and easy deployment in a middleware environment and/or on your domain directly from Webflow Designer.
  6. Integrated CMS with a flexible content type builder that you can use to create any type of static or dynamic content, from pages and blog posts to projects, reviews, team members, etc.
  7. Advanced distributed hosting based on Amazon Cloudfront gives your visitors maximum page load speeds and minimal chance of a "downed" site.
  8. Integrated content delivery network (CDN) provides high speed and increases the security of your site - content is downloaded from the best geographical locations for the user.
  9. An SSL certificate, which ensures web security standards, is already included in the cost of hosting (it usually costs $50-100 per year).
  10. Those who have never previously engaged in web-development, will have some time to work on mastering the interface and the principles of working with Webflow.
  11. Limited multilingual capabilities (easy to fix, in principle, with extensions such as Weglot).
  12. A confusing scheme of pricing plans for the account and sites, which tries to embrace all possible cases.
  13. The constructor interface is not fully compatible with Firefox and Edge. I.e. almost a quarter of all installed browsers (okay, the brainchild of Microsoft - what fiery fox is guilty of!?) Here Webflow certainly needs improvement.
  14. The Webflow e-commerce suite is still under active development, so for large and complex online stores it is still a bit rudimentary.