How to get started with Headless Content Management and Structured Content

If you own a website, want to have one built, or are in charge of online marketing strategies, you would definitely come across the matter of choosing the right content management system.

There are now so many options out there and while traditional content management options are still prominent, headless content management systems are also gaining a lot of momentum.

Since content creation and the way to best manage content are becoming increasingly crucial in today's business landscape, it is a matter of course to choose the best way to manage the content of any website.

We highly recommend going the headless content management system route. Why? Simply because this allows content editors to structure the content for multiple pages and web apps for multiple channels without being overly complicated.

To delve deeper into the reasons why a headless content management system is a great choice, let us first understand the structured content structure.

What is Structured Content?

Structured content is content that is organized and designed to be reusable and flexible for a variety of different web development end projects (e.g. web apps, microsites, and landing pages).

This requires content to be modeled in a modular way which allows teams to create a central content repository where content is treated as data and can be called upon in a variety of different circumstances.

The goal of structured content is to create cleaner content, both from an external and internal perspective.

From an internal perspective, workflows will be rid of having to change similar content across platforms and pages while trying to optimize content. Content duplication will also be avoided.

Structured web content is well organized and bite-sized making it discoverable, searchable, and reusable. This will save both the developers and the content teams time.

Developers are able to spend more time at the beginning of the project creating a flexible dataset or set of content models that can be used for a plethora of different projects whether for desktops or mobile devices.

Content that has repeatable, reusable elements that can be grouped together will form the content model or the backbone of the structured content.

As opposed to unstructured content, properly structured digital content not only helps the backend part of content management, it also helps in boosting the overall user experiences of a website and makes it easier for business owners and marketers to manage content in a way that will drive sales and profit.

What’s different about headless content management?

Let’s cover a few characteristics of headless content management that you’ll care about as a writer, especially for those who aren’t familiar with the approach.

Unlike most traditional CMS options, headless content management systems don’t decide how content is displayed. There’s no one way to present the content. How the content is displayed to customers will depend on the destination where it appears.

In other words, the content data is treated separately from the front-end or the presentation layer of the website. This is also the reason why, sometimes, headless CMS is called decoupled CMS. No matter what changes are done to the content behind the scene and no matter how they are rearranged, the presentation layer will not be affected much, thus cutting down a lot of work for everyone.

In fact, the same content might be displayed in several different ways—all at once! Headless CMS allows content published to many different platforms: multiple websites, apps, kiosks, wherever you want. Designers have lots of options about how to present the content when using headless CMS.

It supports enormous creative freedom and the ability to provide the most up-to-date experiences without requiring any modification to the content. That’s possible because the content is independent of its presentation.

Because writers aren’t distracted by how to manage content and how it is styled or rendered, they can focus on the content itself. In a headless CMS, the content is structured according to its meaning and purpose.

Among countless headless CMS benefits are the fact that bigger content themes and topics are broken into chunks that get used in multiple ways. Writers create chunks of content that can be assembled and presented together as larger items. The structuring of all the chunks of content is handled by what’s called a content model within the headless CMS.

How these content chunks are directed to where they will appear happens through something called an API. APIs connect the various user interfaces where people access content (websites, smartphone apps, chatbots, or wherever) with the content model that manages the chunks. Headless CMS enables the content that’s seen by users to match what they need. Again, it’s a big win for the customer.

Headless CMS options are gaining adoption because they deliver content in a more flexible way compared to traditional CMS or outdated static site generators. Many vendors are now offering headless CMS products, including a few who are surfing the wave of popularity with products that don’t really work the way a headless CMS is intended.

So, if you are curious about what makes a headless CMS distinctive, keep in mind these three characteristics:

• It only deals with the content—it doesn’t force you to render the content into a presentational styling, layout, or format.
• It allows you to structure the content into chunks that are managed by a content model. Say goodbye to messy unstructured content.
• The chunks are free to move around to where they are needed on the front end via an API. This somehow helps to future-proof your website.

Leverage the full benefits from structuring content

Structuring content gives it greater clarity, precision, and flexibility. It makes the content better—for both content creators and content users. Here are the main benefits of structuring content—if it is done right:

• It helps writers and editors focus on the purpose and meaning of different chunks.
• You can track how different chunks perform.
• It can be faster to create or revise a chunk once and use it in many places, rather than duplicate it.
• You can reuse chunks in different ways, making the content more versatile.
• Customers can get the precise chunk they need where they need it.
• Developers find accessing chunks via an API easier than accessing big blobs of content.
• The designs that customers view and use are more interesting and enjoyable because the content is structured rather than formatted in advance.

Applications of Structured Content

Removing the page-builder mentality

Adapting content to structured content in many cases requires a shift in the mentality from presentation centric structure to a modular approach. When WordPress democratized building websites to the everyman, it instilled within content editors the idea of thinking about content in terms of how it will look when it is presented on a website. In today’s digital age, users expect content to be available across platforms and to have a consistent experience whether they are consuming content on a website, mobile application, or from a voice assistant. Implementing content modeling based on structured content makes this possible without creating repetitive extra work for the project teams. Teams are able to create a modern, omnichannel presence that works for the frontends which are en vogue today but also those that rise to prominence in the future.

Creating an omnichannel-ready tech stack

Even if your team has no immediate plans to build an omnichannel presence, using structured content gives teams the opportunity to leave their options open for future endeavors. Here is how an omnichannel tech stack will look in an ideal setup.

At the core, there will be a content hub, typically powered by an API-first, headless CMS, like Sanity, which will treat the content like data. These content models hold the structured content and organize the content into models that contain the most relevant information to that model but do not rely on the context in which this information will be viewed. For example, when building a case study landing page, the models will include a landing page model which will be more contextual and page-based. But, information like the customer name, customer quotes, and specific value propositions will have their own models as well. When the rest of the project is being built out, information like quotes and customers can be used throughout the project while being stored in one place. In other words, make it once, use it everywhere.

Content for the content hub should be treated as data as it will be sent via JSON and in the case of Sanity will be accessed programmatically through the GraphQL API. The structured content management system can populate models with data in two ways. Manually where the content team will create new content or add in existing content by hand into the CMS, which usually works well for new projects or small projects. Alternatively, the data can be retrieved by connecting an existing system via an API to the CMS which will programmatically add content that corresponds to content models to the system. Content that is shared across several frontends can be stored in a modular, structured way and styled in the front ends according to the requirements. This is also true for images and other media types which can be optimized based on the frontend it is rendered on. Creating a core of structured content that can be adapted to fit the use case de jour will make it easier to get new projects off the ground as well as quickly make changes to existing projects.

Most heard objections to implementing a headless content management platform and structured data

Compared to a monolith CMS, headless implementations are technically complex

A headless CMS of any nature is a content repository, nothing more and nothing else.

So for starters, a headless CMS needs a custom content model, also known as schema. The set-up of the content model will be based on the business content model used and will be custom-made for each enterprise or organization. Putting together a custom content model for an enterprise or organization requires some in-depth knowledge of the Headless CMS product. The basis is more or less the same for each Headless CMS, but to fully understand and utilize the features and functionalities, specific expertise is advisable for a specific Headless CMS.

• Headless implementations require a high level of digital maturity
• Beyond Headless CMS, you will need to acquire or outsource digital skills that may not be readily available in the company. Knowledge of one of the more popular front-end development platforms is essential to render your content to a website, web application, native mobile application, or any other digital assets. Whether it is React, Vue or Svelte, specific know-how is required.
• Microservices like web forms, payment forms or notifications will need to be fired up to make your application truly interactive.
• APIs need to be developed, maintained, secured and hosted. This is an expertise that is lacking in many enterprises and organizations.
• A workflow needs to be fired up to make sure that content changes are published on the fly.
• The tech stack needs to be hosted on a Content Delivery Network (CDN)
• New monitoring tools are needed
• Multiple software vendors, and multiple User interfaces can create a lot of friction within our user community

Compared to a software platform that so-called does everything for everybody no matter what the requirements are, headless implementations are indeed quite different. And it does require a bit of knowledge to put the pieces together. But almost all of the software pieces are open-sourced or have an open-source philosophy. So gluing it together requires knowledge and experience with headless platforms, it does not require multiple rocket scientists to put it together.

• Multiple software platforms require managing multiple User Interface
• At face value, this is a valid objection. Where it is not that all data coming from these multiple platforms are accessible through an API, and can be accessed through a datahub and be put into a single User Interface.
  
  

How can WebriQ help you in overcoming the headless content management entry barriers?

• No need to deal with multiple vendors. WebriQ Studio is the basis of your headless content management platform and serves as User Interface for your entire application. WebriQ Studio has a pre-built content model or schema based on over 20 different components with every 4 standard variants. All components can be designed according to company design guidelines.
• Pagination is at the core of WebriQ Studio. It enables you to put various components together and build them into a page with a distinct URL. The lack of pagination in a headless implementation basically reduces the ability of content managers or digital marketers to publish web pages at will without any need to change the presentation layer.
• WebriQ has full expertise when it comes to microservices and API implementations that will enhance your headless application – web forms, payment forms, and webhooks are standard in WebriQ Studio and work out of the box. We can implement any microservice or implement an API that your business or application would require.
• WebriQ Studio is a complete SaaS product and comes with an entire workflow for creating, updating, and managing structured content.
• Although WebriQ Studio is a SaaS product and can be operated stand-alone and in DIY mode, there is an SLA behind the product. An SLA not only secures you access to our Helpdesk but also secures you with an uptime of 99.99% and unlimited access to the service.

Get you started in the Headless world with WebriQ Studio

WebriQ Studio is built on headless CMS principles, but also around the MACH philosophy.

What is MACH?

M: Individual pieces of business functionality that are independently developed, deployed, and managed.

A: All functionality is exposed through an API.

C: SaaS that leverages the cloud, beyond storage and hosting, including elastic scaling and automatically updating.

H: Front-end presentation is decoupled from back-end logic and channel, programming language, and is framework agnostic

Architecture

MACH technologies support a composable enterprise in which every component is pluggable, scalable, replaceable, and can be continuously improved through agile development to meet evolving business requirements.

WebriQ Studio has four major components:

• Sanity and Sanity Studio for the headless CMS
• Nextjs as the production framework
• Serverless forms and payment forms through AWS
• Netlify for the entire publishing workflow and Edge functionality

The content schema is prebuilt and serves as the core of the publishing tool and as the only UI that users need to learn and understand.

For each page you build, you can choose from 20 different components and each component has 5 different variables.

Examples of pre-configured components are Navigation, Header, Footer, Text, Call to action, Testimonial, Portfolio, FAQs, Blog, and more.

Each page with a distinct URL can be populated with one or multiple components. All components can be reused on other pages and all components that are uniquely tagged are updated throughout all pages when content updates are done to that component. All components can be uniquely designed and branded through a Windtail CSS library.

All pages can be previewed before publishing.

SEO settings can be done on all pages separately and there is an SEO preview functionality embedded.

Last but not least, we provide the possibility to publish your WebriQ Studio to any TLD or subdomain of choice and all WebriQ Studios are de facto integrated with WebriQ analytics.

Pricing of WebriQ Studio

WebriQ adopts value-based pricing throughout its entire service portfolio, including WebriQ Studio.

Each customer will receive an unlimited service, for an all-in fixed monthly recurring fee. We use a unit-based approach to make creating unique and customized service packages as easy as possible. Each unit is valued at $1,000. Units can be broken into ½ units, ¼ units or ⅛ units.

We come to value-based pricing by analyzing and quantifying any or all of the following criteria

• Expected usage of the product
• Branding and design of all components
• Additional Data modeling needed
• Data migration complexity
• The complexity of additional features requested
• Further API integrations needed