Archive index

A11y Slackers Gitter Channel Archive 29th of January 2017

What fresh hell is THIS now? - Patrick Lauke
  1. Mev-Rael
    @Mevrael
    Jan 29 10:21
    How would you make a photo upload within a popup where you have to move a selected area to crop/resize an image accessible? What role this selected area should have, for example? And how to resize it using keyboard? I've seen shift + arrow keys was using there, are there any guidlines, standards for that?
  2. Mallory
    @StommePoes
    Jan 29 16:53
    1. I would offer that a user can simply upload the photo and hit enter, where no cropping/anything is done, and the image is loaded as-is.
    2. For cropping, there are usually two boxes: one representing the original/current image. I dunno if it would have a role but it would have text inside naming it as the original; the other box is representing what will be kept.
    3. of the box-of-keeps, I believe that whole box should be focusable as itself so users can use arrows to move it around in any direction, similar to moving around in a grid.
    4. I would allow 4 controls to represent either each of the sides, or each of the corners, where again arrow keys can allow these to move around to change either the side or the corner position.
    5. It might make sense to have a live region around some visible text stating the proposed image's new dimensions, which should change as the edges or corners are manipulated.
  3. I can't think of any appropriate roles for this sort of thing, and I don't see them coming along until the specs start dealing with web-based image editors more. Roles for dragging and dropping have been removed from aria 1.0, and the only other roles that might work would be very generic, like region. I'm not entirely certain I would use any roles. I would have probably toggle buttons representing the 4 edges/corners: toggle-on meaning arrows move things, toggle-off means they don't, and to hijack arrows, an application role might be needed. The whole image cropping thing could be an application role but then you'd have to be really careful with text anywhere as you're removing navigation abilities from SRs.
  4. Mev-Rael
    @Mevrael
    Jan 29 16:58
    Fow now I stayed with role="button", with mouse you click and move cursor, you use wheel to resize. With keyboard 4 arrow keys for moving and shift+arrow keys for resizing, enter save changes, close dialog and update the original preview image nex to file upload input
  5. probably aria label will be enough here
  6. Mallory
    @StommePoes
    Jan 29 21:48
    As a sighted keyboarder, I would have no idea what to use. We're going to be building an avatar uploader and resizer in the coming months and one of the things I will insist on is visible instructions for sighted keyboarders.
  7. The arrows would probably be my first attemp at mystery-meating though.