?
avatar PhilETaylor
PhilETaylor
2 Nov 2016

It simply makes no sense.

Seeing red should be a "problem"

For example, Setting the Joomla Global Configuration setting "Site Offline" to YES gives a GREEN background... well, I would have thought that a site being ONLINE would be green and a site offline, for a short while, would be a RED setting.

There are other examples.. like Debug System YES is green

Discuss,

[Edit] To be clear:

Its all over the place - these were just two examples.

1) The "good long, term option, the one thats recommended and sensible" should always be green.

2) Anything "thats out of the ordinary, that you would be MAD to leave in that state" should be red.

3) A choice of two equally acceptable options, should not be a green/red choice at all.

avatar PhilETaylor PhilETaylor - open - 2 Nov 2016
avatar joomla-cms-bot joomla-cms-bot - change - 2 Nov 2016
Labels Added: ?
avatar PhilETaylor PhilETaylor - change - 2 Nov 2016
The description was changed
avatar PhilETaylor PhilETaylor - edited - 2 Nov 2016
avatar brianteeman
brianteeman - comment - 2 Nov 2016

We have a new class we can use for this that was introduced for this specific situation. I will take a look at applying them

avatar brianteeman
brianteeman - comment - 2 Nov 2016

I understand and agree the login for site offline (pr prepared)
Not sure I agree with the debug - what is the logc for reversing the buttons?

avatar brianteeman
brianteeman - comment - 2 Nov 2016

If you are suggesting that the "recommended" setting should always be green then thats a much bigger issue effecting almost every view - not sure I really want to make that change

avatar PhilETaylor
PhilETaylor - comment - 2 Nov 2016

Its all over the place - these were just two examples.

  1. The "good long, term option, the one thats recommended and sensible" should always be green.

  2. Anything "thats out of the ordinary, that you would be MAD to leave in that state" should be red.

  3. A choice of two equally acceptable options, should not be a green/red choice at all.

avatar brianteeman
brianteeman - comment - 2 Nov 2016

I thought thats what you meant. Thats a big change - definitely not one I really want to do. Definitely something to consider for J4 though

avatar PhilETaylor PhilETaylor - change - 2 Nov 2016
The description was changed
avatar PhilETaylor PhilETaylor - edited - 2 Nov 2016
avatar PhilETaylor PhilETaylor - change - 2 Nov 2016
The description was changed
avatar PhilETaylor PhilETaylor - edited - 2 Nov 2016
avatar PhilETaylor
PhilETaylor - comment - 2 Nov 2016

Yup its a big change - but one that needs doing - at the moment it makes no sense.

avatar brianteeman
brianteeman - comment - 2 Nov 2016

@c-lodder for J4 admin template can we review all the option colours so that we always use green for recommended/good setting etc and not just green for yes etc or maybe your even looking at something better than using red/green?

avatar brianteeman
brianteeman - comment - 2 Nov 2016

Closed as we have a PR for offline and pinged the people building a new admin template for J4 for the others

avatar brianteeman brianteeman - change - 2 Nov 2016
Status New Closed
Closed_Date 0000-00-00 00:00:00 2016-11-02 16:43:56
Closed_By brianteeman
avatar brianteeman brianteeman - close - 2 Nov 2016
avatar brianteeman brianteeman - close - 2 Nov 2016
avatar brianteeman
brianteeman - comment - 2 Nov 2016

I am aware of that - I was just bringing this entire issue to your
attention for the J4 admin template you are working on. Maybe we dont even
use colour at all

On 2 November 2016 at 16:46, Lodder notifications@github.com wrote:

https://blog.kissmetrics.com/communicating-color-efficiently/


You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
#12704 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABPH8SExHhRWMpRhf9t9ovy3yK1539NKks5q6L5TgaJpZM4KnY4K
.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
https://brian.teeman.net/ http://brian.teeman.net/

avatar C-Lodder
C-Lodder - comment - 2 Nov 2016

I'll look into it

avatar PhilETaylor
PhilETaylor - comment - 2 Nov 2016

I dont mind this being closed as long as someone actually takes notice - I have raised the same issue with every major series for years now :) seems ignored :)

avatar brianteeman
brianteeman - comment - 2 Nov 2016

thats because it was you

On 2 November 2016 at 16:59, Phil Taylor notifications@github.com wrote:

I dont mind this being closed as long as someone actually takes notice - I
have raised the same issue with every major series for years now :) seems
ignored :)


You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
#12704 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABPH8eplavxBfDz8tGuOcthWvNjKGdZtks5q6MFkgaJpZM4KnY4K
.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
https://brian.teeman.net/ http://brian.teeman.net/

avatar PhilETaylor
PhilETaylor - comment - 2 Nov 2016

Although I hope you joke - its a serious issue that should be taken seriously and not ignored because of who the reporter is.

I had a massive blog post somewhere, from when @brianteeman raised the red/green issue years ago in Phil-a-form and demanded I change it to tick/cross instead...

avatar C-Lodder
C-Lodder - comment - 2 Nov 2016

I said I'll look into it.

avatar PhilETaylor
PhilETaylor - comment - 2 Nov 2016

seems Im not the only one that gets ignored #11271

A search on red or green reveals lots of previous issues...

avatar brianteeman
brianteeman - comment - 2 Nov 2016

Phil - iirc you had flags on their own which was an a11y failure for anyone
with colour issues. In this case that doesnt apply because of the
accompanying text.

I am more than happy to do a PR to address all of the fields but its a big
job and "if" j4 looks at these fields differently it would be wasted time

On 2 November 2016 at 17:53, Phil Taylor notifications@github.com wrote:

seems Im not the only one that gets ignored #11271
#11271

A search on red or green reveals lots of previous issues...


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#12704 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABPH8bmHSJsKJN8js9E5aDAf51p0gvXRks5q6M4fgaJpZM4KnY4K
.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
https://brian.teeman.net/ http://brian.teeman.net/

avatar C-Lodder
C-Lodder - comment - 3 Nov 2016

Better?

screeny

avatar mbabker
mbabker - comment - 3 Nov 2016

My first reaction is that grey makes it look like that field is disabled. The blue side's fine.

avatar C-Lodder
C-Lodder - comment - 3 Nov 2016

better?

screeny2

avatar mbabker
mbabker - comment - 3 Nov 2016

Works for me.

avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

The problem with moving from green/red to different colours is that there is no conveying of what the "sensible default" (green) should be....

for example, in your latest example, the site owner has no clue that URL Rewriting's sensible default is Yes... and so is not guided or educated on best practice....

see my edit which was:

[Edit] To be clear:

Its all over the place - these were just two examples.

The "good long, term option, the one thats recommended and sensible" should always be green.

Anything "thats out of the ordinary, that you would be MAD to leave in that state" should be red.

A choice of two equally acceptable options, should not be a green/red choice at all.

avatar brianteeman
brianteeman - comment - 3 Nov 2016

I agree with Phil - the colour should have meaning

On 3 November 2016 at 14:55, Phil Taylor notifications@github.com wrote:

The problem with moving from green/red to different colours is that there
is no conveying of what the "sensible default" (green) should be....

for example, in your latest example, the site owner has no clue that URL
Rewriting's sensible default is Yes... and so is not guided or educated on
best practice....

see my edit which was:

[Edit] To be clear:

Its all over the place - these were just two examples.

The "good long, term option, the one thats recommended and sensible"
should always be green.

Anything "thats out of the ordinary, that you would be MAD to leave in
that state" should be red.

A choice of two equally acceptable options, should not be a green/red
choice at all.


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#12704 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABPH8cNV8CHKGFb7Nj8aqmtGPMBJivxJks5q6fXMgaJpZM4KnY4K
.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
https://brian.teeman.net/ http://brian.teeman.net/

avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

The issue opened here was not to "stop" using green and red - the issue was that the color should be appropriate to the toggle and convey the status.

avatar PhilETaylor PhilETaylor - change - 3 Nov 2016
Title
Stop using Red/Green backgrounds on toggle switches
Toggle switches color backgrounds should guide use of the sensible default
avatar PhilETaylor PhilETaylor - edited - 3 Nov 2016
avatar PhilETaylor PhilETaylor - change - 3 Nov 2016
Title
Stop using Red/Green backgrounds on toggle switches
Toggle switches color backgrounds should guide use of the sensible default
avatar C-Lodder
C-Lodder - comment - 3 Nov 2016

In which case someone will have to go through every parameter in Joomla and determine if it's a "good, term option" or "out of the ordinary".

Also, lets say you have 2 parameters, 1 below the other. The 1st one is an ordinary one (blue/grey) , and the secondary one is a bit more critical (green/red). Having different colour sets for elements that serve the same purpose is something I'm not a fan of.

avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

In which case someone will have to go through every parameter in Joomla and determine if it's a "good, term option" or "out of the ordinary".

YES exactly my point!

avatar C-Lodder
C-Lodder - comment - 3 Nov 2016

We IMO that's goes against visual consistancy.

Not saying these will be the colours for these parameters, but here is an example:

screeny

avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

Im not saying I have the answers...

But these cannot be acceptable (just two examples)

  • Site Offline set to YES gives a GREEN background, green implies Good/Sensible/Default/OK
  • Debug System set to YES is a GREEN background, green implies Good/Sensible/Default/OK
avatar dgt41
dgt41 - comment - 3 Nov 2016

How about:
screen shot 2016-11-03 at 17 20 25

avatar andrepereiradasilva
andrepereiradasilva - comment - 3 Nov 2016

IMHO we cannot blindly add Green/Red buttons to all Yes/No, it always depends on the context of the button.

BTW https://en.wikipedia.org/wiki/Red#Warning_and_danger

avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

@dgt41 No - because, again, there is no guidence or education on best practice....

@andrepereiradasilva exactly - someone needs to look at EVERY toggle and ensure the CONTEXT of red/green is correct

IMHO we cannot blindly add Green/Red buttons to all Yes/No, it always depends on the context of the button.

But this is exactly what Joomla is currently doing :-(

Example of a block where neither option should be red/green as it really doesnt matter which a site admin chooses:

screen shot 2016-11-03 at 15 20 46

Example of a block where the current RED makes no sense in context and should be changed:

screen shot 2016-11-03 at 15 23 18

and

screen shot 2016-11-03 at 15 23 55

avatar brianteeman
brianteeman - comment - 3 Nov 2016

I am happy to do the hard (boring) work of reviewing all the options and
making any changes but I'd like to see them defined first.

For example
red for no/warning
Green for yes/recommended
Blue for neutral

avatar C-Lodder
C-Lodder - comment - 3 Nov 2016

Quote from @crystalenka

So, as with anything, the only way to tell for sure is to user test, but my hunch is that using so many colors, especially side by side, would be confusing for a user because they might not understand that some of these are "critical" let alone what "critical" even means. That holds no context for most users.

If, on the other hand, you were to separate the "critical" settings into another section, you may get away with using different colors for that vs other settings. But as-is I'd advise against it.

As long as it is clear in context when something is switched on or off, and it's consistent with the rest of whatever this is, then I don't think it matters much. A/B test that if possible.

There's a subtle difference between red/green cues and blue/grey cues:
blue/grey to me indicates "enabled/disabled", vs red/green is more "positive/negative", but that's just opinion. That would also benefit from A/B or general user testing

I don't think it would impact usability in a major way, as long as it's consistent with itself

avatar ggppdk
ggppdk - comment - 3 Nov 2016

This was posted above, it is close to what some android 5 (skins)

close_to_android

a kind gray for "OFF" option (but see my comment below, it has differences) and a kind of blue for enabled or similar color

Only in -all- android skins

  • OFF option for them is at the left (i use this approach)
  • OFF option (when it has text) is reversed to have font-color white in darker gray background (i am using this too)

now i use green for enabled and kind of ocean blue of "peers" settings (that do no have a "OFF" option)

But it is good to -avoid- many colors in configuration lists, unless really needed, it is tiresome and confusing ! , for options that should be enabled temporarily use darkorange

So my suggestion is

  • for both enabled and "peer" settings use same color,
  • and a reversed gray for "OFF" setting that does not look like disabled (we can add a proper opacity setting to clearly show a disabled option (or a disabled -set- of options)
  • and darkorange for rare settings like DEBUG being enabled, or site being offline
avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

Going around in circles here... wish people would read...

@ggppdk Grey/Blue doesnt give any helpful indication of best practice/sensible default/long term setting.

avatar C-Lodder
C-Lodder - comment - 3 Nov 2016

Ok so it's simply a matter of using btn-group-reversed in the correct places.

Initial title ("Stop using Red/Green backgrounds on toggle switches") was misleading, hense the "going round in circles"

avatar mbabker
mbabker - comment - 3 Nov 2016

You can't indicate best practice though simply with the color of the option. Honestly, I'd say it's difficult to do that with a UI on its own; this gets into an area where you should be referring to documentation for best practices. The best we can do is ensure the UI is consistent in how options are rendered (so the blue/grey would probably be better for that as noted above) and ensure the options have sensible defaults for the 80%.

avatar crystalenka
crystalenka - comment - 3 Nov 2016

Okay so seeing the rest of this thread I'd like to expand on my comments to @C-Lodder above.

The problem that it seems we are trying to solve is how to advise a user on a recommended or default setting. The conversation so far is centered around color choice, but is there a better way to go about this?

Aside from color, potential solutions may be found in looking at how settings are organized - should "critical" and non-critical settings really be grouped side-by-side? Is there a better way to organize it?

If a user switches a critical setting, should a (subtle?) warning display and tell them of the consequences of this setting?

These are just a couple of offhand ideas - just to illustrate that we should consider looking beyond color indicators and towards other solutions as well.

avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

You can't indicate best practice though simply with the color of the option.

By using red/green Joomla is already - unwittingly - doing that.. thats the whole point im making. Joomla is currently saying "its GREAT/OK/DEFAULT/SUCCESS/GREEN that you have set your site offline"

avatar mbabker
mbabker - comment - 3 Nov 2016

We agree there. But I don't think we should be relying 100% on the color schema to communicate this going forward (4.0; we've had this for so long that I think a major change to the palette in 3.7 would be too disruptive).

For now we just need to make sure things are flipped where they're currently weird (i.e. green site offline).

avatar dgt41
dgt41 - comment - 3 Nov 2016

The problem that it seems we are trying to solve is how to advise a user on a recommended or default setting.

@crystalenka the advise already exists, but is hidden most of times under a tooltip, so the problem is there not in the buttons. My 2c

avatar crystalenka
crystalenka - comment - 3 Nov 2016

@dgt41 It may exist but if we are still trying to find additional ways to communicate this to a user, it might not be not effective.

avatar dgt41
dgt41 - comment - 3 Nov 2016

Exactly that was my point, the problem is the tooltips not the colour of the buttons

avatar mbabker
mbabker - comment - 3 Nov 2016

We probably need to identify some options and instead of displaying the help text in a tooltip they'd be better suited displayed right under the option (Bootstrap's help-block). The tooltips should be helpful, but hiding everything in them doesn't help matters at all, especially for newer users who might not even be aware we have tooltips when they're first getting acquainted with the admin UI.

avatar infograf768
infograf768 - comment - 3 Nov 2016

Issue with help-block is that it doubles (at minimum as we have some long tips) the space used in the pages.
http://www.tutorialspark.com/twitterBootstrap/TwitterBootstrap_HelpBlocks.php

avatar mbabker
mbabker - comment - 3 Nov 2016

The help blocks don't have to be as verbose as the tooltips are. Where we need them, they should be clear and concise while staying short (still use tooltips for extended explanations and the help screen system and other docs for more).

avatar ggppdk
ggppdk - comment - 3 Nov 2016

Just my opinion

  1. Place OFF-setting to the left (ok this is debatable but i like android approach on this)
  2. Use a reversed gray for OFF
  3. Indicate rare settings that should be enabled temporarily like DEBUG, and like SITE Offline, with darkorange
  4. Indicate next to option-list a small note / warning , about what the curently enabled option will do (SHOWN needs to be improved, i already liked the [AND] [OR] thing ? of SHOWN and i am replacing my old implementation of similar thing)

I do not speak of the help-block, i speak of a help-tip appearing per option,
and the tip wraps to next row depending on available width

example

avatar PhilETaylor
PhilETaylor - comment - 3 Nov 2016

So this closed issue has forked into...

  1. Stop using RED in the wrong context for Joomla 3.6.x and 3.7
  2. Stop using RED/GREEN completely in Joomla 4.x
  3. Implement more helpful inline help blocks in Joomla... 3.7?
  4. everyone giving their fav colours (orange!? wtf!?)
avatar infograf768
infograf768 - comment - 3 Nov 2016

ROTFLOL

avatar mbabker
mbabker - comment - 3 Nov 2016

Seems fair. At least George will like the 4.0 backend if we go orange ?

avatar andrepereiradasilva
andrepereiradasilva - comment - 3 Nov 2016

?

Have to give my 2 cents too ? ... my suggestion, just a suggestion as i'm no usability expert, just what common sense tells me, is: get ride of green/red and use the enable/disabled logic (blue/grey or something) or we will always have scenarios like the one Phil identified (see another one here #12715). And then, and i tottally agree with Crystal, use another way (not colour) to inform the user of the recommend/critical settings.

Side note: nice to see this discussion. After all ... we are all also users and personnaly, i'm very interrested to see Joomla! more user centric. I see that as a huge step forward for the joomla project!

avatar brianteeman
brianteeman - comment - 3 Nov 2016

shouldnt this be something that the dedicated UX team works on - cough
cough -

On 3 November 2016 at 17:17, andrepereiradasilva notifications@github.com
wrote:

?

Have to give my 2 cents too ? ... my suggestion, just a suggestion as
i'm no usability expert, just what common sense tells me, is: get ride of
green/red and use the enable/disabled logic (blue/grey or something) or ww
will always have scenarios like the ones Phil identified (see another one
here #12715 #12715). And
then, and i tottally agree with Crystal, use another way (not colour) to
inform the user of the recommend/critical settings.

Side note: nice to see this discussion. After all ... we are all also
users and personnaly, i'm very interrested to see that Joomla! more user
centric. I see that as a huge step forward for the joomla project!


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#12704 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABPH8W_JPEFPNvo1GxN0konxNlTfMQ-oks5q6hc9gaJpZM4KnY4K
.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
https://brian.teeman.net/ http://brian.teeman.net/

avatar crystalenka
crystalenka - comment - 3 Nov 2016

@brianteeman I think it would be a great idea to get the UX team thinking about how to improve this for Joomla 4. :) With this much discussion, proper usability testing will be able to yield better answers than speculation ever could.

I don't know Cliff's github username, but maybe someone could tag him?

avatar C-Lodder
C-Lodder - comment - 3 Nov 2016
avatar cpfeifer
cpfeifer - comment - 7 Nov 2016

My feeling is the red and green are not appropriate in most cases. There is no "good" or "bad" setting in the examples above, they are personal preferences.

For example, I would never say it's "bad" to have linked article titles if someone wants to have them, or that it's "good" to have system debug on if you have no reason to use it. Personal preferences will vary between each user.

Out of all the examples in this thread, I feel this one from @dgt41 is the most suitable for most cases. #12704 (comment) because it's an arbitrary color with no preference given to one side or the other.

avatar cpfeifer
cpfeifer - comment - 7 Nov 2016

Just a follow up thought: if there is any emphasis given on these types of settings, it should be on the Use Global. We need to encourage users to use the global settings more and make individual settings only when necessary.

Inheritance is a powerful feature of Joomla that is misunderstood far too often, anything we can do to point people in the direction of using it properly is a good thing. Many end users don't understand how these setting relate to each other across the various sections, that's the major issue in my opinion.

avatar andrepereiradasilva
andrepereiradasilva - comment - 7 Nov 2016

BTW @cpfeifer in case you don't know there was a PR merged to show what is the global option for 3.7.0 #11911

avatar cpfeifer
cpfeifer - comment - 7 Nov 2016

Thank you @andrepereiradasilva, I had not seen that, but it's along the lines of what I've been thinking would be a good solution. I'll review it in detail as soon as I can.

avatar franz-wohlkoenig
franz-wohlkoenig - comment - 11 Mar 2019

Above Comment looks like Spam. @infograf768

avatar infograf768
infograf768 - comment - 11 Mar 2019

It is. I blocked the user and asked maintainers to take care further of this spammer.

avatar franz-wohlkoenig
franz-wohlkoenig - comment - 11 Mar 2019

thanks @infograf768

Add a Comment

Login with GitHub to post a comment