Creating Accessible Websites for ESPA: Best tactics

Share This Post

Share on facebook
Share on linkedin
Share on twitter
Share on email

ESPA Accessibility Challenge Solved

 

After working on several ESPA projects for E-commerce projects in Greece, and after facing all the challenges of making a website WCAG 2.0 compatible we are here to share the tips and tricks that made our work a lot easier and efficient!

ESPA websites should pass through three essential accessibility checkers: Wave, Achecker and W3 Validator.

Making a WordPress or WooCommerce website accessible can be challenging, especially when working with fancy, pre-made themes.

 

Which theme to use?

 

When custom website building is not an option, the theme that we use for our customers is the Astra theme.

Astra is accessibility-ready, compatible with Elementor page builder and comes with a wide variety of pre-made demos.

This means that we start working with a website that passes through all tools without errors and already has a great design. 

Imagine how easier our work has become!

But even when working with an accessibility – ready theme like Astra, we have to follow some rules to keep the structure and content clean, and preventing errors from occuring on the development or during the design process.

  1. Apply alternative text to all images: Missing alt text is one of the most common errors. Remember to add a descriptive alt caption when uploading new media files.
  2. Use SVG icons instead of fonts: Icon i is often confused by tools for italic i. To avoid this confusion always upload icons on SVG format. 
  3. Follow contrast rules: Choose colors wisely. When building websites for accessibility is better to use the traditional black text on a white background to make sure that the contrast is always on acceptable levels. 
  4. Train your customers: When we deliver an accessibility-ready website to a customer, we always train him on how to upload new content in order to avoid future errors on the above mentioned validators.

When do I need Astra Pro?

 

Astra free or Astra Pro? 

Astra free is perfect for small projects, but Astra pro comes with a list of benefits, useful when working with big customers or complex E-commerce shops:

  1. Mega Menu: You can only use mega menu in the pro version of the theme, a feature useful for big e-commerce shops that require full functionality
  2. More Demos: Pro version comes with a huge variety of pre-built, ready-to-use websites. If you do not have an in-house graphic designer, the pro version will let you easily develop more sleek, professional websites with only a few changes on design.

What if I use another Theme?

 

If you are using another theme, the chances are that multiple errors will show up and you will need a developer to optimize the theme code in order to pass through all three validators.

We can make your website compliant, regardless of the theme!

Contact us on info@the-website-agency.com with your website details and request an offer. 

The process usually takes 1 to 3 workdays for an average business website!

 

 

Let’s make your website WCAG 2.0 compatible

 

Fill-in the form and we will get back to you with a custom quote to make your website WCAG 2.0 compatible!

More To Explore

SEO

Website Audit 101: The full guide

A deep dive to Website Audit Having a website comes with great responsibility. A website is your online presence, it costs money (maintenance, hosting, domain,