Is Webflow for Developers? My Experience
By: Eduard Fastovski
Tags: Front End Development, User Experience, Programming, Web Development, Design

So why do most site builders suck?

It’s a result of the interface being very different from the way that webpages actually work.

An example is Wix, where you can just drag an element around to position it anywhere on the page. Anyone who codes knows this means it’s using absolute positioning everywhere, which is hard to adjust on different sized devices, and if you adjust on every size, you are producing a huge amount of garbage CSS.

Other site builders just abstract far too much away from the realities of HTML and CSS. They try to make things so easy, that you have no idea what is actually going to be produced.

You also have no visibility of which class names are going to be created. And when you create and then delete something, you don’t know if there is something left over — unused CSS classes or empty HTML tags.

How Webflow fixes this

Webflow keeps its interface very close to how the web actually works. There is no dragging to position like in Wix. You need to understand and use the box model, flexbox, CSS grids and other front-end development concepts.

In fact, it’s almost like writing code, but by clicking buttons and moving sliders instead of writing out the lines.

You can give elements names with actual meanings (AKA semantic classes). This one is ‘banner’, this one is ‘newsletter-form’. Unlike other builders where you constantly deal with lots of randomly named divs.

This means you have a lot of control over the code that is eventually generated and you can choose the best strategy to achieve a certain layout.

This might be difficult for non-developers

This level of control and closeness to actual code makes Webflow more difficult to use for the average person, than other builders like Wix.

If you build a website for a client in Webflow, they will mostly just use the Editor panel — which is a simple interface for adding content to the Webflow CMS.

However if they entered the designer panel, they will most likely be overwhelmed and mess something up, unless they are very tech-savvy.

A professional designer will fare better, but to get the most out of Webflow and to be able to build a clean and bug-free site, they must understand at least the basics of HTML and CSS.

Things like the box model, types of positioning, maybe a basic understanding of flexbox, as well as theoretical knowledge like why it’s best to build mobile-first, and how to keep a site loading quickly.

Great for teams and small agencies

I run a web design & development agency together with my girlfriend Kristina — she’s a UX/UI designer.

We have a small portfolio site for the company, and previously, it’s always been a pain to make updates. We’ve always used a static site generator (first Jekyll then Hugo).

Whenever Kristina wanted to freshen up the design, she would update her mockup in Figma, and then it’s up to me to write the code. Meanwhile I’m often swamped with client work and it would be several weeks until I have time to work on our site.

We’ve recently rebuilt our portfolio site in Webflow, and Kristina was able to build almost all of it herself. This is pretty crazy if you think about it. Building highly performant websites and totally custom website was previously a skill that takes years to learn.

In future she will be able to make updates to the site while I can sit back and relax…ahem… I mean… continue working hard on client projects!

The most important win for us is that we will be able to create new landing pages for our services very quickly. I’ve actually seen large companies using Webflow as a ‘landing page machine’, allowing more customizability than leadpages or similar.

We’ve also had ideas for certain blog posts — tutorials and guides — that would need unique layouts. And while this would be annoying for me to rewrite in code, it becomes much easier in Webflow.

A nice tool for a designer, a weapon in the hands of a developer.

Knowing how it all works underneath means developers can be power users of Webflow. We can take it’s capabilities to the absolute limit.

I know it’s still not as fast or as flexible as writing your own code. But there are situations where you need a CMS or a simple page builder that produces acceptable code.

You might have a client that wants to make design changes later on, or you might be handing off to a designer, or it might just be a site that needs plenty of small changes regularly.

In these situations, Webflow is my go-to tool right now.

What other options are there? I’d love to hear your thoughts. Please leave a comment below!