SitePoint Sponsor

User Tag List

Results 1 to 8 of 8

Thread: Benefits Of CSS

  1. #1
    Bad Ass Mother F#$%^& Devious's Avatar
    Join Date
    Feb 2005
    Location
    New Orleans LA (504) 812-8971
    Posts
    539
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Benefits Of CSS

    What are the main benefits of using CSS and why do people want to design without tables?
    Logo Design & Identity Branding Consultant.

  2. #2
    SitePoint Addict
    Join Date
    Apr 2002
    Posts
    281
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    to add style to your html documents and control the style of all your pages in 1 (or more files)

    people want to design without tables because:
    1. easier to maintain code
    2. reduce file size of files
    3. Be semanticaly correct (tables aren't made for design)
    there's more reasons, these are just some "main" ones

  3. #3
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Thyrium
    What are the main benefits of using CSS and why do people want to design without tables?
    CSS moves all presentational/formatting information out of the HTML document, leaving you with just content (i.e. links, paragraphs, lists, etc.). This helps reduce page weight and makes your pages load faster. Another benefit is that external CSS files are cached, so if you re-use the same stylesheet on multiple pages, each subsequent request for a page on your site after the first will load faster (no need to download that stylesheet again). Finally, having your site running off of one or a few CSS files helps cut down on maintenance. Want to make all of your links purple instead of red? Now you only have to change that in one place instead of every HTML document on your site.

    That's a quick rundown. There are other benefits, but none of them are nearly as useful as the few I mentioned above.

  4. #4
    Bad Ass Mother F#$%^& Devious's Avatar
    Join Date
    Feb 2005
    Location
    New Orleans LA (504) 812-8971
    Posts
    539
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    any "secret" benefits ?
    Logo Design & Identity Branding Consultant.

  5. #5
    SitePoint Zealot
    Join Date
    May 2005
    Location
    Suwanee GA
    Posts
    118
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I find it extremely useful for layering background images in nested Divs that I can't do with Nested tables. Bugs are easier to find in nested Divs than nested tables too.

    Once you figure out your column and/or sectional layouts you can get fairly complex with the design using only CSS. Content stays in tidy small included files.

    The only problem I have not found a resolution for is CSS drop down menus appearing behind Flash objects in Firefox and NS. This is more of a browser issue than a CSS issue.

  6. #6
    SitePoint Addict
    Join Date
    Apr 2002
    Posts
    281
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by esearing
    The only problem I have not found a resolution for is CSS drop down menus appearing behind Flash objects in Firefox and NS. This is more of a browser issue than a CSS issue.
    You're right it's not a css issue.

    Code:
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/s...rsion=6,0,29,0" width="740" height="288">
    						  <param name="movie" value="flash.swf" />
    						  <param name="quality" value="high" />
    		<param name="wmode" value="transparent">
    						  <embed src="flash.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="740" height="288" wmode="transparent" ></embed>
    	   </object>
    you need wmode="transparent" as a param and as a <embed> attribute and it should be behind anything over it.

    but doesn't work in Opera before version 8.

  7. #7
    Non-Member Egor's Avatar
    Join Date
    Jan 2004
    Location
    Melbourne, Australia
    Posts
    7,305
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    You basically get more control over your html. You can also do things not possible with html alone, like absolute positioning and hiding or removing elements.

    When you get the hang of CSS, you also learn all the browser bugs.

  8. #8
    SitePoint Wizard Goof's Avatar
    Join Date
    Feb 2001
    Location
    Pittsburgh, PA
    Posts
    1,154
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's also easier to apply presentation parameters to multiple elements without putting the parameters in every time that element appears. For instance, if I know I want all of my <H1> tags to be red and a font size of 24px, I can simply write:
    Code:
      H1 { color: red; font-size: 24px; }
    And I only have to do that once and not worry about it for any page that includes that style sheet, verses putting a <FONT> tag with every instance of the <H1> tag. It's just a nicer way of doing things.

    As for the tables question, I myself am still working on that one, for the very reason that it feels like you have to "trick" CSS to get a flexible grid for page design (as unpopular as that may be to say). In one way tables and spacer gifs were semi-intuitive - once you figured them out you could take virtually any layout in Photoshop and recreate it to the pixel. Multiple columns and rows in CSS are trickier, and I'm hoping that page layout will be more elegantly delt with in future implementations of CSS.

    But is the switch worth it? While some more work might have to be done up-front with CSS, I would still say YES! Editing page content is so much easier without all of that table code in there. It was getting to the point in table-layouts that I would have to use FIND functions in my editor to find what I wanted to change. HTML with a style sheet applied is much nicer on the eyes of the developer.

    Hope that helps,
    Nate
    Nathan Rutman
    A slightly offbeat creative.


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
  •