Almost EVERYONE who tried headless systems said they saw benefits. Download the state of CMS now!

Storyblok now on AWS Marketplace: Read more

O’Reilly Report: Decoupled Applications and Composable Web Architectures - Download Now

Empower your teams & get a 582% ROI: See Storyblok's CMS in action

Skip to main content

12 CMS Best Practices for eCommerce Stores

Marketing
Gillian Mays

Garbage In, Garbage Out (GIGO), an acronym used in computer science, implies that the quality of what you put in determines the quality of what comes out the other end. This statement holds true for a content management system (CMS). If you want strong content out, you need to change how you create and deliver content with your CMS.

Smart eCommerce businesses implement CMS best practices across five key areas: accessibility, performance, personalization, collaboration, and security, to improve the overall functionality and shopping experience of their online stores.

Section titled 1. Accessibility 1. Accessibility

Accessibility is a core Google Lighthouse performance metric — yet many businesses do not prioritize it. WebAIM’s 2022 Report shows that only just over 3% of the world’s top one million websites offer full accessibility. Full accessibility means that users with different disabilities can seamlessly access and navigate your eCommerce store.

To improve accessibility, your eCommerce store must align with the four core principles of the Web Content Accessibility Guidelines (WCAG) — Perceivable, Operable, Understandable, and Robust.

  1. Perceivable means your website content and interface are fully identifiable through sight, sound, or touch.
  2. Operable means users can easily navigate your website using their hands, voice, or assistive technologies.
  3. Understandable means the website content, interface, and layout are easy for everyone to understand.
  4. Robust means the website can be easily accessed on different devices and technologies.

Section titled Best practices for making your eCommerce store more accessible Best practices for making your eCommerce store more accessible

To improve accessibility, you should:

Section titled Add accessible iFrames for video content Add accessible iFrames for video content

An iFrame is an HTML element used for embedding content from another website into a webpage. For example, you can use iFrames to add a YouTube video to your blog posts, allowing users to watch the video without leaving the page.

To make your iFrames accessible, you need to add alt text attributes to the iFrame in your CMS. Alt text attributes basically tell website visitors what a video is about, even if they can’t see the video. In Storyblok, you can add alt text attributes to iFrames by creating nestable components for rich-text fields. This allows you to include titles and descriptions for embedded videos.

Section titled Control contrast ratio Control contrast ratio

The contrast ratio determines how dark or bright colors appear on your website — especially for visually impaired users. Visually impaired website visitors need strong contrast between foreground and background colors to view website images and read highlighted texts easily.

Your eCommerce store’s color contrast ratio should align with two important Web Content Accessibility Guidelines:

  1. A minimum contrast ratio of at least 4.5:1 for normal text and embedded images with texts
  2. A minimum contrast ratio of 3:1 for large texts and visual elements

Use WebAIM’s contrast checker to test color contrast before UI implementation on your website.

Six differently colored boxes containing text with varying levels of contrast

An example of good and bad contrast options.

You can further improve contrast by using multiple visual elements to convey information — not just colors. This means using other visual cues like arrows, asterisks, and bold and italics font formats to highlight important texts like calls to action.

Section titled Define assets attributes Define assets attributes

Asset attributes like titles, alt tags, and captions provide additional information about media elements on your website. Assistive technologies like screen readers use asset attributes to describe content to users with cognitive disabilities.

You can define asset attributes in your content management system, depending on its configurations. For example, if you use Storyblok, you can add new asset attribute fields in the Visual Editor.

Section titled 2. Performance 2. Performance

Performance factors like page load time and mobile optimization affect the overall shopping experience of your eCommerce store. For example, 2020 Deloitte research shows that 9.1% more shoppers added items to their carts when mobile site speed increased by 0.1 second.

Section titled Best practices for improving your eCommerce store’s performance Best practices for improving your eCommerce store’s performance

To boost your online store’s performance, you should:

Section titled Optimize content and design for mobile Optimize content and design for mobile

More people are switching to mobile as the primary medium for online shopping. According to Klarna’s Mobile Shopping report, 5 in 7 consumers in the U.S have already shopped on their mobile phones as of 2021. And these shoppers expect similar content and design experience as they’ll get on a desktop.

Three simple tips to help you create mobile-optimized content and design:

  1. Use a one-column design layout for your eCommerce store, so mobile shoppers can scroll through its content easily.
  2. Use a headless CMS to deliver the same content to your website and mobile channels.
  3. Reduce the number of content themes and heavy images that can slow down your store’s mobile page load time.

Section titled Add structured data markup schema Add structured data markup schema

Structured data markup schema gives the search engine bots more information about a website. Search engine bots use structured data to index websites correctly for specific keywords, improving the website’s chances of ranking higher on search engine result pages (SERP) for those terms. For example, if you add “shoe collection” to a product page on your eCommerce store, the page will appear in relevant search results — like when someone searches for “buy new shoes.”

You can use Google’s Structured Data Markup Helper to add structured data markup schema to different product pages of your eCommerce store. Other tools like Schema App and Merkle Structured Data Tool are useful for this purpose too.

Section titled Use SEO-friendly URLs Use SEO-friendly URLs

SEO-friendly URLs increase your eCommerce store’s search visibility, making your product pages and content easily findable. SEO-friendly URLs:

  1. Are concise, having about four words
  2. Contain a primary keyword — a relevant search term that you want a web page to rank for in the SERP, for example, “retail stores”
  3. Are written in lower case
  4. Use hyphens to separate the words

In your content management system, you can modify the URL slugs of your eCommerce website pages to better optimize them for search. With Storyblok, for instance, you can create SEO-friendly URLs for content folders using the Advanced Path app.

Section titled 3. Personalization 3. Personalization

Personalization improves customer satisfaction. Satisfied customers are more likely to become repeat buyers and drive word-of-mouth marketing for your eCommerce business.

Section titled Best practices for personalizing your CMS Best practices for personalizing your CMS

More than 3 in 4 shoppers want a more personalized customer experience, according to Netcore’s eCommerce Personalization Benchmark Report 2021. To improve personalization for your eCommerce store, you should:

Section titled Optimize your content for different locations/languages Optimize your content for different locations/languages

Shoppers are more likely to purchase a product if its details are in their native language, according to CSA Research’s 2020 survey. Content localization — that is, optimizing your content for multiple locations and languages — expands your store’s reach, increases its visibility on non-English SERPs, and improves the user experience for non-English speakers because they can navigate your store easily.

Every CMS has a unique process for content localization. For example, in Storyblok, you can implement field level translation or folder level translation] for content localization, depending on your overall content structure.

Section titled Integrate third-party apps like CRM software Integrate third-party apps like CRM software

Third-party apps — like customer relationship management software — help you learn more about your customers so you can better personalize their shopping experiences. For example, you can use customer insights in your CRM, like demographics and purchasing data, to optimize your key messaging for marketing campaigns.

You can integrate third-party apps with your CMS using APIs or plugins, depending on the type of content management system. Read our article to learn more about CMS personalization.

Section titled 4. Collaboration 4. Collaboration

If you have a large eCommerce store, multiple people might be working in your CMS simultaneously — creating new content, updating existing records, or deleting obsolete information. You need to prioritize collaboration, so things run smoothly.

Section titled Best practices for collaboration Best practices for collaboration

To improve collaboration, make the following changes in your CMS:

Section titled Set up permissions and access controls for different users Set up permissions and access controls for different users

Permissions and access controls ensure that only specific users can access important content folders and make updates to content in your CMS. This helps you avoid arbitrary content modifications in your CMS.

In Storyblok, space owners can define roles and permissions for different collaborators.

An entry field for collaborators and their user role names.

An example of collaborator options in Storyblok.

Section titled Map out content authoring workflows Map out content authoring workflows

A content authoring workflow is simply a sequence of tasks that should be completed before a new content entry goes live on your eCommerce store. It streamlines your content publishing process, ensuring efficiency and quality control.

Six gray rows labeled by blue boxes with various connected content authoring texts across them.

An example flowchart of a content authoring workflow.

You can define content authoring workflows in your CMS by assigning tasks to specific collaborators. For example, your content writer can add new product descriptions for items while the content marketing manager reviews and publishes these new entries.

A gray background with an entry field for text and color above three rows of available entries.

An example of a Storyblok demo space's workflow stages.

Section titled 5. Security 5. Security

Your content management system is the most delicate part of your website. In fact, 32% of the world’s largest enterprises suffer a CMS security breach every week.

Section titled Best practices for boosting security in your eCommerce store Best practices for boosting security in your eCommerce store

To make your content management system more secure, you should:

Section titled Use a read-only API Use a read-only API

Read-only APIs are difficult to breach because they only fetch requested data. They do not allow an external system to create, update, or delete data in your CMS. External systems use APIs — Applicant Programming Interfaces — to pull content from a CMS backend and deliver the content to different frontends.

Section titled Limit plugin usage Limit plugin usage

Plugins can increase your CMS vulnerability to data breaches. For example, in 2021, about 100,000 WordPress websites were breached after using the responsive menu plugin.

To limit plugin usage, consider switching to a headless CMS like Storyblok. Unlike a traditional CMS, headless CMSs use APIs for content delivery, feature expansions, and third-party integrations. APIs have better security because they do not share your data with external systems automatically.

Section titled It’s easier to implement CMS best practices when you go headless It’s easier to implement CMS best practices when you go headless

A headless CMS has its backend completely removed from the frontend, providing better content management flexibility. With better content management flexibility, you can easily implement these CMS best practices without dealing with the burden of extra code — which is a common problem with traditional and hybrid CMSs. This helps you create more exciting shopping experiences for shoppers and drive better results for your eCommerce store.

See why you should go headless with Storyblok.