Marketing

The secret to fast, beautiful websites without a development team

Growth is a product of rapid experimentation, optimisation & creativity. Nowadays, teams can't be dependent on one another if they want to be always iterating, failing fast & uncovering the secret sauce to growth.

Many marketing teams we've worked with are often bottlenecked due to the amount of time developers can dedicate to marketing requests.

The scarcest resource in modern times: Development time.

But with the right infrastructure, this doesn't have to be the case. And let's be realistic: Your dev team should work on your product anyways, not landing pages.

There's two great tools to accomplish this, depending on your needs: Webflow and Prismic. Let's jump straight into use-cases.

Webflow: Website builder on steroids

For must of us, Webflow is the best choice. And to put my money where my mouth is: This site is fully built on Webflow.

If you're a service provider (like ikaros) or don't have at least a couple of developers on your team, Webflow is right for you, no question.

When I first heard website builder, I thought "Great—more cr**py Wix websites". But Webflow is different: For one, you do actually need a designer (or design experience) to get the initial layout & structure done, but it is also a lot faster and more flexible than for example Wix, Unbounce or Squarespace. I call that a plus (and a good design is cheaper than you may think).

Why you should use Webflow

One: The number one benefit of a Webflow build is that you don't need development resources to build out your site. It's not self-service (unless you've already got design experience), but any designer will be able to set up structure and layout for you. We love working with freelancers for this, expect about US$500 per page for initial design and implementation, then US$45 – 75 / hour for updates and changes. And for that investment you get a professionally looking website.

Freelance designers offer great value to get professional and well-designed Webflow pages off the ground.

Making changes is even easier. You (or your team) are easily able to modify copy, images, and—if you're a bit technical—even make small structural changes if you need to.

Two: Your 'unique' Webflow pages, like your homepage, are going to be static (which means the pages are sent to the user as they are displayed) which is great for SEO and site speed. Check out our results below—and that is from when we first deployed the site and hadn't put much effort into optimisation.

Google Page Speed Results for ikaros.io
Google Page Speed Results for ikaros.io

Webflow is great because it means you need to worry less about following SEO and page speed best practices and can focus more on creating convincing content. There's still a few 'gotchas' around image sizing (which we cover below), but as long as you keep these in mind, you're golden. Site speed is so important for SEO and good UX and yet so many businesses don't get this right. Check out your competitors on Google Page Speed Insights and I'm willing to bet most of them will have scores

Three: For dynamic pages (like this blog post or product catalogues), Webflow offers a customisable CMS. Unlike your typical CMS (like Wordpress) which serves content dynamically, Webflow will still pre-generate your pages, making your site load much faster. At the same time, you get all the benefit of being able to define your own content model, making it easy to re-use content and ensure consistency across pages. Even better, you can also reference and use your dynamic content on static pages.

For our client Order In, for example testimonials are managed through the CMS and for each landing page we can pick which ones are appropriate, e.g. based on industry, product, etc...

A CMS provides easy and dynamic management of testimonials.

Taking this a step further, for Order In, the Webflow CMS lets us quickly generate a large number of landing pages (150 and counting) for SEO and SEM purposes that follow a consistent (and optimised) format, yet have unique and relevant content.

Whatever you're doing, thinking about and defining your content model upfront is going to save you a lot of headache. This is less relevant when using the CMS purely for pages, but more so if you have relationships between content elements (e.g. a blog post has authors, and categories attached to it)

Defining your content model in advance is critical.

Four: For next-level hyper-personalisation you can layer tools like Google Optimise—or if you're technical, Handlebars—on-top of Webflow. Custom code and embeds make this painless to implement, even in special use-cases (e.g. address-auto completes).

What you need to keep in mind

Webflow has a few 'gotchas' that you should keep in mind when working with the platform. But as long as you're aware of them you'll be able tow around them in most cases.

One: When running only a Webflow site or  a platform that can run on a subdomain, setting up Webflow is very easy. Anything on your main domain is driven by Webflow and anything on the subdomain is driven by your platform/app/product. However, this can become an issue if you want to leverage app content (e.g. product catalogues) for SEO. After-all, content on a different subdomains doesn't contribute as much to your rankings as content on the same subdomain. This is solvable (using something called a reverse proxy), but requires some technical work to set-up.

Two: Webflow doesn't have a formal review/approval processes for content (or layout changes) that you'd get with e.g. Prismic. This means you need to keep track of content changes outside of Webflow and make sure they go through your appropriate review process.

Three: While Webflow has both an undo-button as well as backups that let you roll-back the full site, it does not support versioning and rollback of a specific feature. Let's say I change some copy on the homepage and publish the site, then update images and a blog-post. To revert the copy on the homepage, I'd need to manually change it back to the previous state, or roll back the full site (losing the blog post and image update in the process).

No content & layout versioning means you can't rollback a specific change. Instead, you'll need to either rollback the full site to an earlier point in time, or manually change content back to what you wanted it to be.

Four: Webflow has a built-in image optimisation service that resizes and optimises images for different devices. This is awesome, as it avoids the scenario I've seen way too many times: A blog full of 10MB thumbnail images. However, the smallest resolution this optimisation service scales down to is 500px. This means any images smaller than that (e.g. the avatars in our testimonials section) still need to be appropriately sized by hand.

Overall, Webflow is a fantastic tool to build and maintain high-quality sites easily. If you need more control and flexibility than the platform offers (and have the tech team to help with the initial build), Prismic may be the better option for you.

Prismic & Netlify: The power-user alternative

If there's one combo that's unbeatable for flexibility and capability it's Prismic and Netlify. Content Management Systems are often associated with slow load speeds, security risks and clunky interfaces (I'm looking at you Wordpress). However, a new breed called 'headless CMS' are here to give you full flexibility around your content model while working well with modern web development approaches like static site generation and single page applications.

Combined with all-in-one deployment and hosting solutions like Netlify, Prismic can (and is) powering large scale web-applications. The only downside: you need a lot more specialised talent to build out the site and make structural changes.

It is overkill for most marketing applications, but if you have the development capacity for the initial buildout you can support a setup that's a lot more customised than Webflow.

Why you should use Prismic

One: With Prismic, you've got full flexibility to define your own content model. A content model describes how the different elements relate to each other. For example, a blog post element can have one author, but multiple tags. As a result, an author can implicitly also be related to multiple tags. This gives you a lot more freedom on designing content and constraints, but also adds a lot more complexity when defining individual modules. For example, is a testimonial a stand alone element, part of the client or company elements? When well defined, headless CMS systems enable true modularity, building out re-usable components and aligning with modern web development practices. At the same time, fully separating content from design & layout facilitates the reuse of content across devices.

Full separation of concerns between content and design makes content easily re-usable across multiple channels (e.g. mobile app and website).

Two: Version controlled content integrates approval and review process directly into the platform.

Three: Native multi language support makes internationalisation and localisation a lot more robust.

Four: 'Slices' let you pre-build optional/replaceable modules that go beyond Webflow's pre-built components and let you have more variety in your CMS-driven pages than Webflow's 'rich-text' feature allows you.

Five: Unlike Webflow, Prismic gives you full control over your code, implementation and hosting.

What you need to keep in mind

Whether Prismic or another headless CMS, there are two major drawbacks to keep in mind over a solution like Webflow. For one, the initial development effort required to set-up the platform is significantly larger and you'll need to ensure SEO and other best practices are adhered to. Once the site is built out, updating or adding content is just as—if not more—straightforward as with a website builder like Webflow.

Unique to headless CMS, you'll also need to invest a lot more thought into designing your content model to avoid a headache down the line—as making significant changes to your content structure means implementing your site.

Honourable mention: Ghost

If all you're looking for is a blogging system to complement your existing website our honourable mention goes to Ghost. Ghost is a fantastic, easy to use publishing System, addressing many of Webflow's disadvantages, but focusing more narrowly on blogging as opposed to website building. If you plan to customise you site, you'll also need to build out the templates with the help of your development team, making layout changes harder to implement.

Need help with your next project? Give us a call on +61 2 8311 8689 or email us at hello@ikaros.io.

Leave it with us.

Data-driven growth and analytics consulting for scale-ups & established corporates
Let’s talk