Found 62 bookmarks
Custom sorting
Blockquotes in Screen Readers
Blockquotes in Screen Readers
TL;DR: This post does not assert the correct way to code blockquotes, it will only demonstrate how screen readers announce some existing patterns. Test Details The first four examples are lifted from WHATWG HTML’s blockquote entry. The next three are from W3C HTML’s 2019 blockquote guidance (the W3C HTML spec…
·adrianroselli.com·
Blockquotes in Screen Readers
Formative posts
Formative posts
Inclusive design advocate, writer, developer, and speaker
·ericwbailey.website·
Formative posts
Dos and don'ts on designing for accessibility
Dos and don'ts on designing for accessibility
Karwai Pun is an interaction designer currently working on Service Optimisation to make existing and new services better for our users. Karwai is part of an accessibility group at Home Office Digital, leading on autism. Together with the team, she’s created these …
·accessibility.blog.gov.uk·
Dos and don'ts on designing for accessibility
How drawing helps you think | Ralph Ammer
How drawing helps you think | Ralph Ammer
You don't have to be an artist to draw! In this beautifully illustrated talk, Ralph Ammer shows how drawing your thoughts can be a powerful tool for improving your thinking, creativity and communication. He wants you to believe in your drawing abilities, and provides numerous exercises to help you get started.
·youtube.com·
How drawing helps you think | Ralph Ammer
The Creative Switch - Ralph Ammer
The Creative Switch - Ralph Ammer
How to have more ideas. This is how you stop staring at a blank paper and unleash your creative potential.
Just create a lot of options and then pick the best one. But why is that so hard? Because for each of those two steps we need to be in a different mood.
We have to step outside convention and disrupt our normal way of thinking.
Knowledge is the raw material for ideas.
shut the censor up: Focus on quantity! For example, make it a game to come up with 100 stupid ideas in 10 minutes. Then we simply don’t have time to judge. And this opens the floodgates for our crazy creative mind.
Ideas are attracted to laughter.
·ralphammer.com·
The Creative Switch - Ralph Ammer
An alt Decision Tree
An alt Decision Tree
Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI).
·w3.org·
An alt Decision Tree
But My Client Wants ...
But My Client Wants ...
The JAMstack, static site, serverless revolution has started. A lot of people working with clients think they can't use this amazing new architecture because their clients want very specific things. This site is meant to help you solve your clients' needs while getting to use the JAMstack!
·myclientwants.com·
But My Client Wants ...
A Responsive Accessible Table
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…
·adrianroselli.com·
A Responsive Accessible Table
A Design System Governance Process
A Design System Governance Process
You can have a comprehensive design system that contains a slew of well-structured components, thorough documentation, thoughtful guidelines, and a well-considered design language. But if a design system user can't get done what they're trying to get done, the whole system risks obsolescence. Produ
·bradfrost.com·
A Design System Governance Process
Add punctuation to your alt text
Add punctuation to your alt text
While alt text end punctuation isn’t technically required for compliance, it makes for a better experience for your audience.
·thoughtbot.com·
Add punctuation to your alt text
Choosing a name for your design system
Choosing a name for your design system
In what I hope becomes a series, I've been recording myself as I drive home from dropping my daughter off at school. Shifting away from more heady topics like AI's impact on design and development, I felt like talking about the importance of choosing a name for your design system. Give it a listen:
There are many benefits of choosing a formal name for your design system: A helpful shorthand – A design system’s name is its brand name, and that name becomes a shorthand that encapsulates and embodies what the whole effort is about. Mitigates confusion – many organizations have different permutations and generations of design systems floating around. Having a name that is distinct from “our company’s design system” can really helps clarify things. A design system called Splat allows people to say “Splat’s design tokens”, “Splat’s accordion”, and so on. Creates a global namespace – Having a distinct global namespace for a design system is really important: it prevents collisions with non-design system code, creates a useful web component namespace, unlocks the ability to measure adoption, and more. So if the name is Splat, you could define splat-card, splat-button, splat-accordion and so on in CSS and code. Helps with marketing efforts – a brand name for the design system helps disseminate it around the organization. It can be helpful, exciting, and fun to have a real product name floating around. We’ve had clients create Christmas ornaments, t-shirts, mugs, and other swag.
·bradfrost.com·
Choosing a name for your design system
Using text symbols in pseudo-elements accessibly
Using text symbols in pseudo-elements accessibly
Generated content (the ::before and ::after pseudo-elements) is quite handy for styling elements without disrupting markup. We can use it for creating things like custom checkboxes without any extra elements. https://codepen.io/MrRoboto/pen/OJxaGyb ...
·blog.mayank.co·
Using text symbols in pseudo-elements accessibly