10 replies [Last post]
Charles Anthony
Offline
newbie
Last seen: 15 years 21 weeks ago
Joined: 2005-05-26
Posts: 5
Points: 0

I want to be able to be able to print my web page:
www.ottawalivemusic.com/map
and the map contained therein.

When I Print Preview or Ctrl+P from the browser (both Mozilla and MacIE), the image of the map dissappears. What am I doing wrong?

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 13 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

can not print image from browser

The map is a huge png image embedded in Javascript - you're asking for trouble there in so many ways, although it works okay on FF_Mac Smile

Life's a b*tch and then you die!

antibland
antibland's picture
Offline
Leader
Pittsburgh
Last seen: 11 years 41 weeks ago
Pittsburgh
Joined: 2005-01-17
Posts: 603
Points: 0

can not print image from browser

The default setting in these browsers is to not print background images. Users will have to go into the Page Setup section within Print Preview to allow for these images to print.

- Antibland

Charles Anthony
Offline
newbie
Last seen: 15 years 21 weeks ago
Joined: 2005-05-26
Posts: 5
Points: 0

RE: can not print image from browser

Thank you, AntiBland! That was confusing me for a long time. I had no idea what to tell people when they said they can not print the map.

antibland wrote:
The default setting in these browsers is to not print background images.

To work around this common browser default, it seems like I should try to redesign my CSS-only / non-

roytheboy wrote:
embedded in Javascript
image rollover so that it is not based on a background image.

antibland wrote:
Users will have to go into the Page Setup section within Print Preview to allow for these images to print.

Alternatively, I could explain to users (just as you did) how to go into Page Setup and allow background images to print. However, it would be best if my CSS and XHTML code made it more automatic for the user.

antibland
antibland's picture
Offline
Leader
Pittsburgh
Last seen: 11 years 41 weeks ago
Pittsburgh
Joined: 2005-01-17
Posts: 603
Points: 0

Re: RE: can not print image from browser

Charles Anthony wrote:
Thank you, AntiBland! That was confusing me for a long time. I had no idea what to tell people when they said they can not print the map.

antibland wrote:
The default setting in these browsers is to not print background images.

To work around this common browser default, it seems like I should try to redesign my CSS-only / non-

roytheboy wrote:
embedded in Javascript
image rollover so that it is not based on a background image.

antibland wrote:
Users will have to go into the Page Setup section within Print Preview to allow for these images to print.

Alternatively, I could explain to users (just as you did) how to go into Page Setup and allow background images to print. However, it would be best if my CSS and XHTML code made it more automatic for the user.
Everything you've said makes sense. I restrict my background images to those not intended to survive in the print realm.

- Antibland

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 13 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

can not print image from browser

Styling is eye candy - content is the meat in the sandwich. Don't treat content as though it was styling.

Life's a b*tch and then you die!

Charles Anthony
Offline
newbie
Last seen: 15 years 21 weeks ago
Joined: 2005-05-26
Posts: 5
Points: 0

RE: can not print image from browser

As previously noted, the content of this webpage is a cartographical map.

roytheboy wrote:
Styling is eye candy - content is the meat in the sandwich.

Cartographical information can only be conveyed to the user visually.

roytheboy wrote:
Don't treat content as though it was styling.

I look forward to more practical advice on separating style from content in this case.

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 13 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Re: RE: can not print image from browser

Charles Anthony wrote:
I look forward to more practical advice on separating style from content in this case.

The map is 100% content and should therefore be placed on the page as an image element in its own right - not as a background image that is subject to the user having javascript enabled (which is what you might do for styling graphics). Is that any clearer? Smile

Edit: Oh, and by the way: at a stagering 670kb the graphic is waaaaaaaaaay too big for the web. You're trying to be too clever for your own good!

Life's a b*tch and then you die!

Charles Anthony
Offline
newbie
Last seen: 15 years 21 weeks ago
Joined: 2005-05-26
Posts: 5
Points: 0

RE: can not print image from browser

roytheboy wrote:
placed on the page as an image element in its own right - not as a background image that is

My redesign will focus on making the map an image element. Any recommendations on how to get there?

roytheboy wrote:
subject to the user having javascript enabled

What JavaScript? There is no JavaScript on that page. Turn scripting off and see how the image rolls over.

roytheboy wrote:
at a stagering 670kb the graphic is waaaaaaaaaay too big

Alas, it is. Once the more important coding is complete, it is a simple matter to reduce the final resolution of the graphic to speed up loading.

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 13 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

can not print image from browser

I was doing too many things at once when I glanced at your page, and then confused it in my mind with another site - sorry :oops:

I actually don't like the overall effect of the map and it's rollovers - it's too fussy and difficult to make out. If it was me, I'd stick to a basic but clearly readable map and if you must have rollovers, you could try a good old-fashioned image map I think, although I haven't a clue if such things validate nowadays! I'm sure some others will chip in with ideas involving absolutely positioned divs that 'unhide' in response to curser co-ordinates.

As for the image size: your current methodology is not exactly helping with the file-size!

Life's a b*tch and then you die!

Charles Anthony
Offline
newbie
Last seen: 15 years 21 weeks ago
Joined: 2005-05-26
Posts: 5
Points: 0

RE: can not print image from browser

I think I have done it!

1) I have added the plain map image as a separate element as was suggested. The same CSS image rollover now occurs directly on top of the plain map image.
Thus, if a browser is set by default to NOT PRINT background images (the rollover is the background image), the user will print the map image element.
If the browser is set automatically to PRINT background images, the portion of the rolloever which lies over top of the plain map is transparent anyway.

2) I have severely reduced the size of the image files to speed up loading.

Everything still validates.