Web Accessibility Solution: Custom Bigcommerce App


E-commerce business space is constantly evolving. Making an online presence to the stores has eventually created innumerable opportunities for the businesses and their verticals with the sole motive to offer a user experience like never before.

E-Commerce businesses are ready to go the extra mile to offer a customer experience like never before. From discount coupons to live product customization, the online stores are doing everything to keep their customers intact.

However, a certain base of customers is still deprived of this excellent e-commerce experience.

According to a survey report by the American Foundation for the Blind,

26.9 Million(10%) of Americans face visual impairment.

Having said that the online stores primarily focus on the visual experience, we can boil down to this fact that the Online stores somehow fail to reach out to this 10% of the customers.

The other side of the coin, there are some handy solutions that can help the visually impaired to access the websites of their choice with a similar e-store experience. We name it “Web Accessibility solutions”. A sample of its functioning can be seen following:

In one of our recent projects, the BigCommerce development agency at The Brihaspati Infotech helped to develop a website design accessibility App for Bigcommerce stores. The app can be integrated into any store on Bigcommerce and can readily transform the store interface to a more readable and accessible website for the visually challenged.

Need for developing a Web Accessibility app for BigCommerce

BigCommerce offers a robust platform for developing e-commerce stores. The SAAS-based e-Commerce platform finds itself a perfect match for businesses expecting a feature-rich, lightweight store with ample space for scalability in the future. Skullcandy makes the best example that offers a visually-appealing store.

However, the website won’t be that colorful for someone who is color blind. The fonts might seem smaller than they appear to normal eyes. They can barely distinguish among the heading texts and the action buttons. A good UI may result in a bad experience for your visually challenged customers. Above all, the type and extent of Vision disability will vary from a person to another. As a result, boiling down to a fixed layout for this customer base is barely going to help them.

Web Accessibility Solutions have bridged this gap helping the customers to redesign the website layout to their preferences. The solutions can customize the UI according to the user’s disability. They can change the color theme of the layout, the font styles, font sizes, and highlight hyperlinks and heading texts.

The process needs detailing and the depth of understanding for CMS platforms and website designs. That is when the client sought our help at developing the Web Accessibility app for BigCommerce stores. And our custom BigCommerce app Development team was more than willing to help them achieve the feat.

Custom Bigcommerce App Development for Web Accessibility

The biggest challenge for accessibility web development on Bigcommerce stores was the huge variety of vision impairment among the customers. Attending to the same, the client’s app worked on several inputs to render the much-needed precision at customizing the existing layout.

We took one step at a time.

Enabling accessible Content

An eCommerce extension for web application accessibility allows the users to make the best use of the content. The Headings can be visually distinguished with the font size and style. However, for the visually impaired it might not make much difference. From the HTML layout, they can be distinguished by the tags like H1 or H2.

Highlighted Titles with Web accessible Solution
Highlighted Titles with Web-accessible Solution

In the image above, the user has opted for “Highlighted Titles”. We can find the heading texts being highlighted at the store.

Storefront for general users

The default store layout, however, was much like an ordinary store:

The rest of the content can be similarly customized to the user’s preferences.

We are talking about:

  • Content Scaling
  • More readable Font
  • Highlight Links
  • Text Magnification
  • Aligning
  • Adjust Font Sizing
  • Line and Letter Spacing

Developing web accessibility tools for disabled demanded separate functions for Content scaling and Text magnifier. While for Content scaling, the app required to only scale the font size, Text Magnifier was asking more. The content is passed to the app and can be previewed as a popup when hovered over the text. The following gif explains the difference.

Color adjustments

The Bigcommerce app for web page accessibility has a separate section for the color blinds. The users can make customizations to the website layout in easy clicks. In the Gif file below, we can find a user making adjustments in the website’s color scheme.

The user can make changes like:

  • Contrast(Light/Dark/High)
  • Saturation(High/Low)
  • Monochrome

Added to that, the user can personalize specific colors for the text part, as shown in the Gif file above.

Adjusting Orientations

There is more to our custom BigCommerce web designing for accessibility. The users can personalize the orientations for the webpage they are accessing. The readers can opt to take the following actions on the website to find an excellent user experience:

  • Hide Images and animations
  • Add a Virtual Keyboard
  • A reading guide
  • Large Cursor(White/Black)
  • Highlighting Hover
  • Focus Highlight

The store owners can further use the Bigcommerce app to define accessibility in web design for users with issues at focussing on the subject. The app designed by our expert eCommerce developers offers options to place emphasis on the desired web page section. For example, in the following picture, the user has opted for a similar option named “Reading Mask”.

Reading Mask
Reading Mask

The users can opt for Hyperlinks they are most likely to use. The application allows easy navigation to the concerned pages.

Easy Page Navigation with BigCommerce web accessible widget
Easy Page Navigation with BigCommerce web accessible widget

In the example above, the Bath URL redirects the user directly to the web page for products under the category named “Bath”.

As a market leader in web designing, we had an in-depth idea of all the theme layout components and the best ways to modify them dynamically. We used the best of our knowledge to help develop blind-accessible websites on Bigcommerce.

Our experience with custom BigCommerce app development

Time and again, the eCommerce expert developers at The Brihaspati Infotech have proved their expertise at custom Bigcommerce app development. They have helped the client establish a custom app for a specific user base that has always deserved a helping hand from an accessibility web design company.

In the past, the inhouse expert Bigcommerce developers have had their hands on similar apps that were tailored for the business. The Custom Product Configurator in Bigcommerce blog speaks of a similar private app designed to provide product customization on a Bigcommerce store.

We have a list of further development projects in our BigCommerce category that speaks of our immense ability at contributing to the Bigcommerce app store and developing private apps.

Summing up

Developing color accessibility web design for online stores is a great step for any business. Not just that you are conveying a message that you are considerate about your customer base, you are also expanding your reach to a market that was not tapped much online.

If your business also seeks a custom Bigcommerce app development or if you are looking to hire a BigCommerce expert, you can mail to us. You can further, contact us to discuss your eCommerce project today.