A LIST Apart: For People Who Make Websites

No. 144

Discuss: CSS Design: Going to Print

Pages

 <  1 2 3 4 5 >  Last »

21 Re: Print Links on Most Major Sites

“Print” pages also frequently let you escape wretched design. Unreadable color combinations usually go away, as do unreadable font sizes and unreadable line-lengths. Usually. Plus, you escape stupid animations.

Not to say, of course, that you shouldn’t use a print stylesheet, but that the benefits users will gain are likely to be more than offset by what we lose. I’ll remember the Print Preview trick mentioned above….

posted at 10:15 am on May 10, 2002 by John Robert Boynton

22 Re: Print Links

<quote>“Print” pages also frequently let you escape wretched design. Unreadable color combinations usually go away, as do unreadable font sizes and unreadable line-lengths. Usually. Plus, you escape stupid animations. </quote>

You can increase the user experience by including a style switcher. Plus, the whole point of CSS is that the user can control the experience and “escape wretched design” through an user style sheet. Basically, print pages always were a hack and still are. With proper CSS and actual standards-compliant Web browsers, we shouldn’t be indulging in kludges any more. Besides, the newer browsers are better for users anyhow.

posted at 10:49 am on May 10, 2002 by draca

23 Thanks, and some responses

Thanks for all the positive feedback, folks! I really appreciate knowing that articles like this are useful and interesting, and also what other questions people have about CSS. Here are my responses to a few.

“…I noticed when print previewing the page in Moz RC1 that there is a big URL that comes right after the image at the top of the story. That might be something that you want to fix.”

A couple of people commented on this. We left them in on purpose, because the image link contains a URL like any other. However, we could have avoided the HUGE TEXT problem using something like this:

h1 a:after {font-size: 50% !important;}

That would make the generated content half the usual size of ‘h1’ text when printed. Of course you could use whatever value you like. When Big Z gets back from his trip I’ll talk with him about whether or not we want to do that for the site’s print styles.

“…how do you get the long URLs to wrap? They’re busting my table width apart in the print out at the moment.”

As it turns out, that’s browser-dependent. Some browsers will line-wrap after a hyphen or slash, while others won’t. If yours won’t then you may want to stop trying to size a table to a certain width in print, or making the generated URLs use a smaller font size in print. As a last resort, you could class any link you don’t want to generate a long URL and write styles to prevent it.

“Theoretical CSS-3 to complete relative URIs that start with slashes and URIs that don’t… “

I think you’re close, but there are some cases that your rules wouldn’t cover. I’d really like to explore a comprehensive solution, but it would almost be an article in itself— which is why it doesn’t appear in the article I wrote. Still, I’m impressed; I didn’t think anyone was messing around with those CSS3 selectors, and it looks to me like you have a pretty good handle on how they work. That’s more than I can say about myself most days…

posted at 12:44 pm on May 10, 2002 by Eric A. Meyer

24 Thank you!

That was a great article – practical and helpful with some ideas that I had not considered before. I already had a print.css, but I have been back fiddling a bit more with it and it is now definitely better than it was. I particularly appreciated the tips about links – I didn’t even realise before that this was possible!

posted at 01:21 pm on May 10, 2002 by Jenny

25 Great Article

Great article, all ready knew about print css; but I did not know about “… a:link:after, #content a:visited:after { content: “ (” attr(href) “) “; …”

Could someone point me in the direction to find out about it and more.

posted at 03:24 pm on May 10, 2002 by Seamus

26 Information :after and so on

I can do that, albeit by pointing you to a piece of CSS2.

  • http://www.w3.org/TR/CSS2/generate.html

This is the section of CSS2 that describes generated content, which is how that URL insertion got done. Note that the section on counters and automatic numbering can be ignored, because no browser I know has implemented them correctly. Or at all.

posted at 04:23 pm on May 10, 2002 by Eric A. Meyer

27 Generated content supported by Opera!!

“Note that the section on counters and automatic numbering can be ignored, because no browser I know has implemented them correctly. Or at all.”

Are you joking?!!

Opera has had support for almost all of generated content for years! The only thing that it doesn’t have support for is generated objects (content: <uri>).

http://www.westciv.com/style_master/academy/browser_support/generated_content.html
(note that Opera 5 does support the attr() function, contrary to the chart)

posted at 08:16 pm on May 10, 2002 by Kevin W

28 Printing link urls

I wouldn’t recommend the extra space on the end of the paranthesis after printing links out. If the link is at the end of the setence it means you’ll get something like ‘…/page.html .’ Which looks a bit silly. All the links that are inline will already have spaces after them anyway, so I don’t see any point in that extra space. Apart from that, nice article.

Re: the content request. You can find out more about it in the CSS2 spec. It’s not too hard to read, particulalr,y I don’t think. http://www.w3.org/TR/REC-CSS2/generate.html

posted at 02:21 am on May 11, 2002 by Lachlan

29 I;m going to use this

Thanks, guys

I’m really going to use this – starting now. I’m finding so much of use in ALA I can’t begin to describe. . . Maybe I’ll catch up some day.

John

posted at 02:16 pm on May 11, 2002 by John Colby

30 But not all users are webmasters...

This is a great thing – the one with CSS print version of the page ;) But nobody mentioned that not all users that are browsing the web, are webmasters that know about CSS.
They will be still looking for the “click here for printer-friendly versionâ€? link. If there is none such link – they will propably not print the page. Or they will and they will be pleasantly surprised ;)

So i think that from now on i’ll use both of the options…

posted at 04:19 am on May 12, 2002 by edmund

Pages

 <  1 2 3 4 5 >  Last »

Discussion Closed

New comments are not being accepted, but you are welcome to explore what people said before we closed the door.

Got something to say?

Discuss this article. We reserve the right to delete flames, trolls, and wood nymphs.

Create a new account or sign in below if you’d like to leave a comment.

Remember me

Forgot your password?

Subscribe to this article's comments: RSS (what’s this?)