Displaying layouts/designs to clients

Russinating · 10 Jan 2011 at 13:00

What's the best way of display a layout/design of a website (in the form of an image) to clients? I used to do the background method but it doesn't work in IE (no scrolling) and a few people just see a blank screen for whatever reason (can't explain).

An example of the background method: www.jonesmillbank.com/vinofino. If you don't see anything then view source and tell me why!

What other ways are there that allow scrolling (ie not just a screenshot) and display it at the right size/position?

Tripnologist · 10 Jan 2011 at 13:06

Why not try dropping a div in there and attaching it to that?

Muel · 10 Jan 2011 at 13:08

Surely you could just insert it as an img tag?

Also, you have no closing </style> tag.

Snooble · 10 Jan 2011 at 13:10

Use div. Or can even use table background with the new HTML5 backgroundimage rules.

Cuchulain · 10 Jan 2011 at 13:10

Or create a div the same size as the background image and allow it to overflow. If you're designing for a living this is basic stuff you should already know.

Russinating · 10 Jan 2011 at 13:17

Tripnologist said:
Why not try dropping a div in there and attaching it to that?

Duh. Thanks.

Muel said:
Surely you could just insert it as an img tag?.

No, because the image is 3000 pixels wide.

Cuchulain said:
Or create a div the same size as the background image and allow it to overflow. If you're designing for a living this is basic stuff you should already know.

Always used the background method, but on my colleague's Safari he just gets a blank white page (not even coloured) which I've never seen before. And no, it's not for my living

.

simisker · 10 Jan 2011 at 13:34

This is going to sound more accusatory than I mean it, but: why are you showing images of sites to clients rather than the actual site itself?

Is it steal-code paranoia?

PMWD · 10 Jan 2011 at 13:36

Sometimes divs won't show unless you <div> </div> either

GravyMonster · 10 Jan 2011 at 13:43

simisker said:
This is going to sound more accusatory than I mean it, but: why are you showing images of sites to clients rather than the actual site itself?

Is it steal-code paranoia?

I'd guess because it's a photoshop mock up and has not actually been built yet.

Russinating · 10 Jan 2011 at 13:52

^^ Precisely

.

simisker · 10 Jan 2011 at 14:17

Russinating said:
^^ Precisely .

Fair enough

I keep forgetting that in-browser designers like myself are in the minority

Still, I'm not sure what this achieves over just giving them an image directly... but horses for courses etc.

Sp00n · 10 Jan 2011 at 14:43

We just send them a jpg.

Tripnologist · 10 Jan 2011 at 14:50

simisker said:
Still, I'm not sure what this achieves over just giving them an image directly...

I know many firms, ours included who do this because even though it's the same image, it always looks different seeing it in-browser.

Russinating · 10 Jan 2011 at 15:08

That and it instantly displays it at the right size and position and allows scrolling.

Sending a jpg means they'll either have white space at the sides, the center of the image will be offset to the right or they'll be previewing it smaller than intended.

GravyMonster · 10 Jan 2011 at 15:24

*edit*

Grabbed the wrong end of the stick and then proceeded to beat myself with it.

visibleman · 10 Jan 2011 at 18:24

Set the image as a background in a DIV is usually how i go about it. Although to get it to scroll correctly in IE i've always had to add the correct px height of the image to the div eg: height:1022px; instead of height:100%; (in this case).