Re: solarized

[Protesilaos Stavrou <info@protesilaos.com>]

Yuri Khan <yuri.v.khan@gmail.com> [2020-09-15, 16:14 +0700]:

> On Tue, 15 Sep 2020 at 15:44, Protesilaos Stavrou <info@protesilaos.com> wrote:
>
>> Solarized fails on the accessibility front (not its designer's fault, as
>> that was not its goal).  Many colour combinations are well below the
>> minimum 4.5:1 threshold.  The following table shows the relative
>> luminance of all colours of the palette compared with the four base
>> background values (table's image with colour previews also attached).
>
> A color theme does not have to provide 4.5:1 contrast for each-to-each
> color combination. Only for those that are actually used to display
> text.

Correct.  We are concerned with foreground+background combinations.
Those of designated background values are to be excluded.  Basically
every entry that approximates a 1:1 contrast ratio.

>> | SOLARIZED | HEX     | #002b36 | #073642 | #eee8d5 | #fdf6e3 |
>> |-----------+---------+---------+---------+---------+---------|
>> | base03    | #002b36 |         |         |   12.25 |   13.92 |
>> | base02    | #073642 |         |         |   10.61 |   12.05 |
>> | base01    | #586e75 |         |         |    4.39 |    4.99 |
>> | base00    | #657b83 |         |         |    3.64 |    4.13 |
>> | base0     | #839496 |    4.75 |    4.11 |         |         |
>> | base1     | #93a1a1 |    5.61 |    4.86 |         |         |
>> | base2     | #eee8d5 |   12.25 |   10.61 |         |         |
>> | base3     | #fdf6e3 |   13.92 |   12.05 |         |         |
>> | yellow    | #b58900 |    4.68 |    4.05 |    2.62 |    2.98 |
>> | orange    | #cb4b16 |    3.26 |    2.82 |    3.76 |    4.27 |
>> | red       | #dc322f |    3.25 |    2.81 |    3.77 |    4.29 |
>> | magenta   | #d33682 |    3.30 |    2.86 |    3.71 |    4.21 |
>> | violet    | #6c71c4 |    3.43 |    2.97 |    3.57 |    4.06 |
>> | blue      | #268bd2 |    4.08 |    3.53 |    3.00 |    3.41 |
>> | cyan      | #2aa198 |    4.75 |    4.12 |    2.58 |    2.93 |
>> | green     | #859900 |    4.69 |    4.06 |    2.62 |    2.97 |

Thanks for clearing the table: easier to read!  Still goes to show that
several combinations are not accessible.  Those could be tweaked a bit
while retaining the overall aesthetic of the colour scheme.  Though that
is another subject altogether.  My intent is to bring the accessibility
angle into this discussion.

> Also, Solarized picked a design decision of using the same accent
> colors against dark and light backgrounds.

I did note as much in my original message.  Solarized is among the best
in what it tries to do.  Ethan Schoonover did not design for the WCAG
standard here considered, so this is not a critique against that work.
Just a suggestion that we do not need to faithfully follow the original
Solarized.

> This makes it hard to satisfy the 4.5:1 requirement, because if accent
> is at least 4.5:1 to darkest and lightest is at least 4.5:1 to accent,
> then lightest must be at least 20.25:1 to darkest, and the chosen
> Solarized lightest and darkest do not satisfy that. So, within the
> given limitations, Solarized does well enough.

I agree.  It is practically impossible to design for accessibility using
colours that are equally accessible on light and dark backgrounds, while
also remaining fairly distinct between themselves.  The background has
to be a given, so that all foreground values can be selected
accordingly.  When in doubt, assume a pure black/white backdrop and
strive for a high contrast against it, while also leveraging the ability
of 'defface' to assign attributes to a given display spec.

The 16-colour palette that has to work on both light and dark
backgrounds is a constraint that Emacs' defface can circumvent.  An
excerpt from 'M-x find-library faces':

(defface link
  '((((class color) (min-colors 88) (background light))
     :foreground "RoyalBlue3" :underline t)
    (((class color) (background light))
     :foreground "blue" :underline t)
    (((class color) (min-colors 88) (background dark))
     :foreground "cyan1" :underline t)
    (((class color) (background dark))
     :foreground "cyan" :underline t)
    (t :inherit underline))
  "Basic face for unvisited links."
  :group 'basic-faces
  :version "22.1")

If one really wants to keep it to 16 colours, then maintain two sets of
them.  One for dark, another for light.  And keep accessibility in mind.


-- 
Protesilaos Stavrou
protesilaos.com