Skip to content.
Adrian Roselli
Large Language Generative Wallet genAI

All Posts Tagged: design

Web Development Advent Calendars for 2019

Web developers around the world have celebrated Saturnalia solstice Isaac Newton’s birthday Christmas with advent calendars covering web-related topics. As a result, you may recognize some of the ones listed below. Every year I miss a few on day one, so add a comment or tweet me if you have…

Posted:

Tags: accessibility, css, design, html, internet, standards, UX

CSS Logical Properties

I have often remarked that my blog is little more than a place for me to offload my memory. I need not remember the syntax, logic, test results, etc. of every control, widget, style, browser, and so on. I can just write a post and refer to it later. This…

Posted:

Tags: browser, css, design, i18n, L10n, standards

Accessible Drop Caps

Since the early days of the web, when images could be floated and text would wrap around them, designers have wanted to bring drop caps onto the web. Then we learned how terrible a pattern like <img alt=”M” align=”left”>atthew is for users, and CSS introduced :first-letter, letting us believe all…

Posted:

Tags: accessibility, ARIA, css, design, html, pattern, usability, UX, WCAG

Slides: Role of Design in Accessibility — VilniusJS Meet-up

While in town for You Gotta Love Frontend, I was invited to present this talk at the VilniusJS meet-up. There were only a couple designers in the audience, so I did a little on-the-fly reframing — namely to explain the value of a designer on a team. I only went…

Posted:

Tags: accessibility, design, slides, UX, WCAG

Slides: The Role of Design in Accessibility — a11yTO Meet-up

Last night I drove up to Toronto, braving concurrent matches from two of their local sporting clubs, parking in oblivion, navigating a maze of progressive rings of fencing, sneaking into the venue via a propped service door, and presented on the role of design in accessibility. It was a code-light…

Posted:

Tags: accessibility, design, slides, WCAG

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

Web Development Advent Calendars for 2018

Web developers around the world have celebrated Saturnalia solstice Isaac Newton’s birthday Christmas with advent calendars covering web-related topics. As a result, you may recognize some of the ones listed below. Every year I miss a few on day one, so add a comment or tweet me if you have…

Posted:

Tags: accessibility, css, design, html, internet, standards, UX

Web Development Advent Calendars for 2017

The chocolate tasted like sugared wax. Yet it was still less offensive than the typeface. For a few years now web developers around the world have celebrated Saturnalia Christmas with advent calendars covering topics related to the web. I expect you will recognize some of these from prior years. I…

Posted:

Tags: accessibility, css, design, html, internet, standards, UX

A Responsive Accessible Table

Painfully slow demonstration of the example table resizing and different media queries kicking in. After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt…

Posted:

Tags: accessibility, ARIA, css, design, html, mobile, pattern, print, standards, tables, usability, UX, WHCM

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

Accessible Emoji, Tweaked

Warning: The approach outlined in this post does not conform to WCAG 2.1 Success Criterion 1.4.13 Content on Hover or Focus, introduced in 2018 (two years after this post date). The CSS-only tool-tip described within cannot be dismissed and is not persistent. If you want to enhance it with JavaScript…

Posted:

Tags: accessibility, ARIA, css, design, html, pattern, 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, overlay, usability, UX