September 1, 2020 Smashing Newsletter: Issue #264
This newsletter issue was sent out to 184,967 subscribers on Tuesday, September 1, 2020.
Editorial
Our second themed newsletter rounds up some resources on accessibility, including the upcoming Inclusive Design 24. Inclusive Design 24 have been running their virtual event every year since 2014, so they have a head start on the rest of us!
Speaking of virtual events, we’ve only just wrapped up Smashing Live!, and we are straight into SmashingConf Freiburg, which would have been held in the Smashing hometown of Freiburg in Germany, but is this year moving online along with our other events. There are still tickets available if you would like to join us next week!
We have also put some new front-end & UX workshops online on SVG, web performance and UX, which you can attend standalone or bundled with a conference ticket.
Enjoy the resources in this newsletter, and I hope to see you at an online event soon.
— Rachel Andrew (@rachelandrew)
- Website Features That Annoy Screen Reader Users
- Accessibility For Teams
- Implementing Accessible Data Charts
- 24 Hours Of Inclusive Design Talks
- Useful Accessibility Tools And Resources
- Coming Up Next on Smashing
1. Website Features That Annoy Screen Reader Users
A missing alt caption, an auto-playing video, unlabelled buttons, poor use of headings, inaccessible web forms — what might seem like a small issue for sighted users can make the difference between being able to use a website independently or not for blind and visually impaired people. Holly Tuke knows this from her own experience.
To raise awareness for common accessibility issues, Holly sumarized five annoying website features she faces as a screen reader user every single day, and, of course, how to fix them. Little details that make a huge difference. (cm)
2. Accessibility For Teams
Accessibility goes far beyond the code, so when it comes to delivering accessible websites, each person in a team has their specific responsibilities. If you feel that your team hasn’t found the right strategy to tackle accessibility yet, Peter van Grieken’s guide “Accessibility for teams” has got your back.
The guide consists of six parts, with each one of them aimed at the different specialists in your team: product managers, content designers, UX designers, visual designers, and front-end developers, plus a guide on accessibility testing. The guide is still a work in progress, the parts for product managers and UX designers have already been released. A great resource that helps incorporate accessibility into your team’s workflow from the ground up. (cm)
3. Implementing Accessible Data Charts
Data visualizations are a great way to make information stand out. However, they also come with their own accessibility challenges. When Sara Soueidan teamed up with SuperFriendly to create an accessible micro-site for Khan Academy’s annual report, she wanted to make sure that the way the data is presented and implemented is as accessible as possible, regardless of how a visitor explores the site. Her solution: SVG.
In a case study, Sara summarized everything you need to consider when you want to make your SVG charts and visualizations accessible — beginning with the most important step of choosing an appropriate embedding technique. It also covers why you should avoid trying to make an SVG chart accessible using ARIA roles and why Sara didn’t choose <figure> to embed them. A fantastic reference guide. (cm)
4. 24 Hours Of Inclusive Design Talks
What do you need to keep in mind to write truly inclusive CSS? How can you help your organization to embrace digital inclusion? And what could an emergency website kit look like that is extremely resilient, highly inclusive, and fast to get off the ground to get important information to as many people as possible if needed? These are only some of the questions that will be answered in the 2020 edition of Inclusive Design 24 on September 17.
Inclusive Design 24 is a free 24-hour online event on all things inclusive design, sharing knowledge from analog to digital, from design to development, from planners to practitioners. No registration required, all sessions will be streamed live and publicly on the #id24 YouTube channel, starting at 23:45 UTC on September 16. A wonderful community effort. (cm)
5. Useful Accessibility Tools And Resources
The right tools at the right time help you catch accessibility errors and remove potential barriers before they can harm your users. One such tool is Accessibility Insights. The visual helper highlights accessibility errors on a web page and shows you how to fix them. Dedicated tests catch the most common accessibility issues in less than five minutes, verify UI Automation properties, and investigate contrast ratios. Accessibility Insights is available as Chrome and Microsoft Edge extensions. There’s also a desktop app for Windows and one to find and fix issues in Android apps.
Another great addition to your accessibility testing toolkit are the free tools that Accessibility.Dev offers. They include a page tester, an accessible color picker, and a color contrast checker, as well as Continuum Explorer, a Chrome extension that checks for accessibility when live reloading modified code in the browser.
Their Access Assistant toolbar is also worth taking a closer look at: It runs over 100 fully automated accessibility tests instantaneously, directly within the browser. If you want to dive deeper into tools and resources to help with accessibility, Ian Routledge curates an extensive list with everything from checkers and checklists to meetups and books. Precious helpers. (cm)
6. Coming Up Next on Smashing
With Smashing Membership, you get access to goodies, eBooks, discounts and live sessions with experts — all around front-end & UX, for just one coffee a month. Coming up next:
- “Accessibility With(Out) Priorities” with Chen Hui Jing— September 1 at 14:00 London time
- “The Good, The Bad And Ugly Of Prototyping” with Adekunle Oduye— October 1 at 19:00 London time
- “All About Icons” with Marc Edwards— October 20 at 11:00 London time
We also have online workshops on front-end & UX — designed to give you the same experience and access to experts as in an in-person workshop, but without needing to leave your desk.
- JAMstack! (Sep 1–16)
- The CSS Layout Masterclass (Sep 10–11)
- Vue.js: The Practical Guide (Sep 17 – Oct 2)
- Smart Interface Design Patterns (Sep 22 – Oct 6)
- The SVG Animation (Oct 8-22)
- Web Performance (Oct 13-27)
- Designing for Emotion (Oct 28-29)
- GraphQL Workshop (Nov 12-27)
Or, if you’d like to run an online workshop with your team, please get in touch with Vitaly at vitaly@smashingconf.com and briefly describe what problems you’re facing and would like to solve. Get in touch — it’s that easy! (vf)
Smashing Newsletter
Front-end, design and UX. Sent out 1× a week.You can always unsubscribe with just one click.