Manage circle overhaul, take 2

[ysobel]

(see take 1 for more info)

Thanks for all the feedback (and squee ♥) on the first attempt at this. I haven't replied to comments (yet), but I did read them all. I've made some more changes, and would appreciate feedback.

Again, I am quite happy to give out invite codes for people who want to poke around. Otherwise, three pages, with variations:

http://www.isabeau.hack.dreamwidth.net/manage/circle/edit.bml?as=system
http://www.isabeau.hack.dreamwidth.net/manage/circle/edit.bml?as=test
http://www.isabeau.hack.dreamwidth.net/manage/circle/edit.bml?as=xXx_emobaby_xXx
ETA: The OpenID version didn't work. But feel free to create OpenID accounts to test with.

Known issues:
- (visual) there is no left border to the tables. nfi.
- (visual) it also might look better if the tables were centered? don't know the best way though
- (functional) it's a little redundant to have membership status for openID users
- (functional/accessibility) the bottom form still sucks (I haven't touched it at all)

Questions that I know I have:
- are the anchor links in the intro paragraph good or bad?
- someone brought up that having it in two-line format would get annoyingly long (which doesn't apply on the dreamhack, but would if you have 500 friends and 200 communities or whatever). does changing it to one-line make it too *wide*, especially for those of you with vision problems?
- if so, is that mainly for the people field, or is communities a problem too?
- are the tables and form elements still as accessible? (except for the add-user form. shh.)

Questions that I don't know I have:
- ???

Comments

[jeshyr]

Hey, I think the * instead of X for the colour display is cool! It's less confusingly looking like it should do something.

I think colour display column definitely needs a heading, it's very opaque to anybody who doesn't already know what it means. Especially, I suspect, to new users who won't have any colours set so they'll just have a row of asterisks.

Suggested heading: "Display Colors" which can then be run over 2 lines which will make it quite compact horizontally. Then when you get to doing the lower table you can label those columns "Foreground display color" and "Background display color" (probably also 2 lines high) and it will be a lot less confusing I think!

Consensus on the accessibility front is don't hide the column, use the aria-label attribute to report the colours on the X. This probably won't actually work because assistive tech hasn't caught up with using aria-label for this purpose but it will soon. And not many screen reader users will use it anyway, so it's no big deal.

If you want me to research aria-label usage, syntax, etc., lemme know :)

r
PS
You rock very much!