Re: website: background color in css

[Arne Babenhauserheide]

Am Montag, 16. November 2009 23:07:33 schrieb Michal Suchanek:
> It's not all or none. You can use different text style and size,
> alignment, spacing, borders, ... and colors.
> 
> But whenever you touch an aspect of the site, be it colors, text
> style, or anything else you must ensure that it works as intended with
> various reasonable defaults. This is not limited to colors.

The *reasonable* is the key: You can define everything, but you can also try to 
make your site adjust to the user-style as much as possible without losing 
"identity". 

Take the example of margins: If you add a little margin for list elements, so 
they have a bit higher spacing, and you want to make it perfect, you have to 
explicitely set the margin for every single html element you use - including 
<em> and similar. 

In a language written for being used that way, you'd likel yhave a margins 
element which includes all elements which have a margin by default (or rather 
all elements which can have a margin). Whenever you wanted to change one 
element, you'd then copy the whole margin element into your custom file and 
adjust the defaults where needed. 

The same goes for color elements: You'd have a color config file with all the 
defaults in it. That way when you'd set one color, you'd auomatically also 
define the defaults for every element on your page. 

But in css you define only what you want different from the default. 

> And best of all, neither the colors nor the font will be visible in
> most text-only browsers.

:)

> > That even goes for "when you use a picture you have to define all
> > colors".
> 
> And how do you make a picture without defining all colors?

You define an image which goes well with most settings. 

No (static) image will ever go well with every color, but they are elements 
you can't get rid off by using a custom style sheet, because they are often 
site-content. 

(and it gets even worse, because not all browsers and not all *monitors* 
interpret css colors exactly the same way - sites can look vastly different on 
a Mac and a GNU/Linux machine)

> The ultimate here are SVG pictures that can be styled with CSS to
> match your site style completely but few browsers support them well at
> this time.

That sounds great! 

I hope I'll see them become standard! 

> > It's prefectionism which makes life harder for everyone who writes a
> > website.
> 
> Yes, as I said, making things correctly might seem too extreme to some.

It depends on what the effects of doing it correctly are. 

HTML grew mostly organically with some cancer in it (IE), so as I said, the 
"correct" way can stifle quite a few options. 

> Unfortunately, most web authors want to set off their web site by
> choosing their own color theme for it.

IIRC most default Drupal pages do it by your standard. Example: http://1w6.org

Might be related to the default theme being done by a professional designer :) 

> Nonetheless, if they do that correctly I can read their site and tell
> it apart from other sites at a glance, even at the cost that the color
> theme might not be one I prefer. When the site in question is
> something I am going to use more often and does not offer an
> alternates style I like better I can always use options my browser has
> for restyling sites.

It sounds like it would be nice to have a shortcut/button to do that restyling 
with least effort - after all you might need it for 50% of the (new) sites you 
visit. 

> > * No custom color
> > * One or several completely defined colorsets
> 
> Yes, that are color options. A site is not just colors, you know.

I thought we were only talking about colors, so I thought that I might have 
missed an option. 

> How do you define readability so that it can be prescribed by a standard?
> 
> The readability of a text does not depend on color contrast only, it
> is affected by text size, monitor quality and settings, ambient light,
> reader condition, etc.

Setting a minimum size is already possible (at least in Konqueror) and sizes 
can easily be adjusted in steps. 

But color has nothing similar yet. 

I'm pretty sure that designers already have tables which show which colors 
really don't work together. So a viable strategy could be: 

        If a foreground color "disharmonizes" too strongly with 
        a background color *set by the other style* (user/system)
        select the foreground color from the style which 
        defines the background color. 

"Disharmonizes" defined by "is in the table as really not working together with 
the background". 

> The defaults don't depend on the web rendering library used. They are
> set in the topmost part of the application which is subject to change
> between browsers based on the same rendering library. Some might even
> attempt to set the defaults based on the system color theme.

As Konqueror does :) 

When I first switched to a dark background, I began the quest to a color which 
works with most color schemes but doesn't force me to enforce the background 
color - I got one step closer to it today. 

Many thanks! 

> No, I define "right" as "50% which works with any setting".

OK. 

> I can give you my color theme but there's bound to be more possible
> color combinations that you did not test. Good luck with testing all
> themes ever published.

That's clear. Since I don't go for the all or nothing approach, the sites are 
bound to be imperfect. 

> *background: #2f4f4f
> *foreground: #f5deb3

Many thanks! 

I did some experimentation and brightened up the color. The site should be a 
bit nicer to read for people with dark green background now: 
- http://draketo.de/licht-lumo-light

Best wishes, 
Arne

signature.asc
Description: This is a digitally signed message part.