Skip to content. Adrian Roselli Consultant, Writer, Speaker

All Posts Tagged: usability

Under-Engineered Toggles

Toggle buttons feel like a favorite way for devs and designers to show off their animation, design, and pun skills. There is even a Codepen collection dedicated to toggles. Other writings on toggle and switch patterns Toggle Buttons by Heydon Pickering, 31 March 2017 Building Inclusive Toggle Buttons by Heydon…

Posted:

Tags: accessibility, css, html, usability, UX, WHCM

Slides: Prototyping Accessibility for Booster 2019

Direct link in case the embed does not work. I also mentioned some resources at the end of my talk: How to Meet WCAG 2 (Quick Reference) Intopia Launches WCAG 2.1 Map Inclusive Design Principles Inclusive Design posters from Barclays Tweets Some people tweeted about my workshop. I also tweeted…

Posted:

Tags: accessibility, slides, speaking, standards, usability, UX, WCAG

Avoid Default Field Validation

HTML5 gives us form field validation for free. The problem is that the default messages browsers provide are not always useful and typically do not work with assistive technology. I made an example on CodePen that uses an email field (type=”email”), is required (required), and uses a pattern to restrict…

Posted:

Tags: accessibility, browser, html, usability, UX

Uncanny A11y

Original photo by Kevin Hale, text added. CC BY-SA 2.0. The pun in the title is that some people pronounce the a11y numeronym as “alley”. That makes the full title sound like uncanny valley, the concept of human-looking things seeming almost, but not quite, human and therefore creepy. In accessibility,…

Posted:

Tags: accessibility, css, html, JavaScript, usability, UX

Underlines Are Beautiful

Underlines, the standard, built-in signifier of hyperlinks, the core feature of the web, are beautiful. This is objectively true. They are aesthetically one of the most delightful visual design elements ever created. They represent the ideal of a democratized information system. They are a frail monument to the worldwide reach…

Posted:

Tags: accessibility, design, usability, UX

Announcing a11y.reviews

Tobie Langel and I have launched a new site called a11y.reviews (spoken as Accessibility Reviews). Today if you want to identify if a tool, platform, service, resource, etc. is accessible you have to ask the broader community for its feedback. This does not scale. The goal of the site is…

Posted:

Tags: accessibility, standards, usability, UX

Baseline Rules for Scrollbar Usability

Web Content Accessibility Guidelines Inclusive Design Principles Manage Expectations Wrap-up Now that one of the most popular CSS resource sites on the innertubes has implemented styled scrollbars in the browser I think the time is right (or too late?) for me to try to capture a starting point for ensuring…

Posted:

Tags: accessibility, browser, css, usability

Toggling Animations On and Off, a Variation

In the post Toggling Animations On and Off Kirupa Chinnathambi does a great job of outlining the value in giving users a choice over seeing animations. Part of that is by honoring preferences users have already made in their operating systems to reduce the amount of animation they see. I…

Posted:

Tags: accessibility, css, usability, UX

Conferences, Speakers: Please Caption Your Videos

Over the last few years more and more conferences have started to provide live captions during talks. This is awesome and inclusive and great for the olds like me. It excites me so much that I even sponsored the live captions at a conference a couple months ago. While I…

Posted:

Tags: accessibility, rant, standards, usability, UX, video

Selfish Accessibility at CodeDaze

The slides from my talk at CodeDaze follow. If you cannot view the embed, visit them directly at SlideShare. Embedded Videos There were two videos in my talk. They will not play in the SlideShare embed, so I stuffed them below. Slide 56 The video demonstrates how a screen reader…

Posted:

Tags: accessibility, slides, standards, usability, UX

Variable Fonts and Dyslexia

Dyslexia is not a black or white, on or off condition. Some with dyslexia report different challenges than others, ranging from typefaces to page layout to other factors. A few years ago I wrote Typefaces for Dyslexia, where I gathered some research suggesting that dedicated typefaces, on the whole, do…

Posted:

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

On Gutenberg, for My Clients

TL;DR: When WordPress 5.0 is released, let’s keep the current editor on your site instead of allowing the new editor, Gutenberg, to replace it. Level Setting Some of you are familiar with WordPress beyond a platform that powers your site — you follow along with its changes and its direction.…

Posted:

Tags: accessibility, usability, UX, WordPress

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.