All posts by Rafael Minuesa

About Rafael Minuesa

Rafael describes himself as a Gaphic Designer turned Web Designer turned Web Developer.
He has worked extensively with PHP/MySQL Content Management Systems, specializing mostly in WordPress and WooCommerce.
Follow Rafael Minuesa on LinkedIn:

Make your WooCommerce store accessible slide

“How to make your WooCommerce store accessible” Slide Presentation

To contribute to the ‘HACK-cessibility Days‘ on May 19th and 20th, an awareness event for software developers, designers, manufacturers, and others, AccessibleWeb has created a Slide Presentation titled “How to make your WooCommerce store accessible” that you can view below:

The Presentation was prepared with Google Slides by Rafael Minuesa from AccessibleWeb, based on the original Post found at:

You can view and download the original presentation from:

One-Stop ‪‎Accessibility‬ resources for Developers from W3C

The World Wide Web Consortium (W3C) has launched W3C Developers avenue, a one-stop page featuring the offerings and tools W3C has for Web Developers.

Among the offerings and tools W3C has for Web Developers are:

  • Free and Open-Source W3C validators, checkers and tools
  • Discourse, to discuss and learn
  • W3C Community Groups to propose and incubate new web technologies
  • Learning, in a W3Cx MOOC or a course from W3DevCampus
  • Testing the Web Forward

The resources are organized into 4 sections:


In the comfort of your browser, learn Web technologies such as HTML, CSS from the people who create them.


Lead your code to its full potential with great and open source tools.

Get Involved

Get involved in the creation of Web standards. Yes, that’s where cool people hang out.

Test the Web Forward

W3C’s one stop shop for Open Web Platform testing.

Jeffrey Jaffe, CEO of the W3C, explained that W3C Developers would provide free and Open-Source W3C validation tools and accessibility checkpoints.

More info at:

W3C Accessibility guidelines for Developers


Principles of Accessible Design

Web Accessibility for Designers Infographic

Web Accessibility for Designers

Great web accessibility starts in the design.

Structuring your design

Plan Heading Structure Early

Ensure all content and design fits into a logical heading structure.

Consider Reading Order

The reading order should be the same as the visual order.

Styling your text

Provide Good Contrast

Be especially careful with light shades of gray, orange, and yellow. Check your contrast levels with our color contrast checker.

Use True Text Whenever Possible

True text enlarges better, loads faster, and is easier to translate. Use CSS to add visual style.

Watch the Use of Caps

All caps can be difficult to read and can be read incorrectly by screen readers.

Use Adequate Font Size

Font size can vary based on the font chosen, but 10 point is usually a minimum.

Remember Line Length

Don’t make it too long or too short.

Designing with color

Use Animation, Video, and Audio Carefully

If used, provide a play/pause button. Avoid flashing or strobing content: It can cause seizures.

Don’t Rely on Color Alone

Because users often can’t distinguish or may override page colors, color cannot be the only way information is conveyed.

Design Accessible Form Controls

Ensure form controls have descriptive labels and instructions. Pay close attention to form validation errors and recovery mechanisms.

ChromeVox: A Screen Reader for Google Chrome

The ChromeVox screen reader is an extension for the Google Chrome browser that brings the speed, versatility, and security of Chrome to visually impaired users.

ChromeVox Accessibility Extension

Unlike most accessibility software, it is built using only web technologies like HTML5, CSS and Javascript. ChromeVox was designed from the start to enable unprecedented access to modern web apps, including those that utilize W3C ARIA (Access to Rich Internet Applications) to provide a rich, desktop-like experience. This enables visually impaired users to experience the power of web applications while also giving developers a way to verify the accessibility of their web applications.

Its simple yet powerful navigation is easy to learn and quickly gets new users up to speed browsing web sites and web-based applications eyes-free. Check out the documentation at for the user guide, tutorial, keyboard shortcut and developer reference guides.

Note: ChromeVox is still in development and currently doesn’t work in conjunction with desktop screen readers. In order to best use ChromeVox on your computer, you will need to disable your desktop screen reader when using ChromeVox.

Other Google Accessibility extensions worth checking out are:

  • ChromeVis: This extension magnifies any selected text on a webpage. You can change both the lens text color and the lens background color.
  • ChromeShades: Reformats everything in your browser as text-only, organizing it more like how a blind user would perceive the page with a screen reader.
  • ChromeLite: ChromeLite makes the web to display as text-only, just as how the web was originally conceived and the way a blind person would perceive it.

Braille Smartphone Prototype ready for testing


A new braille smartphone is being developed by Sumit Dagar, a National Institute of Design post-graduate, who teamed three years ago with the IIT Delhi and the LV Prasad Eye Institute.

The innovative prototype comes with a touch-screen that elevates and depresses at specific spots, emulating a Braille display, allowing blind users to read and send emails and text messages. This type of technology is known as Shape Memory Alloy: the idea is that each individual spot possesses “memory” with which it can remember its initial state after rising to form a Braille character.

Additionally, the phone makes extensive use of sound and vibrations to help the user recognize the different functions different functions.

The first model is expected to be available by the end of 2013 and retail for a price of about $185. Dagar also confirmed that more advanced versions of the smartphone are on the works.