css print styles

Discussion in 'HTML' started by Tim W, Nov 20, 2013.

  1. Tim W

    Tim W Guest

    I am looking at a css labelled 'HTML5 Boilerplate styles - h5bp.com
    (generated via initializr.com' There is a section headed 'Print styles'
    beginning '@media print {'. istm it is making a bit of a mess of
    printing my pages. In particular

    a[href]:after {
    content: " (" attr(href) ")";
    }

    prints the full url of every link including the internal menu links and
    all the text is made black.

    I know I can edit the css how I want but before I do are there
    conventions in print styles? Are there rules I should retain for a
    reason? Do users expect any particular changes when printing? Or shall I
    just do my own thing with it and make a guess at what someone might need
    on a printed page? ATM for instance the nav takes up half the first side
    of A4 with each item written out in full. I am thinking I might just
    remove the nav altogether from the printed page.

    tim W
     
    Tim W, Nov 20, 2013
    #1
    1. Advertising

  2. 2013-11-20 18:02, Tim W wrote:

    > I am looking at a css labelled 'HTML5 Boilerplate styles - h5bp.com


    HTML5 Boilerplate can be a good tool for experienced authors and
    developers, but it has pitfalls and risks when people use it without
    understanding and revising the details. Much like FrontPage once was. :)

    > (generated via initializr.com' There is a section headed 'Print styles'
    > beginning '@media print {'. istm it is making a bit of a mess of
    > printing my pages. In particular
    >
    > a[href]:after {
    > content: " (" attr(href) ")";
    > }
    >
    > prints the full url of every link including the internal menu links and
    > all the text is made black.


    Making all text black is generally a good idea in a print style sheet,
    since you should expect the page to be printed on a grayscale printer.
    Black is better than various shades of gray, as a rule.

    Putting URLs after links is much more questionable, and a poor idea in a
    general-purpose boilerplate. The general principle is that the URL of
    the *page* should be present in print copies (and the browser should
    normally take care of this), so that the user can access the page
    online, and then any links there.

    HTML5 Boilerplate explicitly makes links underlined in print.
    Underlining is the default, but I think they expect authors to remove
    underlining in their style sheets, as they often do. This is rather
    paradoxical: why remove to visual clue of linkness on screen where links
    can be clicked on, but retain it in print copies, where no clicking will
    work?

    One might ask whether it is necessary at all to have any special
    rendering for links in print media. The answer is absolutely "it
    depends". Many page look too foolish if links appear as normal text. And
    I don't mean just silly links like "here" or "click here".

    One possibility is to include an arrow symbol before a link, with
    something like the following (in a print style sheet):

    a { color: black; background: white; text-decoration: none }
    a:before { content: "\2192" }

    (Caveat: If you use the Calibri font, you have a problem with the arrow:
    it looks awful. There's a partial @font-face fix to this.)

    > I know I can edit the css how I want but before I do are there
    > conventions in print styles?


    Not really. Authors mostly don't care about them. Developers care even
    less, I'm afraid.

    > Do users expect any particular changes when printing?


    No, but making suitable changes is a good idea anyway.

    > Or shall I
    > just do my own thing with it and make a guess at what someone might need
    > on a printed page?


    Yep.

    > ATM for instance the nav takes up half the first side
    > of A4 with each item written out in full. I am thinking I might just
    > remove the nav altogether from the printed page.


    Right. A printed page needs a header that identifies what the page is,
    like site logo or name and a page heading, little less.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
     
    Jukka K. Korpela, Nov 20, 2013
    #2
    1. Advertising

  3. Tim W

    dorayme Guest

    In article <l6j4g2$h2e$>,
    "Jukka K. Korpela" <> wrote:

    > HTML5 Boilerplate explicitly makes links underlined in print.
    > Underlining is the default, but I think they expect authors to remove
    > underlining in their style sheets, as they often do. This is rather
    > paradoxical: why remove to visual clue of linkness on screen where links
    > can be clicked on, but retain it in print copies, where no clicking will
    > work?


    Perhaps a little paradoxical, but maybe there is some reasoning behind
    it? Obviously, retaining it in print form lets the reader know where
    the links are (though perhaps there can be confusion when non-links
    are underlined for other emphasise purpose). In print form, in
    greyscale, there is no other natural clue as on screen, no hand cursor
    to test for when the reader smells a clue...

    --
    dorayme
     
    dorayme, Nov 20, 2013
    #3
  4. 2013-11-20 23:39, dorayme wrote:

    > In article <l6j4g2$h2e$>,
    > "Jukka K. Korpela" <> wrote:
    >
    >> HTML5 Boilerplate explicitly makes links underlined in print.
    >> Underlining is the default, but I think they expect authors to remove
    >> underlining in their style sheets, as they often do. This is rather
    >> paradoxical: why remove to visual clue of linkness on screen where links
    >> can be clicked on, but retain it in print copies, where no clicking will
    >> work?

    >
    > Perhaps a little paradoxical, but maybe there is some reasoning behind
    > it?


    Surely. HTML5 Boilerplate has a lot of reasoning behind it, but some
    parts are questionable. Showing the URLs is. Underlining links is more
    debatable.

    > Obviously, retaining it in print form lets the reader know where
    > the links are (though perhaps there can be confusion when non-links
    > are underlined for other emphasise purpose). In print form, in
    > greyscale, there is no other natural clue as on screen, no hand cursor
    > to test for when the reader smells a clue...


    Well, you could use gray color. But the question: do you need to know
    what texts are links, when reading a print copy? Isn't it rather
    disturbing, really? What would you do with the information?

    Sometimes you might think that a link looks interesting and decide to
    follow the link when you view the page online. Well, mostly you would
    just forget to do that.

    I'm not saying that link indicators are always useless or worse on
    printed pages. But I think that we should normally expect that links can
    appear as normal text in print copies. (If the text is not useful, then
    you should perhaps omit the link entirely on printing - I'm mainly
    thinking of navigational links.)

    Let's call this unobtrusive linking. You write some text, make sure that
    it makes sense as it is, then possibly turn some pieces of text into
    links. So you could write "During my visit to Portugal, I..." and then
    turn "my visit to Portugal" to a link, if you have something to link to.
    Alternatively, and often better, you would leave the text as is but
    append e.g. at the end of a paragraph a sentence like "There is a more
    detail description of this in my trip report", making "trip report" a link.

    Now look, you made me started on this, and made me think that this whole
    linking thing needs to reconsidered. There has a been a lot of talk and
    proposals on indicating "link types", aimed at telling what a link
    points to or what its role is. But the real, safe, reasonable approach
    is that your text should tell that, in prose. Maybe we can some day use
    rel=... attributes that are relevant to search engines and friends. But
    we need write link texts and their textual context so that *people*
    understand what relevance of a link is.

    And if we do so, we can have link texts as normal text in print media,
    though we *could* give hint (with an arrow, an asterisk, or some other
    hint that suggests a link but does not mess up typography).

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
     
    Jukka K. Korpela, Nov 20, 2013
    #4
  5. Tim W

    dorayme Guest

    In article <l6jbcn$s51$>,
    "Jukka K. Korpela" <> wrote:

    > Now look, you made me started on this, and made me think that this whole
    > linking thing needs to reconsidered. There has a been a lot of talk and
    > proposals on indicating "link types", aimed at telling what a link
    > points to or what its role is. But the real, safe, reasonable approach
    > is that your text should tell that, in prose. Maybe we can some day use
    > rel=... attributes that are relevant to search engines and friends. But
    > we need write link texts and their textual context so that *people*
    > understand what relevance of a link is.
    >
    > And if we do so, we can have link texts as normal text in print media,
    > though we *could* give hint (with an arrow, an asterisk, or some other
    > hint that suggests a link but does not mess up typography).


    There is probably no one size fits all in this business of how to go
    about representing links. Some webpages seem unlikely to be much use
    when printed, they seem to be springboards to so many other and
    diverse sites and pages.

    Of course, strictly, you could say, when printed their use would be as
    an index to further printed pages. And if the links on the page
    pointed to a nicely defined set of small other pages, maybe a print
    version might be useful.

    But the reality of so many web pages is that they are not for the
    print medium and it would be a lot of trouble keeping out a careful
    eye on the print version. Perhaps the link to printing is mostly
    doomed to a certain pragmatic carelessness?

    --
    dorayme
     
    dorayme, Nov 20, 2013
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Jerry III
    Replies:
    0
    Views:
    453
    Jerry III
    Oct 15, 2003
  2. keto
    Replies:
    0
    Views:
    1,048
  3. David Cournapeau

    print a vs print '%s' % a vs print '%f' a

    David Cournapeau, Dec 30, 2008, in forum: Python
    Replies:
    0
    Views:
    402
    David Cournapeau
    Dec 30, 2008
  4. Terry Olson

    Print Styles

    Terry Olson, Oct 5, 2004, in forum: Javascript
    Replies:
    6
    Views:
    111
    Michael Winter
    Oct 5, 2004
  5. Michael Repucci
    Replies:
    1
    Views:
    129
    Michael Repucci
    Jul 14, 2007
Loading...

Share This Page