Canvas

Real world uses of Canvas

List some real-world examples of uses of canvas that are examples of things best done with canvas and not other features of HTML:

• https://zewt.org/curves/
• http://www.blobsallad.se/iframedsallad.html
• http://www.htmlstack.com/checkbox/
• http://shapecatcher.com/index.html
• http://www.ludei.com/sumon (have no idea if its better done in canvas)
• http://www.ludei.com/games (other games on this site)
• https://www.lucidchart.com/documents/edit?button#4766-6fcc-4f18275d-b546-71450a7ac5be?demo=on&branch=5a613773-81d2-48fb-b3a5-4fe780978ab4 (The drawing objects could be done with SVG but SVG has more accessibility deficiencies at this time)

Limitations of real-world use cases

In this section, discuss specific examples from the list above and explore what those use cases fail to do (e.g. in terms of accessibility) which they should do.

https://zewt.org/curves/

Keyboard users can't tab to specific points and move them from the keyboard.

• Should show focus ring around the selected point when moving by keyboard movement.

Limited-vision users can't zoom around the specific area that the user is manipulating.

It's a pity the mouse cursor has to be manually changed onmousemove.

Finger users can't drag their finger across the canvas to find the various interactive parts of the document, because the user agent doesn't know ahead of times which parts are interactive.

http://www.ludei.com/sumon

can't naviagate and activate buttons using keyboard

various UI controls not identified as controls or operable for range of users.

can't zoom in to specific controls on the UI

can't communicate time remaining info to some users

Proposals

In this section, propose alternatives to improve canvas to make it easier to fill in the limitations listed in the previous section.

Examples

Take the pages from the first section and show how they would be changed to use the proposals in the previous section.