Will replace web developers with tools like Webflow

Webflow: Professional website creation, CMS and hosting from a single source

What does the platform offer in detail?

Webflow enables the professional creation of unique websites including CMS and hosting and without having to program yourself. What that means in detail and which ones Features and tools Webflow provides to achieve this, you will learn in this chapter.

Designer

At first glance, the designer is reminiscent of the surface of classic graphics and photo editing programs such as Photoshop, and it works in a similar way. The designer is nothing but one Front-end canvas for the visual use of HTML5, CSS3 and JavaScript. You start on a white surface and you can design your website completely freely like a programmer, but without having to program yourself. Subpages and directories can also be created and managed here.

HTML elements and prefabricated layouts can be dragged and dropped onto the visual surface, designed with the CSS editor and animated with the JavaScript editor, even more complex designs can be implemented quickly and easily with Webflow Grid, for example. In the background, Webflow automatically transforms the settings you make into clean code that is ready for publication or handover to a developer.

The HTML structure is completely transparent and is represented visually with a structure tree. The same applies to CSS settings: You can create your own classes and have access to all important CSS settings. There is also a visual interface for JavaScript, with which you can animate every element on the page as you wish.

Important: This is not a classic website builder. Webflow is much more complex and built closer to the philosophy of programming. For effective and efficient work with the designer is a Basic understanding of HTML, CSS and Javascript extremely helpful, if not necessary. This can be acquired very quickly with the training platform provided by Webflow, without ever having to write a line of code yourself.

In addition, the website can also be adapted in the Designer with various breakpoints for smaller screen sizes such as tablets and smartphones - keyword Responsive design. This gives you full control over how the website looks on different screen sizes.

editor

A customer who has no idea about Webflow, HTML or CSS can hardly be expected to work with the designer. So how do you make it possible for the customer existing content of the website easy to adapt without help? The editor was developed for this.

The customer can log into the website using email and password and customize the content directly on the page and completely visually, just as easy as in a Word document. So there is no confusing backend with superfluous functions or other hurdles. There's just the customer, their website, and the content they want to work on.

You can also set which content the customer can work on and which cannot. This means that inadvertent changes and errors by the customer, which are not wanted, are virtually impossible.

The same principle applies to new contentthat the customer wants to add, e.g. Blog posts. With just a few clicks, the customer can publish new, dynamic content on the site himself. The new content then automatically appears on the page in the design and layout specified by the web designer.

CMS

Webflow delivers a content management system that works for designers, customers and developers alike, without plugins, PHP or databases.

Designer can create their own content types (so-called collection lists), freely design and determine which content or fields this content type has. The designer can therefore determine himself from which building blocks, e.g. a blog post, a case study, a reference project, a job advertisement, etc. and design the layout of this dynamic content yourself.

The customer can later create a new blog post himself, for example, by filling in the fields prepared by the designer with the editor and clicking on “Publish”. The blog post then appears automatically in the desired design and anywhere on the website where the designer has specified it. A dream for content marketing on the website that the customer can easily manage and control himself.

Interesting for developer: It is also possible to link to an existing CMS, external data sources or a smartphone app. There are hardly any limits to the possibilities here.

Animations

Webflow allows bespoke animations for each element of the website based on interactions made by the user (e.g. mouse click, mouse movements and scrolling) and / or the status of the page (e.g. playing an animation after the page is fully loaded). The integration of After Effects and Lottie animations is also possible.

In addition to some ready-made animations, you can design animations yourself completely freely and visually, without writing a line of code. There are practically no limits to what you can imagine. Great for everyone who cares about the user experience but doesn't have the time or inclination to program complicated animations with JavaScript.

You can read through in more detail here what is possible with the integrated animation editor of Webflow, among other things, or see for yourself in these examples:

E-commerce

In contrast to common e-commerce platforms such as Shopify or WooCommerce, Webflow enables complete freedom of design for all componentsthat make up a typical online store: Product pages, checkout pages and the shopping cart can be designed completely freely, you are not limited to templates or a certain structure.

This makes it much easier to stand out from the competition by having a Online store designed who is unique and fits your own brandinstead of another Shopify or Woocommerce store that always looks the same.

Corresponding functions for the simple management of orders, tax rates in different countries, payment methods, etc. are also available. You can read here what Webflow can do in direct comparison to common e-commerce platforms.

Hosting

Webflow hosting is provided by the Amazon Web Services (AWS) cloud computing platform and supported by a global content distribution network (CDN) operated by Fastly and Amazon Cloudfront. The result are Lightning-fast page loading times and the certainty that you will never have to worry about server maintenance or PHP updates.

There are also extremely useful functions such as free SSL encryption for every website, automatic backups, password protection for certain pages, custom forms, functions for simple SEO management, integrations for Google Analytics and other common marketing tools, a search function for your own Website and literally no maintenance.

However, should you decide not to host with Webflow (for whatever reason), the following applies: Since all Webflow websites are coded in basic HTML, CSS and JavaScript, you are not tied to a specific platform or topic. Just download your website files and host them with your preferred hosting provider. Important functions such as the integrated CMS or contact forms are then, however no longer readily functional.

Dashboard & backend

The dashboard serves as a Overview of all website projectscreated in Webflow. Here you can also create folders for specific projects, delete projects or create new ones. The dashboard is therefore particularly useful for web designers and agencies who oversee many customer projects. You can see all customer projects at a glance and sort and categorize them.

There is also a Backend for every projectthat you create with Webflow. Here you can make settings for hosting, editor, payment accounting, SEO, forms on the website, fonts, backups, integrations and custom code. It is also possible to duplicate a project, share it publicly or transfer it to another Webflow account.

Support

Due to its extensive range of functions, Webflow is not very beginner-friendly, but it compensates for this with extensive support options.

In the in-house Webflow University Hundreds of explanatory videos and tutorials are waiting, which build on each other and not only bring the viewer closer to Webflow step by step, but also to various basics and principles of web design and programming.

There is also your own Forumwhere you can talk to other Webflow designers and experts and ask questions. In most cases there is already a thread in the forum that solves your own problem. Googling once or using the search function in the forum is usually enough to get the answer to your question.

In addition, you can have a Support ticket open, and usually receives a detailed and personalized answer to his question within a few hours.