Some forum links have no separation between them

[MichaelRoberts]

The correction for ticket #309 also updated some of the forum links so that the text of each link appears with no intervening inactive text.

Apart from being fairly illegible this violates W3C accessibility guidelines:

​Checkpoint 10.5: Until user agents (including assistive technologies) render adjacent links distinctly, include non-link, printable characters (surrounded by spaces) between adjacent links.

If using text links rather than buttons, you can put ' | ' (or whatever) between each link, for example.

[jbk]

Did you deploy the changes to white.css on your project? Where did you encounter this issue?

[MichaelRoberts]

It's as currently seen on seti@home - see ​this thread for example.

[jbk]

The white.css file on seti does not include the changes from changeset 16047. Only the code was deployed there - not the new layout for the buttons.

[MichaelRoberts]

Thanks for the quick explanation. I'll post it to that thread and let's hope the seti@home forum configuration can be sorted out 'soon'!

[Nicolas]

Links should have space in HTML anyway. Adding margin with CSS is not enough.

An online translator may attempt to translate threadSubscribe as a single word.

I tried to open the page using lynx to show how the links are unreadable there, but looks like the forum code blocks lynx user agent. What the hell?

[jbk]

Replying to Nicolas:

Links should have space in HTML anyway. Adding margin with CSS is not enough.

Yes, please keep this ticket open. This will be addressed in an upcoming commit (going through testing during the weekend).

I tried to open the page using lynx to show how the links are unreadable there, but looks like the forum code blocks lynx user agent. What the hell?

No this is someone who has added a side-effect in get_logged_in_user() - probably to avoid bots. I'm not sure that's a good way of doing it...

[jbk]

Forgot to mention that SETI@home has now updated white.css so that the 99.9% of the users who are using regular browsers should no longer be bothered.

[jbk]

Replying to Nicolas:

Links should have space in HTML anyway. Adding margin with CSS is not enough.

Fixed in revision 16077 and 16076.

Rather than using a hardcoded visual seperator (like "|" suggested in the ticket) we will describe what the data is (a list of actions in the form of links) and then format the visual appearance using CSS. This has the added benefit that you may style them as buttons (current default in white.css), buttons with icons on them, a vertical list of links, a menu or even a dropdown box etc. etc. without having to change the HTML code. And it should now correctly display as a list of links in lynx/links/mobile phones/screenreaders/translators too.