Category Archives: web

What Does Inclusive Design Mean?

Why is accessibilty seen as an after-thought, or at worst an expense to help a handful of disadvantaged people?

Have you ever tried using a website or app on your smartphone whilst riding a bus when the sun is streaming through the window? You probably have. How did that work out for you?

…the internet was no longer being consumed solely on a desktop, viewing through a large monitor perched on a desk whilst in a comfortable chair. The iPhone broke a barrier. The web would start – and continues – to push its way into every moment of our day, regardless of what environment (surroundings or situation) you happen to be in.

microsoft inclusive design impairments

It’s lunch time at the Accessibility Scotland Conference and I take a stroll up the road to grab a soda. I find a shop and low and behold a 10cm step. With the challenges that wheelchairs users have fresh in my mind, I looked down, shook my head and walked on in.

The 10cm step

accessibility ramp at shop

On my way out a ramp appears! “Well that solves that”. I am then greeted by a delivery man with a trolley full of supplies for the shop. The ramp belonged to him. He finished his delivery, threw the ramp in the back of his truck and drove away. Leaving me with the 10cm step. So not only would consideration help those we would often think to require the support (those in wheelchairs, those with limited visibility or even those with prams) but it would help the main function of the shop – getting supplies in both quicker and easier – but also be less intrusive to all users.

So, what’s the digital equivalent of the 10cm step?

There’s a few. For example, the contrast between text and background. Dark colours on a light background work well for users with visual impairments but also work well for “able-bodied” users reading a phone with bright sunlight glaring off the screen.

What about the move towards ‘smart homes’ and the invisible interfaces such as Alexa and Siri? How accessible are they? Users that are mute (permanent impairment) or users with laryngitis (temporary impairment) will struggle to communicate with them. But also those, like myself, with a strong accent (situational impairment) that will struggle with these new technologies.

How do we take this forward?

Curated by (Lifekludger)
Read full article at Source: What Does Inclusive Design Mean? – Storm ID Blog

UI Options 

UI OptionsObjectiveEasily add UI Options to your website. Add a simple separated-panel preferences editor to any page.DescriptionUI Options adds a simple preferences editor dialog with a set of six panels in a collapsible panel at the top of the page, accessible through a button in the upper right corner of the page.

Curated by (Lifekludger)
Read full article at Source: UI Options | GPII DeveloperSpace

How Current Design Trends Impact Web Accessibility

Hands sketching a website layout on a digital tablet, meant to illustrate a UX Designer working to create a layout with web accessibility and inclusive design in mind.

“You are not your users.”
“Involve people with disabilities in user testing.”
“The average user does not exist.”
“Design for the extremes, and the middle will take care of itself.”

We hear these phrases all the time, yet a lot of people still believe that accessibility is mostly a quality assurance or developer’s responsibility, something they should only have to think about when the actual coding phase begins. But some of the really impactful decisions that make or break accessibility for people with disabilities and seniors are, in fact, made during the design phase.

Yes, you read that right. Let me rephrase it for you: a lot of the accessibility issues that people run into on our sites and applications are caused by uneducated decisions made during the design phase. You and I have the power to do something about that.

In this post, we’ll explore some of the design trends we increasingly run into on the Web today, and how decisions made during the design phases can have a hugely detrimental effect on anyone who uses the web in a slightly differently way. But first…

Curated by (Lifekludger)
Read full article at Source: How Current Design Trends Impact Web Accessibility

Writing CSS with Accessibility in Mind

An introduction to web accessibility. Tips on how to improve the accessibility of your web sites and apps with CSS.

… a lot of things have changed and CSS now gives us an incredible set of tools to style the web. We went from Verdana to Webfonts, from fixed widths to Responsive Web Design, from table-based layouts to Grid, and we don’t have to use images anymore for borders, fonts or shadows. We have custom propertiesFeature Queriescalc() and numerous new units. This of course is only a subset of the great developments of the last years.

Writing CSS with Accessibility in Mind

While this wide range of properties and endless ways of solving tasks with CSS makes our lives easier, it also creates the potential to worsen the experience for our users. It’s actually possible to make a website inaccessible in just three lines of CSS.

In this post I’ve collected techniques, considerations and approaches that will help you write more accessible CSS. The collection starts with basic concepts and well-known properties and covers some of the newer stuff at the end.

In the end it got way bigger than expected, so here’s a handy menu so you can jump directly to a section that interests you the most:

Curated by (Lifekludger)
Read full article at Source: Writing CSS with Accessibility in Mind – Manuel Matuzovic – Medium

Accessible website design for users with disabilities lags far behind demand

“The internet is, in essence, broken,” said Todd Bankofier, the CEO of accessibility software company AudioEye. Last week the company announced a partnership with web design firm Dealer Inspire, which makes customer-facing sites for auto retailers, to implement AudioEye’s Ally Toolbar across their entire portfolio.

The move “expands our reach immediately, making it much more efficient to continue our mission to make the most expansive infrastructure in the world accessible to everyone,” Bankofier added.

Even the most well-meaning brand leaders and site designers have too narrow a view of what constitutes disability, he said. It’s not just people who are blind, deaf, or use wheelchairs: people with autism, PTSD, visual impairment, epilepsy, dyslexia or colorblindness all have different needs for digital access. AudioEye’s Ally Toolbar takes all these users into account and allows a person to select precisely the site they need to see.

Curated by (Lifekludger)
Read full article at Source: Accessible website design for users with disabilities lags far behind demand | Campaign US

21 Chrome Extensions for Special Needs

21 Chrome Extensions for Struggling Students and Special Needs

Technology can be a powerful tool to assist students with special needs or any sort of learning challenge. In particular the Chrome web browser allows users to install a wide variety of web extensions that provide tools that can help all learners, regardless of ability level.In this blog post we will take a look at 21 Chrome web extensions that can assist students in five main categories: Text to Speech, Readability, Reading Comprehension, Focus, Navigation

Some of the tools fit into more than one topic, but each is only listed once. Certainly this list does not cover all of the useful web extensions available for struggling learners, but it is a great place to begin. In addition to the list of extension, I have also linked in the video and help guide from a webinar I did a while back on “Google Tools for Special Needs”.

Curated by (Lifekludger)
Read full article at Source: Control Alt Achieve: 21 Chrome Extensions for Struggling Students and Special Needs

Easy Checks – A First Review of Web Accessibility | (WAI) | W3C

Easy Checks – A First Review of Web Accessibility

This page helps you start to assess the accessibility of a web page. With these simple steps, you can get an idea whether or not accessibility is addressed in even the most basic way.

These checks cover just a few accessibility issues and are designed to be quick and easy, rather than definitive. A web page could seem to pass these checks, yet still have significant accessibility barriers. More robust assessment is needed to evaluate accessibility comprehensively.

This page provides checks for the following specific aspects of a web page. It also provides guidance on Next Steps and links to more evaluation resources.

Curated by (Lifekludger)
Read full article at Source: Easy Checks – A First Review of Web Accessibility | Web Accessibility Initiative (WAI) | W3C

An Introduction to the Reduced Motion Media Query | CSS-Tricks

The open web’s success is built on interoperable technologies. The ability to control animation now exists alongside important features such as zooming content, installing extensions, enabling high contrast display, loading custom stylesheets, or disabling JavaScript. Sites all too often inundate their audiences with automatically playing, battery-draining, resource-hogging animations. The need for people being able to take back control of animations might be more prevalent than you may initially think.

Although technology unintentionally inflicting adverse effects has existed before this, the popularity of iOS gave the issue prominence. Apple has great support for accessibility, so an option in the operating system preferences to disable motion effects for those with vestibular disorders was added in response.

#Vestibu-what?

Your vestibular system provides an internal sensor to communicate your body’s physical position and orientation in the world, and is key to controlling balance and eye movement.

Vestibular disorders can cause your vestibular system to struggle to make sense of what is happening, resulting in loss of balance and vertigo, migraines, nausea, and hearing loss. Anyone who has spun around too quickly is familiar with a confused vestibular system.

Curated by (Lifekludger)
Read full article at Source: An Introduction to the Reduced Motion Media Query | CSS-Tricks