Van11y (for Vanilla-Accessibility) is a collection of accessible scripts for rich interfaces elements, built using progressive enhancement and customisable.
But you can also contribute to it …by looking ahead to the next fifteen years:
Let’s imagine it’s 2035…
How do you hope the practice of design will have changed for the better?
Fill out an online postcard with your hopes for the future.
This is great! Ideas for allowing more styling of form controls. I agree with the goals 100% and I like the look of the proposed solutions too.
The team behind this are looking for feedback so be sure to share your thoughts (I’ll probably formulate mine into a blog post).
4 Design Patterns That Violate “Back” Button Expectations – 59% of Sites Get It Wrong - Articles - Baymard Institute
Some interesting research in here around user expecations with the back button:
Generally, we’ve observed that if a new view is sufficiently different visually, or if a new view conceptually feels like a new page, it will be perceived as one — regardless of whether it technically is a new page or not. This has consequences for how a site should handle common product-finding and -exploration elements like overlays, filtering, and sorting. For example, if users click a link and 70% of the view changes to something new, most will perceive this to be a new page, even if it’s technically still the same page, just with a new view loaded in.
I’ve always been a fan of using the first few milliseconds of a user’s attention getting what I have to share with them — in front of them. Then worrying setting up the interaction layer while the user can start processing what they’re seeing.
You can send me messages using the form below. If I go 24 hours without receiving a message, I’ll permanently self-destruct, and everything will be wiped from my database.
Progressive disclosure interface patterns categorised and evaluated:
- mouseover popups (just say no!),
- new pages,
- scrolling sideways.
I really like the hypertext history invoked in this article.
The piece finishes with a great note on the MacNamara fallacy:
Everyone thinks metrics let us measure results. But, actually, they don’t. They measure only what they are measuring. Engagement, for example, is not something that can be measured, so we use an analogue for it. Time on page. Or clicks.
We often end up measuring what is quick, cheap, and easy to measure. Therefore, few organizations regularly conduct usability testing or customer-satisfaction surveys, but lots use analytics.
Even today, organizations often use clicks as a measure of engagement. So, all too often, they design user interfaces to generate clicks, so the system can measure them.
You don’t want to miss this! A five-day online conference with a different theme each day:
- Monday: Product Strategy
- Tuesday: Research
- Wednesday: Service Design
- Thursday: Content Strategy
- Friday: Interaction Design
Speakers include Amy Hupe, Kelly Goto, Kristina Halvorson, Lou Downe, Leisa Reichelt and many more still to be announce, all for ludicrously cheap ticket prices.
I know it sounds like I’m blowing my own trumpet because this is a Clearleft event, but I had nothing to do with it. The trumpets of my talented co-workers should be blasting in harmonious chorus.
(It’s a truly lovely website too!)
At the risk of being a broken record; HTML really needs
<tooltip>elements. Not more “low-level primitives” but good ol’ fashioned, difficult-to-get-consensus-on elements.
I wish browsers would prioritize accessibility improvements over things like main thread scheduling optimization to unblock tracking pixels and the Sisyphean task of competing with native.
If we really want to win, let’s make it easy for everyone to access the Web.
Six UX lessons from game design:
- Story vs Narrative (Think in terms of story arcs)
- Games are fractal (Break up the journey from big to small to tiny)
- Learning loop (figure out your core mechanic)
- Affordances (Prompt for known loops)
- Hintiness (Move to new loops)
- Pacing (Be sure to start here)
Making the case for moving your navigation to the bottom of the screen on mobile:
Phones are getting bigger, and some parts of the screen are easier to interact with than others. Having the hamburger menu at the top provides too big of an interaction cost, and we have a large number of amazing mobile app designs that utilize the bottom part of the screen. Maybe it’s time for the web design world to start using these ideas on websites as well?
The ellipsis is the new hamburger.
It’s disappointing that Apple, supposedly a leader in interface design, has resorted to such uninspiring, and I’ll dare say, lazy design in its icons. I don’t claim to be a usability expert, but it seems to me that icons should represent a clear intention, followed by a consistent action.
Use a toggle switch if you are:
- Applying a system state, not a contextual one
- Presenting binary options, not opposing ones
- Activating a state, not performing an action
- Obey the Law of Locality
- ABD: Anything But Dropdowns
- Pass the Squint Test
- Teach by example
This is about designing forms that everyone can use and complete as quickly as possible. Because nobody actually wants to use your form. They just want the outcome of having used it.
Some ideas for interface elements that prompt progressive web app users to add the website to their home screen.
A very welcome project from Marcus Herrmann, documenting how to make common interaction patterns accessible in popular frameworks: Vue, React, and Angular.
Wouldn’t it be great if every component in your design system had accessibility acceptance criteria? Paul has some good advice for putting those together:
- Start with accessibility needs
- Don’t be too generic
- Don’t define the solution
- Iterate criteria
- Have a dedicated page for login
- Expose all required fields
- Keep all fields on one page
- Don’t get fancy
Ire takes a deep dive into implementing an accessible tool tip.