SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    <link rel...> and @import?

    Can someone tell me in simple terms the difference between <link rel...> and @import?

    I have up until now used solely 'linking', but I have a project coming up where I'm likely to need to be up to speed on the full gamut of accessibility issues.
    (In some ways, it's lucky as it's a government project, so it's gonna be 'standards' all the way, which makes my life a bit easier )

    Anywho, a late night last night has left me with a brain that cannot handle W3C throwing jargon at me.
    (I don't imagine my extended riposte in a World Events thread first thing this morning was the best way to start the day.)

    So if any kind soul would care to make simple sense of this for a simple fellow such as myself, they would earn my undying gratitude.

    (Nicky? This is your thang, innit?)

    TIA
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  2. #2
    SitePoint Wizard iTec's Avatar
    Join Date
    May 2001
    Location
    Sydney, Australia
    Posts
    2,243
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    From what i understand, @import is used when you want to have multiple style sheets for different media types (ie: aural, handheld, print ect ect) where the link element you cant define what media type it is applied to (tho you can use @media within it to get the same results).

  3. #3
    SitePoint Zealot 19nine78's Avatar
    Join Date
    Feb 2002
    Location
    Ayr, scotland
    Posts
    135
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    your making a habbit of posting questions I can (try) and answer...

    According to my CSS reference both <link> and @import are used to associate a stylesheet with a document. @import can also be used inside an existing stylesheet (an in-stylesheet include if you will). @import is also 'language independant' presuamably meaning that it will be the prefered means of applying CSS to other XML based languages whereas xHTML etc have the <link> tag. Both methods can have the media attribute set, so no differences there.

    The main difference in the real world is that Netscape 4.X doesn't support @import so it can be used as a method of 'hiding' incompatable CSS, but as far as I can tell theres no real reason to use one over the other and the few threads I've followed on the css-discuss list imply the same.

    So to recap.

    Both are valid methods of attatching CSS to an (x)HTML document, one is supported by netscape 4.X, the other is not.

    I'd go with <link> where possible

    any clearer??

    cheers

    alastair
    Last edited by 19nine78; May 20, 2002 at 14:18.

  4. #4
    SitePoint Enthusiast AlbinoRhyno's Avatar
    Join Date
    Feb 2002
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    19nine78 got it right-

    @import hides the stylesheet from Netscape 4.x (and others, but N4.x is the only browser of consequence). If you have a <link>, Netscape 4.x will ignore all of the markup and be happy.

    Why use @import then? Certain CSS properties, e.g. float:left, stops Netscape from rendering the whole page.

    So, if it's simple CSS text formatting, feel free to use <link>. If it is more complex, use @import so Netscape can at least show a unstyled page. While it doesn't matter which format to use generally, go with @import in case you add one of the Netscape killing CSS features...

  5. #5
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by 19nine78
    ...any clearer??
    perfectly.

    The real world implications for an xhtml website was my main concern.

    I will stick with 'linked' for now.

    thx to each of you for clearing the fog for me.

    The project is going to be standards compliant, so NN4 is not even considered beyond the possible need for a redirect informing the user of the requirements. (yay! )

    Thx again
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  6. #6
    Don't get too close, I bite! Nicky's Avatar
    Join Date
    Jul 1999
    Location
    Lancashire, UK
    Posts
    8,277
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Bill, I couldn't have asnwered it better. I do use these features on my website, they seem to work!

  7. #7
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just on the subject of hiding stuff from Netscape 4, I spotted this: found linked from Zeldman and worth checking out:

    http://www.v2studio.com/k/css/n4hide/

    It shows how you can use comment syntax within a style sheet to hid specific elements of a style sheet.

    Haven't tried this out yet - probably will though!
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback

  8. #8
    SitePoint Enthusiast vladanik's Avatar
    Join Date
    Oct 2001
    Location
    Belgrade, Serbia
    Posts
    53
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by AlbinoRhyno
    19nine78 got it right-

    Why use @import then? Certain CSS properties, e.g. float:left, stops Netscape from rendering the whole page.

    So, if it's simple CSS text formatting, feel free to use <link>. If it is more complex, use @import so Netscape can at least show a unstyled page. While it doesn't matter which format to use generally, go with @import in case you add one of the Netscape killing CSS features...
    If I'm using one of the Netscape killing features, isn't it better to use @import for importing a CSS file with those killer features, and after @import to use <link> for a special stylesheet just for NN4 (without that killing feature)? Because of cascading of the stylesheets, the page will look ok in every browser, right?

  9. #9
    SitePoint Zealot 19nine78's Avatar
    Join Date
    Feb 2002
    Location
    Ayr, scotland
    Posts
    135
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    exactly, @import in anything that may cause problems in netscape 4.

    cheers

    alastair

  10. #10
    Former Staff Member silver trophy Adam P.'s Avatar
    Join Date
    Apr 2001
    Location
    San Francisco
    Posts
    3,288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    A List Apart uses the @import method to hide their entire design from NS4 because they use an all CSS layout with CSS positioning. Just a little tid-bit of info.
    SPF Mentor/Advisor 2001-2003
    SPF Designer of the Year 2002
    SPF Graphic Designer of the Year 2003
    AdamPolselli.com

  11. #11
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Bill Posters
    The project is going to be standards compliant, so NN4 is not even considered beyond the possible need for a redirect informing the user of the requirements. (yay! )
    I wouldn't do that--let the NN4 (and earlier) users have access to the information! "Backwards compatibility" is part of the reason standards have been designed the way they were.

    Write up good solid markup and NN4 users don't need the design to understand the page. :-)

    ~~Ian


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •