Inclusive And Accessible Omnichannel Strategies with JAMstack

Rachael Thompson
BigCommerce Developer Blog
6 min readJun 1, 2021
Accessibility and Inclusion on the JAMstack.

Did you know that about 15% of the world’s population has some difference in ability according to the World Bank? That is equivalent to one billion people. From that it is estimated that between one-hundred and two-hundred million people have some severe difference in ability.

In the pandemic, we saw the ecommerce flood gates open as many businesses struggled. This struggle also extended to those who have difficulty accessing the internet in a “normal” fashion.

We also saw 2020 as the year to go headless and the push to be omnichannel, also known as implementing composable commerce according to Gartner. This meant that businesses not only had to figure out a future proof tech-stack but how to make that tech-stack accessible, inclusive and highly extensible to social networks.

Composable Commerce in the form of headless and omnichannel can be more inclusive and accessible by leveraging JAMstack architecture and capabilities.

Composable Commerce is the Future

Last year the future of commerce was headless, now we are utilizing headless JAMstack architectures to create omnichannel, composable commerce. I see this as an analogy; omnichannel is to headless as strategy is to architecture. Omnichannel as a strategy can be executed by having a strong headless architecture, this in turn fulfills the theory of composable commerce.

🤯 Mind blown? Don’t worry, let me break it down.

The case for composable commerce

The business case for composable commerce is simple — sell everywhere, and use any tool or tech that allows you to sell more. This is a simple theory but difficult to maintain when applied to architecture, unless you plan to utilize an API first approach.

APIs in composable commerce are first class citizens, and should also be implemented in an accessible and inclusive way. This will set the foundation for all future development. By making the JAMstack JAAMIN’ we utilize the following:

  • JavaScript
  • APIs
  • Accessibility
  • Markup
  • Inclusion
  • Networks

Why is this important?

As a merchant grows their business, their technology stack needs to scale with their growing needs. This is why the concept of headless has been a game changer over the last few years. JAMstack and MACH architectures allow developers to scale quickly and utilize best in breed solutions across the spectrum of tooling that is available in ecommerce.

This allows a merchant to future proof their business so that they can easily “plug and play” as their needs change. This also includes how their omnichannel strategy and social networking strategies change. Being able to adapt and integrate new networks on the fly will be crucial when the next TikTok launches.

As a business grows we should also help these headless architectures adapt to the changing demographics of the brand or business. This is where accessibility and inclusion from the beginning of an implementation are crucial to future success. If we begin with high standards, and create a pattern of accessibility and inclusivity, it will be much easier to maintain year over year.

JAMstack for Accessible And Inclusive Omnichannel Strategies

In my opinion the JAMstack architectural style is naturally more accessible given the openness of connecting various APIs and harnessing the power of JavaScript. JAMstack patterns allow you as a developer to focus on cultivating an experience that captures an audience over rote and mundane tasks. Ultimately, allowing you more time to focus on critical features like accessibility and components that are more inclusive.

Accessibility from the beginning

The JAMstack allows us to think about accessibility from the beginning. We can leverage JavaScript frameworks’ use of ARIA labels and adopt semantic HTML patterns. Using feature flags with an API driven tool like LaunchDarkly you can enable users to have features like enhanced text, high contrast or additional video transcriptions. You could also leverage Netlify and personalization engine to deliver a site that is customized and personalized to that user’s needs. The future of customized ecommerce should be as accessibility driven as it is preference based.

Here are some ideas to consider when thinking about accessibility on the JAMstack:

I would also encourage us to look at sites that we enjoy and mock the patterns they utilize. The following site from Yeti Cycles is a great example of using ARIA labels. I also found it to be navigable via a screen reader called ChromeVox.

Inclusivity starts with enablement

When we think of enabling inclusivity into a website, we should think about the three C’s.

  1. Content Management System (CMS)
  2. Content Delivery Network (CDN)
  3. Components

When we look at our CMS, it should be developer friendly but business intuitive so that marketing and merchandising can really own the content direction. This will hopefully result in more collaboration in the content strategy. The more minds and opinions should result in a more inclusive site.

If we leverage CDN hosting especially on the edge like Netlify, we ensure that our sites include people in rural and underserved areas of the world. We should try to leverage CDNs for all the things listed above but also think about using a CDN for your various skeletons of the same site, this can help as you expand internationally.

Being inclusive at the component layer means that you leverage designs that are dynamic. This could be allowing a user to see models in their size or leverage user defined settings like preferences for language. This could also mean being sensitive to holiday banners or messaging that could be triggering to some individuals.

Old Navy has a great component on their site that is inclusive. It allows a user to select if they would like to see models of a size 4 or size 12. This allows the user to see models that are more relatable.

Omnichannel should include social networks

Your omnichannel strategy is not complete without social networks. This is not just for the business to dabble in. We as developers can do a lot by gathering social data and leveraging that to feed machine learning and artificial intelligence. The more we are involved in helping the business determine strategy the more value we bring to the table.

Just think about what you can do to inform segmentation, personalization, and price optimization.

To sum it up in a slide look here:

Let’s keep JAAMIN’!

When you think of JAMstack, think about making it JAAMIN’. The web should be a more accessible and inclusive place for us all and we have the power to do it.

Did you miss the Headless Commerce Summit? You can catch my talk on this topic below.

Headless Commerce Summit Presentation on JAAMIN with the JAMstack.

--

--