Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Dear web developers: set the font color, too

luu.io

Post reply on HN
Print view View original

71–80 of 151 posts

Re: Dear web developers: set the font color, too

#71

Post by a1369209993 »

LoSboccacc wrote: post #42
mrspeaker wrote: post #33

Earlier quoted context omitted.

I don't want low contrast, I just wanted to swap my browser default foreground/background colors (low brightness is just my hacky workaround). The "bug" on these sites is that if devs set a default background-color they should also set a default font color: either set neither properties, or set both. Setting one means the default of the browser will be used. Most of the time it's background=white, foreground=black, s…

> I don't want low contrast > I tried to eliminate white backgrounds, because I find it tiring on my eyes and a bit painful. yes, yes that's exactly what you want. besides you can tune both gamma and tone both in software and hardware on most platforms; this isn't rocket science people had the ability to tune the monitors to their liking since television had colors

No, they want[0] white text on a black background. That's not low contrast, that's high contast, unless you're suggesting a 'contrast' of -1.00, which is not what most people think of as "low contrast".

0: IIUC

Re: Dear web developers: set the font color, too

#72

Post by jolmg »

jmull wrote: post #68

I'm curious: what is environment for these tests? I want to reproduce to understand what's going on better. (For what it's worth, in 10 sec of testing Safari and Chrome on MacOS dark mode don't seem to have this issue... the font and background colors seem to still default to dark on white.)

It happens to me on Linux. I have GTK and QT configured with dark themes. To overcome this, I have to configure Firefox with a default styling in ~/.mozilla/firefox/*/chrome/userContent.css:

    input, button {
        -moz-appearance: none !important;
        background-color: white;
        color: black;
    }

    textarea {
        -moz-appearance: none !important;
        background-color: white;
        color: black;
    }

    select {
        -moz-appearance: none !important;
        background-color: white;
        color: black;
    }
Now that I look at it, I wonder why I didn't join all 3. Whatever.

Re: Dear web developers: set the font color, too

#73

Post by jameslk »

luuio wrote: post #64
jameslk wrote: post #60

Earlier quoted context omitted.

I agree we need to give accessibility more priority and we likely will once the discrimination lawsuits start rolling in. But this isn't an accessibility issue. Nowhere in WCAG 2 will you find anything that explicitly outlines both color and background color need to defined in stylesheets. This is for users who prefer dark themes who are overriding styles of websites incorrectly. It is a failing of the user's browser…

You got it backward. The custom CSS of the website is overriding the system styles in this case. Let's take font-family for example. Just because you're setting the font for your input[text] tags doesn't mean the browser will also automatically set the font for other elements to match the style. If you want the website to have uniform look, then you'll need to set the font-family for other elements, too.

This is really just the old debate of whether to use a reset css in disguise. It has nothing to do with accessibility.

Re: Dear web developers: set the font color, too

#74

Post by chriswarbo »

SquareWheel wrote: post #63
aboutruby wrote: post #54

Apple introduced Dark Mode expecting all major websites to maintain some CSS just for a small percentage of macOS users. I don't think it's going to happen (and it's not happening)

This comment intrigued me, so I did some digging. Looks like "prefers-color-scheme" is currently being considered by both Chrome[1] and Firefox[2]. A can-I-use page was just created for it[3]. I'm excited by this one! Think I'll add dark mode support to my simple blog right now. [1] https://bugs.chromium.org/p/chromium/issues/detail?id=889087 [2] https://bugzilla.mozilla.org/show_bug.cgi?id=1494034 [3] https://canius…

Wow, what an awful thing to standardise! Are there equivalents for high/low-contrast? Red themes, blue themes, multicolour themes, etc.?

Why layer something like this on top of an override system, when devs can choose to just not override those things?

As an example, the only CSS colours I use on chriswarbo.net are either semi-transparent, or mid-grey (which work on light and dark themes, although I might revisit that since it would presumably not work on default-grey systems like AmigaOS).

Re: Dear web developers: set the font color, too

#75

Post by a1369209993 »

jameslk wrote: post #51
luuio wrote: post #41

Earlier quoted context omitted.

> he author is using something that manipulates the style of inputs to make them dark with light fonts > just style both at the same time That's exactly the point. The system by default sets both colors, though most browsers I've used allow the website to override the colors. In these cases, the websites only override one but not the other.

The system is failing to override the styles. This is an issue with the system not using more explicit selectors or not taking into account that their selectors will be overridden. In other words, the system has failed you.

> The system is failing to override the styles.

I agree, but I think this could be phrased better: If the system is using a (light-foreground-on-)dark-background theme, it should force web pages to use a dark-background theme, no matter what CSS they have.

Re: Dear web developers: set the font color, too

#76

Post by Pfhreak »

krapp wrote: post #49
Pfhreak wrote: post #38

Earlier quoted context omitted.

I struggle with how low contrast it is. I skip 'Ask HN' style posts because they are too hard to read.

> I skip 'Ask HN' style posts because they are too hard to read. That's done on purpose to discourage people from posting (or reading) them too often. PG was afraid letting people write text posts would lead to "blogging."

Interesting. I mean, it works, I don't read those posts at all...

Re: Dear web developers: set the font color, too

#77

Post by jolmg »

jameslk wrote: post #35

I don't understand this article. The author is using something that manipulates the style of inputs to make them dark with light fonts... but only if the input isn't explicitly styled with either background-color or color . If they're going to be doing such hackery, just style both at the same time. Use JavaScript or something to ensure both are styled. This really isn't the developer's concern.

I think you're misunderstanding something, though I can't pinpoint what it is.

> The author is using something that manipulates the style of inputs to make them dark with light fonts

The author is setting his system theme to a dark one. Maybe you don't know what that is because such options seem to be disappearing, but a system theme controls the styling of (ideally) all GUI applications running in the OS. One of these applications is the web browser.

> but only if the input isn't explicitly styled with either background-color or color

No, themes set both. It's the web developer that overrode one but not the other and what the author is complaining about.

> If they're going to be doing such hackery, just style both at the same time.

This is precisely what the author wishes of web developers and their hackery. You're directing this suggestion to the wrong person. The author did set both when setting his system theme.

> Use JavaScript or something to ensure both are styled. This really isn't the developer's concern.

Again, the author did style both when setting his system theme. It's the web developer that is overriding the style of one but not the other.

Re: Dear web developers: set the font color, too

#78

Post by michaelmrose »

jameslk wrote: post #35

I don't understand this article. The author is using something that manipulates the style of inputs to make them dark with light fonts... but only if the input isn't explicitly styled with either background-color or color . If they're going to be doing such hackery, just style both at the same time. Use JavaScript or something to ensure both are styled. This really isn't the developer's concern.

The hackery is literally opening the users control center and clicking the icon for desktop theme and clicking on a different theme and clicking apply.

This sets the users desktop colors. Firefox will pick this up and use these colors for elements on the page unless these elements are explicitly styled by the developer.

So say the users theme specifies a grey or black background and white text. The developer wants a slightly different grey on the text but is ok with the default light background that developer assumes will show up.

Since the user specified a default color for the background and the developer did not we get a grey background. Since the developer selected a text color that takes precedence over the users selected color so we get grey text.

End result grey text on the grey background. There is no hackery. The user can't just style both because by design the developers choices are supposed to override defaults.

The user didn't do anything wrong. It is 100% the developers fault for explicitly specifying the color of the text and assuming (making an ass out of you and me) that the background would be a certain color because it is on their install of chrome. This is no different than assuming the users screen is a certain size. If you set the color of text just go ahead and actually specify the background color as well.

Re: Dear web developers: set the font color, too

#79

Post by alistairSH »

jameslk wrote: post #60
droobles wrote: post #3

Definitely agree accessibility is important going into 2019. Different users are going to be viewing a site with more screen readers, dark theme, and other alternative viewing options, very much like we saw with mobilegeddon and the advent of responsive design. I've seen the argument that this hurts the "intended web experience", but this can be solved by keeping up with modern CSS practices and crafting the experien…

I agree we need to give accessibility more priority and we likely will once the discrimination lawsuits start rolling in. But this isn't an accessibility issue. Nowhere in WCAG 2 will you find anything that explicitly outlines both color and background color need to defined in stylesheets. This is for users who prefer dark themes who are overriding styles of websites incorrectly. It is a failing of the user's browser…

Nowhere in WCAG 2 will you find anything that explicitly outlines both color and background color need to defined in stylesheets.

WCAG doesn't specify implementation, but WCAG 1.4.3 does require a minimum contrast ratio[0]. If the site allows black text on a black background, it will fail that requirement.

0 - https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-cont...

Post reply on HN