CSS and Tableless Design

Discussion in 'Game Development (Technical)' started by Sillysoft, Aug 3, 2004.

  1. Sillysoft

    Indie Author

    Joined:
    Jul 27, 2004
    Messages:
    831
    Likes Received:
    0
    I have read a lot about using CSS for layout. It seems to be the current Big Thing amongst all the avant-garde web designers.

    My problem is that I have a bunch of experience hacking out quick table-based websites. I haven't been able to justify putting aside the time to re-learn how to do it using CSS, since what I can do now works just fine for me.
     
  2. Sillysoft

    Indie Author

    Joined:
    Jul 27, 2004
    Messages:
    831
    Likes Received:
    0
    Weird, I posted a reply to you but my comment seems to have been put at the top of the thread!?!

    Edit: After looking at it more it looks like we have set each set the forums to different timezones. So my posts look like they happened earlier in time then yours.
     
    #2 Sillysoft, Aug 3, 2004
    Last edited: Aug 3, 2004
  3. Mike Boeh

    Administrator Original Member

    Joined:
    Jul 26, 2004
    Messages:
    949
    Likes Received:
    0
    I adjusted the server time to reflect where it is... Sorry about that :) In 2 hours, everything will be back to normal as far as time goes...
     
  4. GameStudioD

    Original Member

    Joined:
    Jul 27, 2004
    Messages:
    154
    Likes Received:
    0
    http://www.stopdesign.com/articles/throwing_tables/

    This article talks about how you can use CSS instead of tables to create webpages. I think its quite interesting because I thought CSS was just used for changing colors and font size. It is much more powerful. The author took microsoft.com and used a CSS design without tables. The size of the html file was reduced significantly and the number of HTTP requests for images was reduced dramatically. This design is catching on because it is so more efficient and the html more readable.

    http://www.csszengarden.com/

    This site is done with CSS and is tableless. There are a couple of versions of this site that have a completely different look with essentially the same html file, and a different style sheet. This looks like a far better way to put together webpages.
     
  5. oNyx

    Original Member

    Joined:
    Jul 26, 2004
    Messages:
    1,212
    Likes Received:
    0
    CSS is really great. I spent alot of time for some kind of crash course over the last two weeks. I rebuild the layout from a list apart (that was really tough) and a complete page (searchengine streamlined) with 20 subpages using css, xhtml, php and js. The stylesheet is external and the js stuff is external, too. Each page is about 2-4 kb(!) plus some images. It loads really really fast and I don't even use frames :D

    Over at csszengarden you can find a page with alot of resources:
    http://www.mezzoblue.com/zengarden/resources/

    Oh and "Tableless Design" means that the layout is done without tables. If you ever need a real table for displaying some data (eg highscores) you should use a table. Sure, you can mimic tables with css too, but that doesn't make any sense. You would end up with bloated markup and rather weird code.

    Eg if you look at that page, you'll see that the whole layout is done with css and that the small table there is done with <table>.

    Oh and be sure to use a doctype and write your code as strict as you can (even if you use transitional). Eg inline elements (text, images...) needs to be inside a block element (<p>...</p>) otherwise IE 5.0/5.5 can produce some weird artifacts like a 4px gap.

    Some tips here:
    http://www.mezzoblue.com/css/cribsheet/

    "When in doubt, validate." - That can save you alot of trouble.
     

Share This Page

  • About Indie Gamer

    When the original Dexterity Forums closed in 2004, Indie Gamer was born and a diverse community has grown out of a passion for creating great games. Here you will find over 10 years of in-depth discussion on game design, the business of game development, and marketing/sales. Indie Gamer also provides a friendly place to meet up with other Developers, Artists, Composers and Writers.
  • Buy us a beer!

    Indie Gamer is delicately held together by a single poor bastard who thankfully gets help from various community volunteers. If you frequent this site or have found value in something you've learned here, help keep the site running by donating a few dollars (for beer of course)!

    Sure, I'll Buy You a Beer