CSS on page or in file?

Discussion in 'CSS' started by fryman, Sep 16, 2005.

  1. #1
    Is there any difference or any advantage of having the CSS styles in the page or in a separate external file?
     
    fryman, Sep 16, 2005 IP
  2. Janissary

    Janissary Well-Known Member

    Messages:
    375
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    140
    #2
    like the include function... no difference but including is easier...
     
    Janissary, Sep 16, 2005 IP
  3. fryman

    fryman Kiss my rep

    Messages:
    9,604
    Likes Received:
    777
    Best Answers:
    0
    Trophy Points:
    370
    #3
    Yeah, I guess it would be easier to do any changes on the external file than going through each page
     
    fryman, Sep 16, 2005 IP
  4. dkalweit

    dkalweit Well-Known Member

    Messages:
    520
    Likes Received:
    35
    Best Answers:
    0
    Trophy Points:
    150
    #4
    I have personally found that many browsers don't properly respect STYLE attributes directly on tags, and some don't respect the <STYLE></STYLE> section in the header-- therefore, I always use css files when I'm seeking cross-browser compatibility(i.e. production sites). I use a mix when I'm doing administrative back-ends that will only be used by myself...


    --
    Derek
     
    dkalweit, Sep 16, 2005 IP
  5. Colleen

    Colleen Illustrious Member

    Messages:
    6,777
    Likes Received:
    725
    Best Answers:
    1
    Trophy Points:
    430
    #5
    Exactly, ALSO the stylesheet gets cached so as the user browses your site they don't have to wait as long for the page too load since the style is already loaded and in their cache, so that and not having to edit all files to change a few things, much easier to edit the one file as you stated.

    Kalina
     
    Colleen, Sep 16, 2005 IP
  6. dcristo

    dcristo Illustrious Member

    Messages:
    19,776
    Likes Received:
    1,200
    Best Answers:
    7
    Trophy Points:
    470
    Articles:
    7
    #6
    To prevent code bloat having the CSS stored in an external file is definately beneficial.
     
    dcristo, Sep 16, 2005 IP
  7. hasbehas

    hasbehas Well-Known Member

    Messages:
    726
    Likes Received:
    24
    Best Answers:
    0
    Trophy Points:
    190
    #7
    If the css file is a little large like over 10-15k I use the include.. other than that I always use external single css file.
     
    hasbehas, Sep 16, 2005 IP
  8. JamieC

    JamieC Well-Known Member

    Messages:
    226
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    138
    #8
    I would recommend never directly including CSS either in your markup or in your head section.

    Having CSS in external files will:
    • Reduce your bandwidth use
    • Allow you to make layout / style adjustments to an entire site by modifying just one file
    • Reduce the download times for the user
    • Allow you to manage your website better

    I would also recommend commenting your CSS files heavily. Some people like to keep seperate CSS files for layout and style. I don't do this but I do try to keep the two areas as discrete as possible within the file.

    If I have a page which has an unique layout, I create a seperate CSS file for just that page; among other things this will allow you to easily create another page with the same layout in the future.

    Some people think that using the conventional 'link rel' method of importing stylesheets can lead to delays in the browser applying the style information and other problems. These people tend to either use the @import with a Javascript hack or an SSI instead. Personally i've always stuck with the old way as it's never given me any problems, and newer browsers have improved their support.

    I've just realised that this thread is pretty old and you haven't asked for half of this info - sorry about that, just bored while my tea gets cooked for me ;)
     
    JamieC, Oct 1, 2005 IP
  9. JamieC

    JamieC Well-Known Member

    Messages:
    226
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    138
    #9
    Here's a thought for anyone reading - I know that SE's tend to rate content more the nearer the top of the page it is. Does this only count from <body> downwards? I hope so, because if not people with the style info in their head are missing out :)
     
    JamieC, Oct 1, 2005 IP
  10. tresman

    tresman Well-Known Member

    Messages:
    235
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    138
    #10
    Yes, only count from the body.
     
    tresman, Oct 3, 2005 IP
  11. chachi

    chachi The other Jason

    Messages:
    1,600
    Likes Received:
    57
    Best Answers:
    0
    Trophy Points:
    0
    #11
    I agree with JaimeC, but if for no other reason than to help manage changes to your site. Modifying one file is a hell of a lot easier to do than 1,000....even if you are using some kind of WYSIWYG editor.
     
    chachi, Oct 5, 2005 IP
  12. Amos

    Amos Peon

    Messages:
    224
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #12
    One file allows for easier modification as it's been mentioned before and it keeps bandwidth down because the file gets cached when the user loads the site.
     
    Amos, Oct 5, 2005 IP