25 January 2023 / Last updated: 25 Jan 2023

Marketing balena: Why we transferred our marketing site to Webflow

You might have noticed some changes to our marketing site recently. Over the last two months we have been transferring our existing site from being custom coded to using Webflow, and in this post we want to tell you a bit more about why we did this, how it fits in with balena’s culture and our approach to marketing.
Marketing website launch header

Why did we want a new website?

We soft launched our new website last week with very few changes for the end user besides a new home page. Our previous site was custom built with Gatsby using React in Javascript, and required engineering attention to maintain it. To be able to move fast and stay up to date, we wanted to transition the site to a no-code website builder that could be used by our entire team regardless of their technical abilities, and increase the speed of the editing process in the future.

Why Webflow?

What made Webflow stand out was its extensibility to add custom code which is key for us to continue offering OS, Engine, and Etcher downloads directly from the marketing site. We also loved the design flexibility; Webflow mimics how you might build a html site, which we find is a good compromise between no-code and control over custom elements that allow our website to be unique

What’s happened so far and why?

Over the last two months, balenistas from around the company have lent their expertise to get the new site up and running. These are the projects major milestones:

Learning how to use Webflow

Learning Webflow as a non-engineer was a steep learning curve! Most of the pages were built and will be built in the future, by non-technical balenistas, so it was important that we fully understood how the site worked, how to edit it, and how to teach others to use it. Getting to this point was a major achievement.

Building a new home page

Undergoing a recent refocus and restructure of the company, we wanted to put a greater emphasis on balenaCloud as the highlight on our website, the first step to doing this was a brand new home page. We worked together with the customer success team, who are well practiced at explaining the value of balena to our customers. They have some of the best insights into what our customers are looking for, and how to communicate the value of our extensive range of products. We modeled the flow of the home page on the ‘first meeting’ slide deck that our CS team uses when they first introduce themselves to a potential customer, and updated the styling to reflect the direction we want to take our brand in.

Transfering the rest of the site

Although our site is small, the challenge of moving our entirely custom coded original site to Webflow was complex. We had to strip that back each page to make them easier to edit using standard elements that would later be used across the site. This would give us room to develop the brand and styling further, as well as a chance to review existing content and add new elements in the future.
A website’s navigation can be the difference between understanding a product or being overwhelmed by it. We stripped back what was previously in our navbar, added more concise information about our products and made sure we weren’t duplicating links in the navbar and footer.

Reviewing our SEO Titles and Meta Descriptions

At balena, historically our approach has been to focus on developer education and product-led marketing, with less focus on more conventional marketing strategies such as SEO optimisation. However, putting some additional attention into SEO can help our users find the information they are looking for more easily and improve discoverability. We have started implementing our new SEO strategy by reviewing and updating our webpage titles and meta descriptions.

Transferring product documentation to their individual repos and building them using Docusaurus

Our docs also lived in the website repo in GitHub, which created friction in maintaining them. All docs now live in their product’s repos and have been built using Docusaurus, a documentation focused, markdown-powered site builder. This makes them easy to edit and maintain by both the engineers who directly work on them and external contributors.

What's next for the website?

Creating a roadmap

Moving to Webflow and making our website easier to edit was a critical first step. Although the site no longer lives on GitHub, as our team is actively using it daily, we are continuing to use the repo as our project board and as a place where the team can open issues/tickets relating to the new website.

Editing Content

We have started reviewing the existing page contents to better provide anyone with a full understanding of balena’s wide products. We are continuing to develop content for the site by working with the people on the team with the greatest understanding of each area; the customer success team for our customer page, the Etcher team for the etcher landing page etc.

Our SEO Strategy

With a renewed focus on helping new users discover balena through organic search, the next step we will be taking is creating vertical focused pages. These pages help potential users learn how balena fits into their tech stack using examples and case studies from their industry.

Growing our brand

Finally, we are working to refine our brand to reflect the maturity of our product and our core values as a company. The new home page is the start of this change with darker tones, product images and language that speaks more directly to the growing number of Fleet Owners that are using our platform every day.

How does this tie into our marketing strategy?

Since balena was founded in 2013, we have focused on product-led growth and developer marketing strategies. Product-led growth aims to deliver the best possible product, developing it according to customer feedback. This is still at the core of our marketing strategy and the site will facilitate this by being a central avenue to find our forums, support channels and upcoming public roadmap, all avenues for feedback.
It is also a key resource for developer education; developers can learn about balena, the capabilities of balenaCloud and how all of our products work together and support each other on the site. By enabling our users to leverage the full capabilities of the platform we can generate more insightful feedback to develop our product.

Watch this space!

We are already working on developing existing pages and building new pages. I hope that next time you visit balena.io you might notice something new that helps you learn more about who we are as a company and what we do.
by Lizzie EptonMarketing Manager at balena