Skip to main content
Joe Post - POSTJOE - Adage - Strategic Leadership for Digital Experiences that Convert
Joe Post – VP UX – Adage

Congratulations, you’ve decided to plan an Optimizely (Episerver) implementation! You made a great choice, and now it’s time to prepare. Over the past 15 years, I have been helping clients move to new CMS’s. To help get organizations off to a great start, I’ve outlined things to consider before moving, including user experience design, front end, accessibility, add-on considerations, and more for a seamless conversion.

Optimizely implementations differ wildly. Implementation partners are not all equal. When Adage takes on an Optimizely rescue, the most common customer complaint is that the CMS is inflexible. Can your marketing team make a landing page without involving a developer? Is your template and block system component-driven or template-driven?

To prevent your implementation from becoming too rigid and complicated for your CMS team, the developer should consider these suggestions in your Optimizely implementation planning phase.

 

User Experience Design Considerations

Atom Design by Brad Frost popularized systems thinking in UX design

With Adage, you’re getting something a little different. With a large in-house UX team and front-end developers on staff, we optimize designs. The Adage UX team works in a component-based approach. Component design, sometimes called “Atomic Design,” follows systems thinking approaches to creating templates and blocks. The key is that Optimizely is architected to be component-driven with its support for a block library and both 1:1 and 1:n placement of blocks throughout a website. Providing a component system to front-end developers who then implement in a component-driven platform (Optimizely) aligns the design process with the development and implementation strategies.

The key is that everything is designed as reusable and interchangeable Lego blocks. Imagine for a moment a standard set of Lego blocks. One can create a large number of permutations with a relatively small number of unique blocks. The same is true with Optimizely CMS blocks. A typical site can have as few as 3 to 5 templates and 20 to 35 unique component blocks to create incredible user experiences. Of course, a balance of creativity and freedom and brand governance is needed. That said, the most common complaint we hear when we rescue an Optimizely implementation is that the implementation is too rigid. If your implementation partner is recommending a large number of templates, clarify if those templates are controlling functionality (like a calendar or shopping cart) or controlling look and feel. In general, we would recommend a block-based approach to allow for greater flexibility. Be sure to clarify which blocks are expected to work with which templates. Sometimes the complaints about the rigid templates are caused by users’ inability to use every component block in every template.

Instead of older patterns that are more heavily template-driven, the so-called “layer cake” approach, a block-based approach allows for more flexibility to create within the CMS. Older systems required a developer to make any change, which could be expensive and time-consuming. Having less reliance on developers to create projects, landing pages, and unique layouts is liberating for the web or marketing team. It is also more cost-effective.

Optimizely CMS Blocks


Creating templates that are more flexible and accept more types of blocks also relieves some of the rigidness that managers and marketers often see in their CMS. That’s where Adage has found the most significant opportunities exist. Recognizing the balance between flexibility and brand control is essential, but if it comes down to choice, flexibility wins out.

Why a block-based approach in Optimizely is better:

  • Adage uses a logical reasoning approach to design
  • ‘Lego’ style design systems versus a templated approaches like “layer-cake.”
  • The block-based option allows for more flexibility and customization
  • Developers are not required to make changes with a block approach
  • For most marketers, the idea of flexibility and speed is more important than tight brand control

 

Plan for your Optimizely implementation to include page speed considerations on the front-end.

Retaining users is crucial to improving conversions. Slow sites have a negative impact on revenue, and fast sites are shown to increase conversion rates.

From Google


Considering the front-end is also a crucial step in planning your Optimizely implementation. Although the back-end of Optimizely CMS drives enterprise websites, the front-end implementation quality can be highly variable depending on the implementer. The front-end is where considerations like page speed are controlled. Page load times (or site speed) will be instrumental in getting people to visit your site and then stay there to find the information they need or the products/services they want. It’s also going to affect your search engine results page (SERP) ranking. Establish your page speed goals as part of your implementation plan. It is much more cost-effective to build a lightning-fast front-end as part of the initial build. While it is almost always necessary to test and optimize after your site launches, building for page speed from the start is more cost-effective and could save you from disappointing early results. Keep in mind that page speed has a huge impact on conversion rates.

 

Planning for Accessibility

Like page speed, accessibility is much better to build in than add on later. The earlier accessibility is considered, the better the results. Making your Optimizely site more accessible not only improves user experiences overall, it also increases your potential audience. Accessibility is the right thing to do. Plan for it, and build it into your implementation from the start to save time down the road. Accessibility considerations like correct ARIA tags and alt text generally improve your search engine optimization. Of course, in a block-based approach, accessibility considerations are part of each component. In other words, accessibility considerations should be part of the system from the foundation up. Optimizely CMS is built in MVC, so implementing the correct properties in the back-end of Optimizely can be a big part of making a site accessible on the front-end.

 

Optimizely Content Strategy

When thinking about implementing a new site in Optimizely, it is vital to consider how the platform can be utilized by marketing to maximize your content and the ROI of the DXP. Consider your taxonomy, personalization, governance, and publishing requirements. For content strategies like COPE (create once publish everywhere), Optimizely page and block properties need to be configured to support the strategy. For example, if you want to include Twitter and Facebook content snippets, images, meta descriptions, and open graph properties, the best thing is to do this as part of your initial implementation. For example, open graph can be added later, but it’s best to do it up front.

Optimizely Web Content Recommendations (Idio)

If you have purchased the content recommendations engine, be sure to include content strategy deliverables specific to the platform. To fully realize the potential of Idio, you will need solid deliverables in the content strategy area. More specifically, it would help if you had strong audience segmentation and a great understanding of your user journeys. Idio requires both to drive the who, when, and where of content recommendations. The web content recommendations engine is a personalization engine. Real personalization requires strong analytics. While the tool provides the data and the reports, you will need a partner like Adage who can help you leverage that data and turn it into action. Also, consider leveraging Idio as part of your content migration planning and content creation road mapping. Idio reports provide valuable insight into your content and can be implemented into your existing platform (even sites that aren’t Optimizely sites). You can learn from the data while considering what content to create or migrate. For example, learning what content is useful to your audience could inform your content creation planning.

Headless Content Strategy

Optimizely supports several headless and hybrid approaches. We generally consider the choice of the approach based on your audience and content strategy. Again, taking the time up-front to decide on an approach can save you time and money down the line. Your implementation partner should discuss the pros and cons of each approach to find the right balance for your Optimizely website. At Adage, we have implemented Optimizely in a headless approach since 2010. Adage has always considered Optimizely’s relative openness to data flowing in and out of the system to be one of its best differentiators compared to Sitecore, for example. Sitecore is much more of a black box when it comes to where and how data is stored and delivered. We have implemented Optimizely in headless build for content and data to support many features, including kiosks, mobile apps, progressive web apps (PWAs), and digital displays. Considering and planning for headless as part of your Optimizely implementation can open doors to new opportunities later.

Federated Search with Optimizely Search & Navigation

One of the first interactions a user will take for most websites is to hit the search box. Search is increasingly important, and a great search experience is a critical component of a great website in 2021. Most of our clients have many digital platforms surrounding Optimizely. So, a federated search is a key thing to plan for because users expect that your site search pulls in content from all of your digital platforms (LMS, AMS, CMS, Commerce, etc.). Optimizely’s Search & Navigation functionality is included in the DXP and is powerful enough to do the job very well. But all too often, we see half-baked implementations of elastic search and federated search. Plan to include time and budget in your search implementation to meet audience expectations better. Adage’s own federated search accelerator greatly reduces the time and effort to get a great search experience established on your Optimizely site. Adage Search includes many baseline features that users expect, including a faceted search interface, best bets, auto-complete, misspelling suggestions, pagination, error, loading, and partial states, and much more.

Example of Federated Search UI built on Optimizely Search & Navigation
Example of Federated Search UI built on Optimizely Search & Navigation

Optimizely Add-ons for New Optimizely Implementations

Add-ons are only good if they’re providing you with something useful. If you don’t use the add-on, it’s not helping you or your potential visitors. Also, it’s going to be taking up space and slowing down your system. Believe it or not, we have seen other implementers install a full suite of add-ons but never activate them. Many add-ons and plugins provide additional functionality and utility but do so at the expense of code performance. So if you are installing an add-on, be sure that tradeoff provides value. Add-ons that you don’t use means you’re slowing your site down unnecessarily or adding code bloat. Instead, only load what you will use (and remove anything you find isn’t working for you) and configure each add-on to work for your specific situation and website.

Below are some baseline Optimizely site add-ons, plugins, and services that most sites should consider implementing. There are exceptions and deviations to the rule, but in general, these plugins, add-ons, or utilities are useful and provide high value.

Google Tag Manager

Google Tag Manager manages “tags,” otherwise known as JavaScript functionality, like tracking codes, analytics services, and other JS-based 3rd party functions that many sites rely on. Including Google Tag Manager in your implementation plan makes sense because it is much simpler to install as part of the front-end built out than after the site is live. In addition, many sites utilize Google Analytics, for example, to track site metrics. In 9 of 10 cases, Google Tag Manager would be a great way to get the analytics tag in place. Google Tag Manager also allows non-developer resources to manage what scripts are loading on your website. This decreases developers’ reliance and allows site code changes and deployment of updated tags without requiring a full website code deployment. Typically, the tags loaded on your website will impact your page speed as well, and Google Tag Manager allows for a very straightforward configuration of when tags should fire. This alone is worth the implementation.

Google Analytics & Tag Manager should be included in your Optimizely Implementation
Google Analytics & Tag Manager should be included in your Optimizely Implementation

Google Analytics

If you want to track what’s going on with your website, Google Analytics is a great way to go about it. Google Analytics is relatively simple to get started, primarily if you’ve already implemented Google Tag Manager. Also, if you implement it in the dashboard on Optimizely, you can take a look at all of your reports right in your Optimizely account rather than logging into Google Analytics when you want to view them. Google Analytics is ubiquitous on the web today, and generally speaking, it should be installed early and configured before your site goes live to ensure the data is flowing. Your marketing team can track key site metrics from go-live.

AB Testing / Marketing Add-on

The idea of A/B testing is an important one as it allows you to fully evaluate different options to find what works best for your website/company and your clients. You can try out different setup variations, writing, images, or anything else you might want to create your test and see what people prefer. Of course, Optimizely has various tools for multivariate testing. The point here is to ensure your implementation team installs and configures the devices you have purchased with Optimizely as part of your implementation (not after go-live). Getting “Self-optimizing” blocks configured upfront is straightforward and more cost-effective than coming in later to get it set up.

BVN 404 Handler

Everyone will have 404’s eventually, so it’s a good idea to get the add-on early on so you’re ready to go from the start. A 404 error will happen, which will provide you with options for redirects and overall handling. If you’re set up for handling 404’s, you’ll have less of a problem when you need to correct a 404 issue. Again here, the theme is to get a 404 handler or redirection utility set up as part of your implementation and before go-live. 404’s and redirects are inevitable, so establish a way to correct them. The BVN 404 Handler is a solid choice.

Geta Sitemaps

Sitemaps are a critical component of your overall search engine optimization strategy. Google Search Console, for example, can be fed a sitemap that will improve the appearance of your website to Google. Think of a sitemap as an essential tool for SEO and therefore get your Optimizely sitemaps generated and optimized as part of your implementation. We frequently use the Geta Sitemaps addon for Optimizely.

Advanced CMS Reviews

If you want people on your team (or anyone you want) to make comments and review what’s going on with your site, this Advanced CMS is a great add-on. It makes things a lot easier for your publishing teams to make and see comments, but there’s no need to go into the editing function to do it. This allows for input from even more people. Not to mention it’s open-source, and the add-on itself is continuously being improved.

CMS Editor Block Enhancements

The CMS Editor Block Enhancements add-on solves a common pain point for CMS editors. One handy feature is the ability to publish changes to nested blocks. Nested blocks without this add-on require CMS editors to publish at every level of the newest. This add-on helps to save steps in the process.

Episerver CMS Block Enhancements
Plan to include Optimizely Add-ons in your Implementation

 

Optimizely Labs

Optimizely maintains “labs” as a way to evaluate features and utilities that may someday become part of the core platform. That said, many of the lab’s add-ons have become valuable tools for developers and website caretakers. Keep in mind not all labs will be promoted to the core or maintained long term. Labs add-ons should be evaluated for your specific implementation, but great things are happening in labs. With the right use case, a lab’s add-on could be hugely valuable.

Optimizely Add-ons Summary

• Only get the add-ons that you’re going to use
• Make sure to turn on and configure all add-ons
• Set up your add-ons early in the process to get the most out of them
• Consider the specific add-ons above to optimize your website fully

 

Get Involved

Optimizely (Episerver) is looking for customer feedback on product direction and needed updates. Your perspective is appreciated in improving the user experience. Get involved!