zooniverse / Panoptes-Front-End

Front end for zooniverse/Panoptes
https://www.zooniverse.org
Apache License 2.0
64 stars 76 forks source link

Blue box around classification questions answers in Mac Chrome Version 60.0.3112.101 (Official Build) (64-bit) and also in Safari #3997

Closed mschwamb closed 6 years ago

mschwamb commented 7 years ago
screen shot 2017-08-23 at 7 53 11 pm

The cyan box right of the subject shouldn't be there.

mschwamb commented 7 years ago

get the same thing in the latest version of Safari and it goes away when you click anywhere on the screen

screen shot 2017-08-23 at 7 56 07 pm
mschwamb commented 7 years ago

Maybe this is causing the Firefox issue #3989

eatyourgreens commented 7 years ago

Questions are autofocussed now, like other tasks, to make them easier to answer from the keyboard. See #3970

eatyourgreens commented 7 years ago

By the way, Apple let you turn off the blue box but it's buried somewhere in the OSX accessibility settings.

mschwamb commented 7 years ago

It's really confusing because when you click away on the login button or on the tutorial or to to play the flipbook the box goes away and comes back when you click on an answer. Other webforms interfaces don't do this. why does the whole box need ton be highlighted?

eatyourgreens commented 7 years ago

The alternative is to focus the first answer, so that the radio button group can accept keyboard input, but we rejected that after trying it out, in #2563

We autofocus the first button for wildlife surveys: https://www.zooniverse.org/projects/wildcam/wildcam-darien/classify and the first text input for transcription projects: https://www.zooniverse.org/projects/zooniverse/notes-from-nature/classify?reload=1&workflow=4450 This change brings the same behaviour to question tasks, for people who use the keyboard (eg. people who can't use a mouse because of RSI.)

The blue outline is Apple/Webkit's method of showing you which form element is currently accepting keyboard input. Other operating systems and browsers have their own focus indicators.

mschwamb commented 7 years ago

If I go to any type of form or google poll for example it's not set up this way. Is there a reason things like google forms don't do that? I find it really confusing to see the box appear and disappear as I click and do things in the classification interface. I can still use keyboard on google forms but it doesn't have the box appear.

eatyourgreens commented 7 years ago

Are you using tab to navigate through those forms, or clicking on fields with a mouse? I think Chrome on OSX overrides the focus indicator if you use a mouse. I'm not sure.

google.com has it's own custom form input field, but you can see the blue outline around the currently selected text box on the Notes from Nature form above. You also see it on OSX, for example, when windows open up dialog boxes.

There's a debate in the accessibility community about whether the keyboard focus indicator should be big and bold, like Apple's blue border, or subtle, like Microsoft's thin dotted line around focussed controls.

mschwamb commented 7 years ago

I was using tab on the google form. Normally I use mouse, but from time to time I tab it. I just went back to a google form and tabbed to see what it does, because the Zooniverse projects are the first time I've seen such a large area highlighted.

In notes from nature it's subtle because it's only highlighting the actual response box, where as on the questions/decision tree tasks, a huge area is outlined so it's very obvious when you click on something to see the box come and go. I agree it's not good by default to highlight one response in a decision tree question since it might make volunteers favor it, but I'm finding it distracting watching this blue box in chrome and safari and white dashed box in Firefox appear and disappear as I click around.

mschwamb commented 7 years ago

@eatyourgreens would it be possible to not have the all the answers and the help box in the highlighted box but do like the survey task and have a smaller section. Like maybe the question/task prompt? It would be a lot less of the screen swapping back and forth with the outlined box if you're using a mouse, but I think would still let people using the keyboard do what they need to do easily

screen shot 2017-08-27 at 11 44 19 am screen shot 2017-08-27 at 11 44 06 am
mschwamb commented 7 years ago

Re-opening this rather than adding a new ticket. Some of the volunteers think the focus box for decision trees is a bug rather than a feature. This is from the Comet Hunters moderator.

The problem seems to be fixed but now there is a dotted box around every selection question. Make your selection and it goes away until you click on 'Done', then it comes back with the next question. Not affecting anything, just "there". 😕 Oh yeah, I do use Firefox.

Stay cool

https://www.zooniverse.org/projects/mschwamb/comet-hunters/talk/210/19109?comment=710676

Maybe like the survey task the box focus could be changed so it doesn't surround the answers but just the question?

stale[bot] commented 6 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

stale[bot] commented 6 years ago

Closed by probot-stale due to a lack of recent activity. Please feel free to re-open if you wish to take on this change.