Skip to content. Adrian Roselli Consultant, Writer, Speaker

All Posts

Slides from role=drinks at CSUN

Note: Below are the animated images and video that were in my slides but which did not survive in the transition to SlideShare. They are all quite large and will take time to load. If you want to save on your data plan, hit the browser’s stop button now. If…

Posted:

Tags: accessibility, html, slides, speaking, standards, W3C, whatwg

Google Analytics Viewport Tracking

Google Analytics has tracked browser viewport sizes for almost four years, but I found it was imprecise. After doing some recent testing I have decided it works well and have started to dump my own tracking as a result. This post shares some of the history and comparison information. History…

Posted:

Tags: analytics, browser, JavaScript

Not All Screen Reader Users Are Blind

The title says it all. But if you came to this page, you probably clicked because you were hoping for a little more detail than that assertion. So here is a little more detail. The Data In the 2015 WebAIM Screen Reader User Survey, when asked Which of the following…

Posted:

Tags: accessibility, ARIA, browser, html, standards, usability, UX

Avoid Default Browser Focus Styles

It is not uncommon to see developers and designers forego creating focus styles for controls on web sites and applications. For those who are aware of the need for the focus styles, the most common reason I hear for excluding them is that the browser provides focus styles by default…

Posted:

Tags: accessibility, browser, standards, usability, UX, WCAG

Speaking at WordCamp London

This March (next month!) I will be flying over to London to speak at WordCamp London over 17 to 19 March. The description in its own words: WordCamp London is a community organised WordPress event running for the fourth year since 2013. It’s aimed at anybody who uses, builds or…

Posted:

Tags: accessibility, speaking, standards, usability, WCAG

Slides: Implementing Accessibility for a11yTO

Last night I spoke for about 25 minutes at the Accessibility Toronto meet-up. Joseph McLarty led with an overview of accessibility as a concept, touching on disabilities and simple testing techniques (see his slides at SlideShare). Then I ran through the following slides discussing how, from a process perspective, you…

Posted:

Tags: accessibility, slides, speaking

Make Your Vine Archive Accessible & Future-Proof

Well, make it accessible at least. Context: Seriously, even the pagination is made of non-links and non-buttons. These developers are now building other platforms. Poorly. pic.twitter.com/kETE6Dv0IS— Adrian Roselli (@aardrian) January 18, 2017 Step 1: Capture the Rendered HTML Open your browser developer tools and copy the entire thing into a…

Posted:

Tags: accessibility, html, standards, usability, UX

Avoid Messages Under Fields

Sometimes we fail to consider how browser features can jack up our interfaces. This is neither good nor bad, but we do need to account for it. My argument here is simple. Avoid putting important actionable or informational text exclusively below form fields. This includes labels, hints, and error messages.…

Posted:

Tags: browser, design, mobile, usability, UX

Speaking at MinneWebCon

This May I will be traveling to Minneapolis to speak at MinneWebCon. In its own words: MinneWebCon is a two-day web conference in Minneapolis that encourages inclusive grassroots knowledge-sharing. In addition to keynote speakers, breakout sessions, and half-day workshops, our annual conference is a space for speakers and attendees to…

Posted:

Tags: accessibility, speaking, standards, usability, UX

Accessible Emoji, Tweaked

Léonie Watson recently posted Accessible Emoji, a simple technique to make emoji characters accessible to those with screen readers. It requires a little bit of extra effort when inserting an emoji into a web page, but it is worth it to convey the meaning to screen reader users. Then there…

Posted:

Tags: accessibility, ARIA, css, design, html, print, usability, UX

Don’t Re-Create Browser Features

There has been some discussion lately around, of all things, text resizing widgets on web sites. It was kicked off by a post from Jeffrey Zeldman suggesting that perhaps it is time to bring them back. Even mighty responsive design benefits from offering a choice of font sizes—because there are…

Posted:

Tags: accessibility, browser, design, fonts, usability, UX

Be Wary of Nesting Roles

As a web developer, you may take it for granted that you cannot nest a hyperlink. I mean, you can nest a hyperlink, but more likely than not you already know how problematic that can be — and not just because the validator will kick that back as an error.…

Posted:

Tags: accessibility, ARIA, html, standards, UX

Search icon Used in the search form as a button. Search icon Used in the search form as a button. Information icon Lower-case 'i' in a circle. Checkmark icon Symbol showing a checkmark. Alert icon Exclamation mark within a triangle.