Welcome to Optimize

What is Webflow Optimize?

Webflow Optimize is an AI-powered personalization and A/B testing tool built into the Webflow interface. With it, you can:

• Test variations and combinations of variations of elements on a page simultaneously
• Specify the amount of traffic to direct to each variation
• Specify the audiences who should be shown each variation
• Let AI-optimize use machine learning to select which variations to show to which visitors, based on visitor engagement data
• Automatically gather performance data for each variation, including how specific audiences respond to certain variations
• Identify and implement the “winning” variation

These features free you and your team up to work on the fun part – coming up with creative ideas and building variations, which you can do right within your Webflow site!

Now that you know a bit about Webflow Optimize, let's back up and talk about what you're trying to accomplish.

What is website optimization?

There are many factors that influence your website’s design — such as your brand, your design aesthetic, or the product or service you’re offering. Even with these unique elements, most sites share a common goal: to drive results, whether it’s getting users to sign up, attend an event, talk to sales, or achieve other business objectives.

So how do you make sure your site is achieving your goals and how do your design choices influence visitors’ actions on your site? For example, will tweaking the size, color, or copy text of a call-to-action (CTA) button drive more visitors to click it? Those are the types of questions website optimization seeks to answer, and likely, why you’re here!

Website optimization is the act of regularly testing and refining elements of your website’s design, user experience, and functionality in order to improve the site’s performance or increase visitor engagement.

What is conversion rate optimization?

Conversion rate is a metric that describes how often visitors or prospects achieve one of your key business objectives, for example, converting to a paid account. Your website can play a large role in your conversion efforts by hosting marketing campaigns, personalized offers, incentives, and similar.

Therefore, Conversion Rate Optimization (CRO) is the overall process of making improvements to your site in order to increase the number of visitors who take actions aligned to your business goals on your website.

CRO typically happens in cycles like this:

• Ideate and launch site variations.
• Gather performance data based on visitor engagement.
• Implement the "winning" (most successful) variation.
• Make iterative improvements to start the cycle all over again.

Develop an optimization strategy

Developing your optimization strategy is key. It’s tempting to jump right in and start creating variations, but before you do, it’s important to have a clear purpose and plan. If you’re new to CRO strategy, consider this simple, three-step approach to get started:

• Identify a problem.
• Form a hypothesis.
• Brainstorm ideas.

1. Identify a problem

Look for problems that could be solvable through changes to your website.

• Identify conversion blockers (areas of opportunity). For example, have you provided enough information about what you offer? Is your homepage distracting visitors with too many elements? Is your product return policy difficult to find?
• Identify pages with high traffic and higher bounce (exit) rates. These are great targets for your first experiments since they may represent missed opportunities and will yield faster results for your optimization experiments.
• Review the data you already have. Look for trends in marketing surveys, chat logs, customer feedback from customer service or sales, analytics data, and heatmaps.

2. Form a hypothesis

Once you have one or more problem statements, develop an if—then—because hypothesis. For example:

3. Brainstorm ideas

Determine which changes to website design, copy, or user experience could help prove your hypothesis (and lead to greater conversions).

For example, here are some ideas related to the hypothesis above:

• Create a new “Easy returns” text banner at the top of the page
• Change existing CTA copy from “buy now,” to “try for free”
• Make the existing Return policy navigation button brighter in color

There is a lot more you can learn about optimization strategy; explore the resource collection linked below for more.

Optimization options

Understand and use Testing and Personalization optimization options

There are a couple of different ways you can use Webflow Optimize — Testing and Personalization — both of which you can do manually or enhance with AI-optimization. Let’s take a closer look at when you might use each.

Testing

Testing allows you to compare different versions of page elements (e.g., buttons, headers, copy, etc.) to see what performs best. This is essentially an A/B testing method.

E.g., Determine which heading copy leads to more conversions.

With Testing, you specify what percent of visitors see each variation. For example, show 65% of visitors variation A, and 35% of visitors variation B.

When to use Testing:

• When you want to test which of two or more variations results in more conversions
• When you want to test a smaller number of variations (often just two) for a more direct, side-by-side comparison
• When you do not want to specify an audience or visitor segment (e.g., traffic source or demographic) for each variation; instead, you want to distribute traffic at random, by percentage or with AI

Traditional or AI-optimized?

In a Traditional test, you manually set the visitor traffic splits for each variation (e.g., 50/50, 75/25). The goal is to directly compare how different versions perform and ultimately identify a single winning variation that will be shown to all future visitors.

With an AI-optimized test, AI continuously analyzes the data and adjusts how traffic is distributed in real time. Instead of selecting a single winner, the AI dynamically allocates more traffic to the variation that maximizes conversions for different visitor segments.

How your visitors experience Testing:

Once variations are created and launched, all site visitors will land on one of your variations, either randomly based on your chosen traffic split percentages (if Traditional) or as determined by AI (if AI-optimized). Once the test is complete, you can implement a winning version to show to all visitors.

Personalization

Personalization allows you to specify which audiences, or visitor segments, should receive which variations, allowing you to tailor the site experience for those who meet your set criteria.

E.g., Present Version A to those who access my site via organic search and Version B to those who access it via direct navigation.

With Personalization, you first create audiences for the visitor groups you’d like to create variations for or want to learn more about through the testing process. For example, you might create two audiences based on their location, such as North and South America.

Enterprise customers can connect to tech stack tools like HubSpot, Marketo, Salesforce, 6sense, Demandbase, etc.

With these integrations, they can also build audiences based on company, contact, lead and deal info, and more, enabling advanced targeting and leading to more granular audience reporting information.

Learn more about Optimize integrations.

When to use Personalization:

• When you have data to support your assumptions and want to implement rules-based variations; e.g., you assume mobile visitors prefer a shorter heading for legibility on smaller screens
• For a consistent customer experience; e.g., users who see a certain promo in their email will see the same promo when they visit your site
• To customize entire pages for specific audiences; e.g., visitors brought in from a certain campaign will see variations aligned to that campaign.
• Or, for Enterprise plans when industry data is available, to customize entire pages based on firmographic data; e.g., visitors from a certain industry will see a homepage with messaging and CTAs that are most relevant to them.

Manual or AI-optimized?

With Manual personalization, you create your own variations and define specific audiences (visitor segments) to control who sees what content.

With AI-optimized personalization, you create the variations and AI can automatically detect how visitors are different and bucket them into audiences. Then, AI-optimize automatically matches each visitor to the best variation for them, adapting as visitor behavior changes to maximize conversions.

How your visitors experience Personalization:

Once audiences and variations are created, visitors will land on whichever variation was designated for their visitor segment based on available data–e.g., mobile users will see variation B. If AI-optimized, AI will use machine learning to automatically bucket visitors into audiences and match them with the variation that is best for them.

AI-optimization

AI-optimization is an option you have to enhance Testing and Personalization. AI-optimize automatically displays and rapidly tests multiple variations and combinations of variations. This gives you the added confidence that you did not choose the wrong audience to show your variations or run an unsuccessful variation for too long.

AI-optimize uses machine learning to show the right page variations to each visitor at the right time based on how visitors engage with your site – linger on pages, click certain elements, etc. It continues to improve based on these interactions and the demographic and historic data available about them.

When to use AI-optimization:

• When you want to test multiple ideas quickly without managing rules manually
• When you want to test combinations of variations, e.g., five headers, five hero images, and five CTAs, all at the same time
• When you’re targeting users with diverse needs; e.g., one user may search for “dry skin” solutions, while another searches for “moisturizer,” but both are seeking the same product
• When you want to reduce the risk of bad ideas by automatically starving underperforming variations of traffic

How your visitors experience AI-optimization:

AI Optimize eliminates the need to choose a traffic split or identify audiences. Instead, AI-optimized Tests and Personalizations direct visitor traffic to the variation most likely to convert each individual based on available data. The result is a more personalized experience for each of your visitors.

Using Webflow Optimize

Tour the optimization process from building your variations to collecting performance data.

Accessing Webflow Optimize

Once you’ve added Webflow Optimize to your site plan, you’ll see an Optimize submenu within the Insights tab of your site. Start here to create optimizations and, once launched, drill into any of them to view results.

Process overview

The Webflow Optimize process involves creating optimizations and variations of those optimizations targeted at specific audiences. Your optimizations are aligned with goals and those goals are used as a basis for measuring your results.

Let’s break down the steps you take to get there:

• Build optimizations and variations - these might represent different site copy, design, functionality, or a combination of these
• Align with goals - goals represent actions taken by visitors, such as clicking a button or submitting a form
• Preview and quality-check your setup - take a moment to ensure you and your team are happy with the variations
• Launch your optimizations - launch all your optimizations, simultaneously, directly within the Webflow Designer
• Analyze results and continuously improve - view a dashboard of results in line with your goals and continuously improve site performance with each optimization

This creates a continuous cycle of testing, learning, and iterating to improve engagement and conversion rates.

Let’s explore each of these steps in detail.

Step 1: Build optimizations and variations

To start, identify where you want to optimize on your website. These might be the most frequently visited areas of your site, areas where you are offering promotions, or other visitor engagement opportunities. Within your target area, set up variations.

For example, you might set up an optimization called “New customer offer.” Within that optimization, you would select Testing or Personalization, then create variations exploring CTA button language:

• Urgent variation: "Try now"
• Cost-free variation: "Try for free"
• Gentler variation: "Get started"
• Ready-to-buy variation: "Talk to sales"

Creating variations takes place in Webflow. You can follow your typical workflow to create variations. For example, add and style new elements such as headings and CTAs just as you would on the base site. Changes to elements will only apply to the variation you’re working in and won’t impact the base site.

How does it look for personalization?

If you choose manual Personalization, you will also create audiences and match them with your variations. For example, you could match the CTA buttons above with audiences like this:

• Urgent variation → Frequent visitors (visitors who have visited your site at least 4 times)
• Cost-free variation → Targeted visitors (visitors who found your site via one of your campaigns)
• Gentler variation → Browsing visitors (visitors who found your site via organic search)
• Ready-to-buy variation → Interested visitors (visitors who have viewed your product page)

Step 2: Stay on track with goals

Goals let you track and measure conversions. A conversion is counted when a visitor takes the action your optimization's primary goal is tracking. For example, if the goal is tracking clicks for a Subscribe button, a conversion is counted each time a visitor clicks Subscribe.

Goals act like a benchmark that lets you analyze the results of your tests, measure success, and optimize your website to drive more conversions.

Types of goals

• AutoGoal - To start, Webflow Optimize will automatically generate an AutoGoal that tracks actions visitors take on a page after seeing a variation, such as clicking a targeted button, rather than navigating away.
• Form submission goals (via integration) - Enterprise account plans can integrate with tools such as Marketo or HubSpot to create custom goals around form submissions.

If your optimization only has one goal, it's automatically set as the Primary goal. If your optimization has more than one goal (e.g., you're an Enterprise plan holder with a custom goal created via integration), you can set which goal is used as the primary goal for that optimization.

Step 3: Preview & QA your setup

Before launching, it’s crucial to preview and quality-check your optimizations. Make sure all variations display correctly across all breakpoints such as desktop, tablet, and mobile. Testing in this stage ensures a smooth launch.

You can preview any variation by first selecting the variation in the Optimize menu at the top of the browser, then clicking Preview.

You can publish each optimization to your staging environment before publishing to your production environment.

Step 4: Launch your optimizations

Once everything’s ready, with just a couple of clicks, you can launch all variations created for your optimization. In order to launch, you will need to publish your site.

Step 5: Analyze results and continuously improve

The final step is to monitor how each variation performs. Use Webflow’s detailed reporting and audience insights to visualize how different types of visitors engage with your site.

After the results are in, you can take the learnings from those manual Tests or Personalizations to try new variations or audiences. And for AI Optimizations, you can disable poorly performing variations and add additional variations to optimize further. This ongoing cycle ensures your site performance continuously improves and your visitors’ experiences become increasingly personalized.

The user experience

From here, your variations will start running and visitors will see one variation (when Testing) or the variation designated for their audience segment (when Personalized).

When AI-optimized, the visitor will be shown variations with the highest probability for conversion. As visitors engage with your website, Webflow Optimize gathers and reports data. In this process, AI-optimize learns which variations are most effective for which audiences and continues to improve – boosting your conversion rate in the process.

For example, an AI-optimized test would look like this:

• Visitor comes to your website
• AI Optimize parses known visitor data
• Visitor is shown variation with the highest conversion probability
• Visitor engages with website
• AI Optimize tracks, reports, and grows more intelligent

Resources and tools

Explore essential resources to kickstart your Optimize experience.

Ready to start optimizing?

Consider prioritizing these two steps first:

• Establish a clear CRO strategy and roadmap. This will guide your optimization efforts and help you stay focused on your conversion goals.
• Decide what to optimize. Webflow Optimize allows you to run multiple tests simultaneously, so you can experiment with various elements and quickly identify what resonates with your visitors.

Additional resources to take your optimizations to the next level:

• Optimize goals overview
• Optimize integrations (Enterprise)
• Create or edit a rules-based audience (including Enhanced match for Enterprise)
• Marketer’s guide to personalization
• Other help articles

Start testing, personalizing, and optimizing to see how Webflow Optimize can boost your site’s performance.

Test ideas, make improvements, and watch your conversions grow!