This post was originally published on Prototypr.
It seems like website builders are about a dime a dozen these days. And to be perfectly frank, the vast bulk of them are just awful.
Sure, they work just fine for the average inexperienced user to quickly get a personal website up and running … but for anything even remotely resembling professional use, you’re better off looking elsewhere.
Webflow is a rare exception to this rule. Built with a “code-first” philosophy, Webflow is an all-in-one web design tool that allows users to design, build, and launch responsive websites visually.
After having used the platform consistently for the past year, and after having tried many others, I feel confident in saying that Webflow is without a doubt the single best site builder currently on the market.
Is it perfect? Of course not. There are several things I’d like to change about the software if I had the chance, and I mention some of them below.
But regardless, Webflow is a fantastic tool that can help designers bring their mockups to life — without needing to enlist the help of a front-end developer or rely on poor quality DIY software.
What Is Webflow?
Launched in 2013 as a graduate of Y Combinator’s startup accelerator, Webflow is a drag-and-drop tool for creating performant, responsive websites without the use of code.
And it’s designed to surpass them all in terms of ease-of-use, flexibility, and performance — and in this regard, it’s largely successful.
Here’s how it manages to do all of that.
Designer and Editor
The Webflow Designer is a Photoshop-like interface that allows users to automatically generate semantic markup by dragging and dropping HTML elements onto a canvas and styling CSS properties.
In contrast to the notoriously horrendous markup produced by DIY site builders and all-in-one WordPress themes like Divi, Webflow exports W3C-compliant code that can be instantly deployed as-is or handed off to developers for further customization.
The Designer interface is admittedly complex — especially for those without any prior knowledge of basic development. But overcoming this initial learning curve will be hugely rewarding in terms of what it can teach these users.
For instance, designing in Webflow requires (and encourages) thinking less like a graphic designer and more like a front-end developer.
Instead of “absolutely positioning” a bunch of elements onto a blank canvas, users create and elements, define CSS classes, and utilize modern layout modules like flexbox and grid. All with a visual WYSIWYG editor.
For this reason, designing in Webflow — combined with the excellent tutorials on Webflow University — can serve as an excellent stepping stone for designers looking to break into front-end development.
What’s more: The platform also comes equipped with a pared-down Editor that can be used by clients to make basic edits to their website … without breaking the entire site structure in the process!
While launching a blog in Webflow might take more upfront work than it would with a native blogging platform like WordPress, the result will likely be well worth the effort.
Users are often locked into their theme’s default templates and styles. And so, customizing individual elements like post fields requires either adding third-party plugins or manually rewriting the underlying template files.
Webflow CMS, by contrast, bills itself as “the world’s first visual content management system,” allowing designers to define the structure and style of their dynamic content without messing with plugins, PHP, or databases.
This content can be hand-created, imported from a .CSV file, or added through Webflow’s CMS API.
Users can then create Collections, or reusable templates for dynamic content types. For example, a website can feature collections of blog posts, authors, clients, projects, products, categories, and so on.
It’s like having all of the upsides of using a database — without actually having to manage a database yourself!
In my opinion, this is coolest feature that Webflow currently has to offer … even though it can sometimes be one of the more frustrating.
Nevertheless, you can create some pretty incredible animations with this tool, if you take the time to learn it. (Just check out the landing page advertising Interactions 2.0!)
While I can’t say I’m 100% comfortable using the Interactions panel, I’d still much rather work with this than write my own
Deployment and Hosting
The result is lightning-fast page loads and the peace of mind that comes along with never having to worry about server maintenance or updating PHP.
All hosting plans come equipped with free SSL certificates, HTTP/2 compliance, site search, form control, password protection, an automatically-generated sitemap, and automatic backups.
The “Basic” hosting plan costs $15 per month and includes most available features. But in order to use Webflow CMS, you’ll have to fork over the extra cash for the $20 per month “CMS” hosting plan.
On the bright side, however, if you find that none of these plans work for you (or if you just don’t want to spend the money), it’s no problem!
The latest — and most hotly-anticipated — addition to the Webflow suite of tools, Ecommerce was released as public beta in late 2018.
This includes product pages, galleries and category pages, shopping carts, and checkout pages. With Webflow, you’re not limited to any sort of pre-designed Ecommerce structure!
Achieving this same level of customization with a tool like Shopify would require spending thousands of dollars per month for a Shopify Plus plan and then taking the time to familiarize yourself with the platform’s Liquid templating language.
The platform also provides a simple solution for managing complex administrative functions like defining shipping regions, calculating taxes, and managing inventory and fulfillment.
Because it’s still a relatively new feature, Webflow Ecommerce is still missing some core functionalities that might be expected from a full-featured Ecommerce solution — customer accounts and order history are still lacking, for example.
But both of these are on the docket. Other future planned developments include support for subscriptions and POS integration.
The Final Verdict
Standing far apart from the glut of low-quality DIY design software currently on the market, Webflow provides a powerful solution that is suited to most professional web design and development needs.
Such features as the Webflow Designer, CMS, and Ecommerce allow users to easily create full-featured, performant websites — without needing to learn code or contract with developers.
The platform does have its drawbacks, which include a less-than-intuitive animations interface and limited Ecommerce functionality. But even still, it is the best design platform currently on the market and one that’s well-deserving of your attention.
This is true regardless of whether you’re a professional designer or simply a business owner searching for a more powerful, customizable, and robust solution for your web presence.
Still not on board? That’s fine. Head on over to Webflow, and try it out for yourself!