Webflow! Flexible Website Builder!

Webflow

Webflow provides the flexibility of front-end coding without requiring you to actually code.

Webflow feels magical. Go ahead, roll your eyes. I get it. I just called software magical. But let me explain. The big innovation with Webflow is their Designer tool. It gives you the flexibility of front-end coding without requiring you to actually code.

Front-end coding is basically the presentation of your website. It's how it looks and feels. It's the HTML, CSS and some Javascript. So how does Webflow do this? How did they build a design tool that gives the flexibility of code without actually having to code? Well, like most things that feel magical, there's actually a logical explanation behind it.

The Webflow Vision Webflow is the result of a thoughtful, coherent and frankly, novel vision. To start, Webflow doesn't shy away from the complexity of code. Instead it embraces it. So for example, you might be surprised when you add your first paragraph element to a page. Once you add it you'll see it just sits there, lamely spanning the width of the screen:

Mixing in a CMS and Ecommerce On its own, Webflow's Designer is really flexible. It's a great way to build static websites. But what takes Webflow to the next level is when you integrate CMS and ecommerce with the Designer. The CMS lets you create collections. Collections are custom content types. Think of them like a database.

Collections are made up of fields— for example: plain text, images, dates, colors and even Rich Text, which gives you a full WYSIWYG editor.

So for example, we could create a collection of articles. We'll say articles have a headline, date, permalink and content:

Then we can begin adding adding articles. We'll add two:

Editor Interface A quick note about Webflow's Editor. Webflow also includes an editor interface that allows you to browse the website and change text and images— it also lets you access the CMS. This is a handy thing to hand off to clients or a team.

Conclusion I am super impressed with Webflow. I honestly can't wait to see where it goes from here— but I did occasionally run into limitations. For example, I wasn't able to add fonts from Typography.com— my webfont selection was limited to Google Fonts and Typekit. I also found limitations in the CMS that keep me from moving some of my bigger projects to Webflow— for example, I would love to be able to reorder content relationships or have more control over the permalink structure.

I would love to be able to re-order this relationship field. But I do appreciate that Webflow has a Wishlist area where the community can vote and discuss new features. So Webflow is aware of what people are asking for. But you could argue these are petty limitations. I've been coding websites for almost two decades and I've probably built up a sense of entitlement over what I should be able to do. Because the reality is that you can do an awful with just Webflow. The main thing to acknowledge is that Webflow has a learning curve. You really need to understand the fundamentals of web design to use Webflow. I don't want to dissuade you— if you put your mind to it, you can learn these things. But Webflow definitely has a steeper learning curve than something like Squarespace. Even with my background as a web developer I find that some things became more confusing in Webflow— for example, I found it difficult to manage all my CSS classes. At times I wished I could code a stylesheet. I was just generating too many CSS classes. But overall Webflow is definitely offering a new approach to building websites without code— and at the heart of it's innovation is the Designer tool. When you mix the Designer with Ecommerce and CMS you get something that is truly new and interesting. I can't wait to see what else they built on top of this.