preston.so

Decoupled Drupal in Practice: The comprehensive guide to decoupled Drupal across the stack.

Axes of preview beyond the static web: Fidelity, quality, and governance

February 14, 2020

Preview. It’s a word that strikes fear into business stakeholders, content marketers, compliance officers, and CMS developers alike. As the number of delivery channels continues to grow, questions surrounding the optimal future of content preview are becoming increasingly urgent. At the same time, the demands that content editors have of their ability to manipulate complex content workspaces and other arbitrarily defined sets of content are growing apace.

Content preview has long been table stakes in CMSs, and there has been some unification around a bare minimum set of requirements for the preview of embargoed, scheduled, or unpublished content, but due to the emergence of the distributed CMS, the shift in the separation of concerns in content management, the second CMS war, and the growing bifurcation in the market, it is now a matter of urgency for industry upstarts and veterans alike to stake their claim.

In response to my recent article about applying Maslow’s hierarchy of needs to CMS needs in an increasingly omnichannel landscape, Knut Melvær of Sanity made a comment that cited some of the exciting proofs of concept Sanity has demonstrated and piqued my renewed interest in preview beyond its current purview:

“In addition to split-panes, I think also other ‘current’ views (think Notion/Airtable) is [sic] an interesting avenue of exploration, which can give you a sense of content in time, place, responsibility, etc.”

Over the course of the storied history of the CMS, we have only considered preview along the dimension delineated by a single consumer: the website. Now, there are multiple axes of preview beyond the static web that we must consider. How can content editors preview their content in mobile applications, voice interfaces, digital signage, and other environments? What fidelity do they need? And what other dimensions of preview are important to content editors today?

In this article, I inspect some of the challenges surrounding fidelity beyond the static web and what an ideal experience should look like for content editors who need to contend with a vast array of digital experiences as they preview their content before it goes live. In the process, I want to define several new axes of preview that we need to consider as CMS practitioners and begin to draw a line in the sand about the future baseline experience for preview that content editors may come to expect.

Fidelity beyond the static web

Preview fidelity is a term that has long been omnipresent in CMS workflows, but it is for the first time being applied to a wide range of possible channels, particularly as the channel explosion continues to reinvent content delivery for organizations around the world. High-fidelity previews generally traffic in emulators, which endeavor to provide as precise and immersive an experience as possible for content editors.

Meanwhile, low-fidelity previews, which can run the gamut from approximations that employ separate rendering systems to structured content previews that focus first and foremost on how the data in question is structured rather than how it is presented, are often necessary. In a headless CMS context, viewing an edit form or a view page displaying the structured content in its default format can often be sufficient for a baseline low-fidelity preview.

Note also that I am referring here to preview fidelity beyond the static web. The vast majority of preview systems can rely on existing browser technology and embedded frames to display HTML rendered by hand or by static site generators. But when it comes to preview fidelity for the dynamic web, which generally requires a significantly different rendering approach, still other channels notwithstanding, preview fidelity becomes more difficult. As soon as the notion of JavaScript is introduced, a CMS that does not internally render JavaScript by default for its administrative interface will need to confront infrastructural challenges.

High-fidelity preview: Emulators are expensive

In the early days of quality assurance on the web, during the promulgation of web standards, many developers previewed their markup and styles by viewing it in a variety of browsers, including Firefox, Netscape, Opera, and Internet Explorer, all with the goal of ascertaining subtle differences and nuances between the rendering approaches of each browser. This process became formalized thanks to the advent of services like Browsershots, which would harness a variety of screenshots from emulated browsers into a single page. Today, headless Chrome and other automated browsing techniques offer the same insight into where visual regressions or other aesthetic issues have arisen.

Many enterprise organizations, for compliance reasons, require as high-fidelity a preview as possible. For instance, in the pharmaceutical industry, where the presence of essential consumer information above the fold is of paramount importance, the lack of a fully accurate preview — and, in many cases, of a snapshot history that tracks the state of a page at a given time or a time machine like Drupal’s Site Preview System — can spell disaster for drug makers hoping to avoid costly litigation. With the growth of the mobile web as well as native mobile applications, however, the question of preview becomes ever more complicated.

Emulators are a common approach for content editors to preview content trapped within the confines of a native mobile application such as those written in Swift or Java for iOS and Android, respectively. For companies with onerous compliance requirements, mobile emulators can offer a pixel-perfect preview that allows editors to rest assured that their preview is accurate. Nonetheless, emulators are pricey to maintain and challenging to host, especially when we consider emulators beyond mobile devices.

The predominant issue with emulators is simply that there are far too many channels to implement emulators for. Consider, for instance, that emulators for wildly disparate technical ecosystems would need to be created in the case of high-fidelity preview across every conceivable content delivery channel, whether a set-top box such as Roku, an augmented reality overlay (cf. Layar), or, worse yet, a digital sign hundreds of feet above the ground.

Low-fidelity preview: Approximations are inaccurate

On the other extreme of the spectrum lie low-fidelity preview experiences provided through approximations of unpublished content preview, which themselves can range between direct renderings of structured content in their native data structures (particularly useful for developers building consumers of headless CMSs like decoupled Drupal) and “pretend” or “mock” renderings that aim to approximate a mobile environment or other presentation layer. In some enterprise organizations I’ve met with over the past year, savvy compliance departments will often be satisfied with inspecting how the unpublished content appears in the form of JSON or XML rather than a full-fledged emulated preview.

Nonetheless, these approximations present their own issues, and compliance teams can rightfully express dismay at the fungibility represented by the possible range in the quality of these approximations across a variety of channels. A content reviewer taking advantage of a high-fidelity preview for a website will expect the same experience when examining the identical content in a native mobile application, but the only way for them to do so fully immersively is to download an APK or other application file to their device and install it.

One of the key issues with high-fidelity preview, as we saw in the previous section, is that it is simply too costly for most enterprise organizations. A balancing act is thus necessary between compliance or content review functions and their editorial counterparts. In other words, low fidelity is absolutely necessary for some scenarios, and I believe that most enterprise organizations are now realizing this fact (with the exception of particularly retrenched compliance departments).

In short, there is no way to avoid a mix of high- and low-fidelity previews depending on requirements of discrete channels, and in the case of API-enabled monolithic CMSs like decoupled Drupal, according to the relative proximity of rendering to the CMS’s own native rendering layer.

Other axes of preview beyond the static web

There are other issues of compliance and content governance that bear mentioning here. Fidelity aside, if we envisage the notion of preview as something beyond a concern relegated to compliance or content review, and rather as a crucial element of delineating the spectrum of both end user experience quality and the channels, we can see how the notion of preview can go well beyond a single editor’s interaction with a CMS and instead stretch into an entire organization’s understanding of their digital experience ecosystem.

Sanity calls previews empathy portals, and I found this description to be especially apt, particularly in an era when organizations are increasingly under pressure from litigation concerning web accessibility and users with disparate needs. The Sanity team implemented previews that not only offer an enticing approximation of how a digital sign would look with certain content but also previews that demonstrate how users with color blindness experience certain images or how screen reader users will process voice-recited text.

Previewing user experience quality, not just fidelity

From an enterprise standpoint, Sanity’s experimentation with accessibility and colorblind previews indicates interest in opening a door to a new bevy of possibilities allowing content editors to assess not only the fidelity of the presentation of their content but also the extent to which differently abled users can have as optimal an experience as possible.

I can see, for instance, this notion being expanded to include key facets of enterprise-grade digital experience management such as personalized content or predictive content as well. How effective is the segmentation configured in the personalization platform? Given a series of criteria, how “warm” is each card in a page layout or series of smartphone cards in terms of its proximity to the user’s desire for that “next best” experience?

Let us then add a new dimension and a novel axis to preview: content quality. But I don’t mean quality in the sense of persnickety proofreading or user-generated five-star reviews; I mean quality in the sense of pinpointing how users of different backgrounds and needs interact with the content in question. Combined with personalized and predictive approaches to content, this can lead to multifaceted previews that enable multivariate testing. Imagine a grid, much like Browsershots, in which discrete notions of a user’s characteristics allows the content editor to have a “global perspective” (as much as I hate to use the comparison, much like Uber’s “god mode”) of the many varied ways in which users will process content. I can already see compliance officers throwing their hands up in abject terror at this prospect.

Differentiating across many channels, not just one

One of the most compelling features of Oracle Content and Experience (OCE) is the fact that it includes native handling of channels, something that is lacking in headless CMSs like Contentful, which focuses solely on providing an API and lets developers loose thereafter, and traditional, monolithic CMSs like Drupal, which requires the installation of a contributed module like Consumers to have a semblance of an understanding of an entire digital ecosystem. In Oracle’s OCE, you can define and name channels arbitrarily, distinguish the content delivered to those channels (and the authentication of access to that content), and therefore enjoy a great deal of control over your entire digital experience ecosystem in a single user interface.

Preview on a single channel on its own is now a ubiquitous requirement, but comparing how content looks across multiple channels in a single view hearkens back to the Browsershots era and is reminiscent of the underpinnings of visual regression testing. Consider, for instance, such a “global perspective” that provides a comprehensive series of both high-fidelity emulations and low-fidelity approximations of unpublished content in a variety of channels, all laid out in a way that allows for rapid-fire assessments of whether a headline needs to ascend above the fold or whether a hero image is truncated far too abruptly.

This brings us to one of the most intractable challenges facing the CMS, whether the headless or the monolithic flavor. Because of their web-only bias and trafficking in their own native presentation layers, CMSs are ill-equipped to think outside their own box, so to speak, to handle the other axes of preview we have just discussed. Whether leveraging emulation or approximation, in order for traditional web content management systems to evolve into full-fledged “digital experience platforms” (Gartner’s DXP), a holistic view of channels must be part and parcel of introspection features available to the content marketer and editor.

Conclusion: What is the ideal experience?

Already a profoundly rich and complex subject in its own right, our current conception of preview is just one of the ways in which we can foster greater empathy for users that experience different outcomes when viewing our content. In the end, preview is not only about the individual experience and its fidelity to the intended result but also the ability to track across a variety of previews and digital experiences, especially as the proliferation of newfangled channels continues to accelerate without any end in sight.

We’ve identified three axes of preview over the course of this foray into preview capabilities: preview fidelity, content quality or amenability, and channel differentiation. The vast majority of content management systems already have user interfaces that are well-positioned to handle all three in a well-reasoned way. Imagine, for example, a grid of thumbnails that can be filtered based on given channels, personalization schemes, and user characteristics such as color blindness. With some manipulation existing designs for interfaces such as content listings on administration pages displaying key fields such as the author, publication status, and others, this could be a first phase towards an omnichannel preview experience.

Nevertheless, I would also value an authentically visual representation of the wide and diverse digital experience ecosystem that is now table stakes for enterprises everywhere. As a content creator, I would want true content zoomability in which I can see entire channels and their information architectures, with distinctions between them necessitated by the exigencies of their environments, as well as the ability to introspect, for governance purposes, each information hierarchy. A user interface that allowed me to drill down into a conjunct of content (such as a landing page or series of smartphone cards or voice interface utterances) from that overarching hierarchy into a split-pane, side-by-side, keystroke-by-keystroke editorial view could be a uniquely compelling experience for content editors who have long had to edit a piece of content in comparative isolation from other elements that influence and impact how that content eventually makes it to the correct destination: not just the end user, but more importantly the end user’s expectations.

By bringing the preview off the page and extending it into the needs of the new digital experience ecosystem, we can finally shake off the concept of previews as limited to static web pages and into something altogether different and unique: an introspection toolkit for not only content workspaces and emulated or approximated presentation layers, but also a figurative zoom button that offers CMS users the end-to-end, top-to-bottom understanding of their entire stack and ecosystem that they still yearn for today.