WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Web-based games

for

From: Brandon Keith Biggs
Date: Aug 26, 2020 2:41PM

Yes, to second Nolan,
Games, for the most part, move out of semantic HTML.
For some strange reason, people like to do games in React, when React is
not a gaming framework. None of the games that are built with React,
without a screen reader user testing them, that I've seen, are accessible.
Even the React website's tutorial is not accessible (although there is an
open issue on Github).

This is an area of interfaces WCAG guidelines don't apply to, and semantic
HTML breaks down. Almost all games, except for HTML-based games, will only
have an application element, with possibly some menus, and maybe an element
with aria-live.
Thanks,

Brandon Keith Biggs <http://brandonkeithbiggs.com/>;


On Wed, Aug 26, 2020 at 12:12 PM Nolan Darilek < <EMAIL REMOVED> >
wrote:

> I can speak a bit to this. I'm about to launch an audio game on a
> variety of platforms. I do support the web, though I likely won't for
> this title since my approach has some rough edges.
>
>
> Broadly speaking, you have a couple approaches. First is to stick close
> to HTML elements, using regular web accessibility practices to iron out
> the rough edges. This can work for more UI-focused games, or for games
> where performance and graphics needs aren't too heavy. You're also
> pretty much tied to the web, which may or may not be a good thing for
> your use case.
>
>
> The second approach is rendering to a canvas. At this point you've
> abandoned web accessibility, and are thoroughly in roll-your-own
> territory. This isn't necessarily the bad thing it may sound like. What
> do WCAG and the ARIA authoring guidelines recommend to, say, make
> Asteroids or Pong accessible? :) Rolling your own lets you use the same
> code on multiple platforms and, say, port an SDL game to WebAssembly.
> You can often call out to JavaScript to, say, use the speechSynthesis
> API. You can also use more traditional game engines like Unity, then
> compile to a web target. You have lots of power, but also lots of
> responsibility if you want accessibility.
>
>
> Hybrid approaches are also possible, though I haven't delved as much
> into these. You could use HTML for your UI, then unhide a canvas and
> start a game loop when a Play link/button is clicked. This could also
> work with wasm as well--make your game's `main()` function immediately
> launch the game, and have your Play button call that.
>
>
> For my part, I've written a cross-platform screen reader that runs in
> the open source Godot engine. Currently supported platforms are Linux,
> Windows (desktop and universal, possibly the Xbox), Android, MacOS, and
> the web. iOS should be coming soon once I've figured out how to
> successfully dance with Apple. This approach does put you pretty
> squarely outside of web accessibility land, but I don't know if web
> accessibility techniques are up to, say, conveying a world like The Last
> of Us 2 as a game engine can be made to (but I'd certainly welcome being
> wrong on that. :) I don't necessarily recommend my approach as
> one-size-fits all, but I hope my ramblings help to put some perspective
> on the landscape of accessible web games. I don't plan on releasing
> future titles to the web right now, but they'd make great concept demos
> for quickly trying out game mechanics without me having to build them
> for each platform I support, and end users having to download and
> install them.
>
> On 8/26/20 1:45 PM, <EMAIL REMOVED> wrote:
> > The latest Syntax podcast includes a discussion of creating a
> minesweeper-style Web game with the React framework. The hosts suggested
> using React's pointer events. That made me cringe. I know little about
> React or its pointer events, but I assume that using them excludes keyboard
> users. Perhaps they will work on touch screens?
> > today I did some searching and found skimpy resources for a developer
> wanting to create an accessible Web game. Does anyone have suggestions for
> reading materials on this topic.
> > Jeff Gutsell
> >
> >
> > > > > > > > > > > > >