Posts in category: "accessibility"

Creating An Accessible Modal Dialog

Modal Dialogs are a tricky thing to make accessible. For visual users navigating with a mouse, creating a dialog is as simple as styling the element to look visually different from the rest of the page. However, users navigating a site via a keyboard and/or screenreader need a lot...

Anchors vs Buttons

For the longest time, web developers (myself included) have been using <a>s, <div>s, <span>s, and everything but <button>s to create interactive clickable elements. It would typically go something like this - <a href="#" role="button" onclick="openMenuModal(...

Labelling Form Elements

One context in which providing the correct labels for elements can be crucial is in HTML forms. Because users are interacting with forms more directly unlike with some UI elements, it is important that each form widget - input, textarea, select etc. - is correctly labelled. Depending on context, there...

WTF Opera Mini?!

According to StatCounter statistics, the global usage statistic for the Opera Mini mobile web browser is about 11.3%. However, in some developing countries such as Nigeria (where I live), this percentage goes up to 73%.  This is a huge problem.  It’s a problem because Opera Mini today is...

HTML For Screen Readers - Labelling Elements

To screen readers, a lot of the visual information that is presented on a webpage is lost. Because of this, we need to specifically provide information to them that may be obvious to a person looking at the page. One common way people define information specifically for screen readers is...