Background image not displaying on some monitors Options

[runbanjorun]

Hello

I am using a dark/faint background image on a website and I have found that on some monitors it displays OK but on other monitors it is invisible and just shows as black. Adjusting monitor colour settings does not make any difference as the image does not appear to render at all.

Does anyone know what is happening ?

Here is the image:

http://bit.ly/1i7MLpN

[Christian J]

Are you sure it's due to the monitors, and not things like browsers, responsive CSS, etc?

[pandy]

Uhm, when I click your link I see an all black image. What am I supposed to see? I tried several recent browsers, so that's not it.

[Christian J]

The top/left diagonal half looks like a dark gray rock structure. The bottom right looks solid black.

I made a screenshot of a small part of the picture, to rule out any server-side browser sniffing:

[pandy]

I don't see that. Not in your screen cap either.

[pandy]

Here's a screen cap of your screen cap.



It doesn't matter what browser I use. Is it a matter of very small nuances in the blackish range? My screen doesn't have very good shadow contrast, but it's not so bad that that I normally notice.

[Christian J]

I can see the gray parts in your screenshoot too. Try using CPick or similar on it, and you should get color values like #070707.

How about using this CSS on a test page:

CODE

body {
color: #070707;
background: #000;
}

--can you make out the text?

[pandy]

I already did that. The pixels vary, but my vary little. I wrote it off to JPG compression. If I check a diagonal from top left to bottom right I get RGB values where each individual value varies from 0.0 to 2.7.

If the variation is that small it can very well be my and other people's screens.

[pandy]

How about using this CSS on a test page:

CODE

body {
color: #070707;
background: #000;
}

--can you make out the text?

No. If I concentrate I can see something is there, maybe, but not that it is letters and I need to really fix my eyes on the spot where I know the text should show up. Could just as well be that I trick myself into seeing "something". So basically no, I don't see it.

[pandy]

I fooled myself. I made the text bold and 500px. Don't see nothing. Crap screen, what can I say?

[Frederiek]

You need glasses

(Don't worry, I already wear them for reading, on screen too)

[pandy]

Me too. But you are right, it might be my eyes. I've had this problem with every screen I've owned except the very first one, a very crisp little CRT. Not that I ever have used a calibrated screen or anything like that, but I do the basic adjustments.

Anyway, eyes or screen, I don't think I'm alone in having this problem with shadow separation.

[Christian J]

I've had this problem with every screen I've owned except the very first one, a very crisp little CRT.

Newer IPS panels are said to give consistent viewing quality even at an angle (just like CRT monitors could always do). If you have an older flat panel maybe you're not looking at it from the "correct" angle.

I still use my decade old CRT.

[pandy]

Of course I do. It isn't old either, maybe 2 years. It's not top of the line but not bottom either, a BenQ.

I meant since I get this problem with all screens, maybe Frederieks joke is true, that it is my eyes. It doesn't matter, I think many screens have bad shadow separation to start with and that's also the area where most people's sight fails first. Together with that most people don't even calibrate their screens I don't think it's odd some people don't see that picture as intended.

[Frederiek]

Ambient light probably plays a role too, I suppose.

It's not too difficult to calibrate a screen. But you must have rather good eye sight. Fortunately my husband did it for me when I got a new screen

[pandy]

It is if the screen doesn't have the range. I tried with all my CRTs, manually only, never used any special equipment. If I got it right in the shadows it was off in the other end. I have a background in (hobby) photography, B&W, darkroom, that sort of thing. My screens behave exactly as photographic material. You can have good overall contrast and you can have either good shadow contrast or good highlight contrast, but both aren't technically possible. You have to make a choice or settle for something in-between. That's the way my screens are too.

But that image must be very dark even for you. Can't be much contrast there, according to the readouts I got.

[Christian J]

Yes, it's very dark. On my test page with plain text I can make out lines of text, but to actually read it I must stick my nose close to the monitor, and even then I can barely make out more than one word at the time. So in my case the monitor can handle it, but not my eyes. Maybe I need more vitamins.

Can you make out the whole chart at the bottom of this page: http://w4zt.com/screen/ ? I think I can, but when I made a test page I can only see dark text on lighter background:

CODE

body {
color: #050505;
background: #0f0f0f;
}

but not the other way around:

CODE

body {
color: #0f0f0f;
background: #050505;
}

The brightest colors in the chart (#fff and #f5f5f5) are much easier to tell apart on my test page.

[pandy]

No, I don't think so. Those strips are hard, they trick you. You know where the border should be between two zones and you think you see a line there.

[Christian J]

when I made a test page I can only see dark text on lighter background:

That was in daylight. Now that it's dark I have no problems reading it.

The brightest colors in the chart (#fff and #f5f5f5) are much easier to tell apart on my test page.

Again that was in daylight. Now that it's dark I can barely read the text.

The obvious solution here is for W3C to come up with an CSS "ambient-light" property, which gauges the ambience light through the user's web camera and adjusts brightness accordingly.

[runbanjorun]

Hello

Thank you for all the replies!

However I'm not sure what you are telling me ; Do I need to make the image lighter?