5

I'm guessing I should plan for low resolution and big fonts? Any good examples out there?

Improve this question

4 Answers 4

Reset to default
6

If your site has a high contrast accessible version (such as BBC sites do) you could likely use that and the principles they use to design for projectors. Try treating the projector like a user who can't see very well.

  • Use a dark background with light text, or a light background with dark text - anything with high contrast
  • Use big, bold fonts, preferably sans-serif so there aren't any details that might make the font harder to read
  • Zoom in by using CSS rules, or just increasing the size of everything in a separate stylesheet
  • Customise the mouse pointer using CSS so it's easier to see when moving around in low contrast. The black cursor on Mac OS X is great for this.

See the BBC's Accessibility guidelines for more info.

Improve this answer
2
  • Is there a way to detect that the page is being projected? Or is it ok to have a "projector mode" button on the page?
    – jiggy
    May 16, 2011 at 15:45
  • 1
    CSS2 specifies "projection" as a media type you can map styles to, browser support appears to be spotty. If not you could just put a button in there.
    – Rahul
    May 16, 2011 at 15:49
5

Projectors usually have quite a bad contrast ratio, so you should have hard contrasts and you shouldn't use any soft colors or gradients (they can look really nasty on projectors).

Hope that helps, Phil

Improve this answer
3
  • 1
    Absolutely! I have battled endlessly with projector colors... Try using simple "bold" colors, as the projectors tend to render them that way regardless. For example, if you used a shade of red, it will most likely project as the most obnoxiously bright red possible. Good luck!
    – Matt Rockwell
    May 16, 2011 at 15:29
  • 1
    Yeah me too, bad memories... presentations at customer's place ("Actually this shouldn't look like this at all..."). Argh!
    – Phil
    May 16, 2011 at 15:31
  • On a related note, a lot of DLP projectors make the color red look horrible.
    – Rain
    May 16, 2011 at 17:20
2

Orange and brown especially can look like feces.

General rule of thumb is to use highly contrasted colors. Dark on light (text) and vice versa. Avoid the light blue on a dark blue, etc.

Improve this answer
2

If you plan on using soft colors and gradients, consider having a few print outs of the intended color, so that if and when it is rendered horribly, you can show them what it should actually look like.

Edit: Also if you have the luxury of using the projector a few minutes before the presentation, adjust its contrast, brightness and color setting if available, they are usually set to high contrast values.

2nd Edit: After learning this is a site to be mainly used on projectors, I would suggest using black and white, along with 1 bold color, to minimize the amount of poor rendering present.

Improve this answer
1
  • This isn't for a demo, I'm actually targeting projectors as a main channel for viewing the site.
    – jiggy
    May 16, 2011 at 15:39

Not the answer you're looking for? Browse other questions tagged or ask your own question.