SitePoint Sponsor

User Tag List

Results 1 to 23 of 23
  1. #1
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,738
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Tables are back for me... any advice?

    Hi all

    Starting a new job soon and they've told me all their websites, templates and CMS is built using tables

    My main concern is I haven't used tables for a LONG time, what are the problems regarding browsers, markup, bugs, what should I beware of?

    Does anybody have any good links or advice so I don't come unstuck
    The more you learn.... the more you learn there is more to learn.

  2. #2
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,341
    Mentioned
    63 Post(s)
    Tagged
    3 Thread(s)
    Quote Originally Posted by computerbarry View Post
    ... what are the problems regarding browsers, markup, bugs, what should I beware of?
    good news... there aren't any
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  3. #3
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Since you'll be the new employee fired up with energy and enthusiasm, maybe you can suggest taking their CMS into the new millennium and ditching the tabular layouts.

  4. #4
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,341
    Mentioned
    63 Post(s)
    Tagged
    3 Thread(s)
    Quote Originally Posted by Raffles View Post
    ...maybe you can suggest taking their CMS into the new millennium and ditching the tabular layouts.
    and make enemies right off the bat!! a winning strategy in any organization
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  5. #5
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    But maybe they don't know it's wrong! They need to see the light!

  6. #6
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,738
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    good news... there aren't any
    So are you saying there's no bugs at all and however I build the tables everything will function and look the same cross browser? What about CSS? (i was going to post a separate thread)

    Since you'll be the new employee fired up with energy and enthusiasm, maybe you can suggest taking their CMS into the new millennium and ditching the tabular layouts.
    I did suggest this at the interview and been thinking about this a lot, I think they do understand they need to update from tables to DIV layouts but it's a big company a lot of modules and existing sites to recode on the company's CMS... I'm guessing about 3/4000 machines on the intranet alone.

    and make enemies right off the bat!! a winning strategy in any organization
    yes I know r937 that's all I need.

    Thanks guys much appreciated for your advice
    The more you learn.... the more you learn there is more to learn.

  7. #7
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,738
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But maybe they don't know it's wrong! They need to see the light!
    Defiantly! How I see it is, somebody needs to create a fully functional pure blank CSS template for their CMS (Teamsite) and all their separate modules to go with it.

    I did get half way through building one for Joomla some time back... step learning curve and very time consuming.
    The more you learn.... the more you learn there is more to learn.

  8. #8
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Defiantly? I wouldn't go that far... being defiant will certainly make you enemies!

    Regarding CSS for tables, it's worth being aware of what the CSS replacements are for the HTML attributes like cellspacing, cellpadding and friends - I'd check the sitepoint reference for that.

  9. #9
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Perhaps that is one of the reasons they employed you because you were honest. Plus said you were concerned about misusing TABLE and that there were superior and more efficient solutions using CSS that would save them money, etc. in the long run.

  10. #10
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,738
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes getting a head of myself thanks Raffles. I'll check out the CSS reference cheers

    Update post same time xhtml...

    Perhaps that is one of the reasons they employed you because you were honest. Plus said you were concerned about misusing TABLE and that there were superior and more efficient solutions using CSS that would save them money, etc. in the long run.
    Yes just how I was thinking,(it is a support role after all) I think the best bet will be to see what their about when i get their then offer better solutions once I've settled in a bit, like mentioned above don't want to be stepping on peoples toes on the first day.

    Just really needed to know the <table> issues so I know what am doing
    The more you learn.... the more you learn there is more to learn.

  11. #11
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The biggest problem with tables is that the page then doesn't work for all resolutions and all media.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  12. #12
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,341
    Mentioned
    63 Post(s)
    Tagged
    3 Thread(s)
    Quote Originally Posted by felgall View Post
    The biggest problem with tables is that the page then doesn't work for all resolutions and all media.
    such as? i'd like to see a few examples, but one of each should do
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  13. #13
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Robert's correct, making the change from table-driven to CSS-driven pages will save them money in the long run. Run a Google search on ESPN.com's switch from tables to CSS. It's a famous example of a large corporate changeover that has borne fruit for the company. (Now, getting ESPN off of go.com is a different story, but not one you have to address.)

  14. #14
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,341
    Mentioned
    63 Post(s)
    Tagged
    3 Thread(s)
    Quote Originally Posted by felgall View Post
    The biggest problem with tables is that the page then doesn't work for all resolutions and all media.
    giving you the benefit of a weekend off, could you now take a moment, please, and give an example of one resolution and one medium where a web page with tables won't work

    otherwise i'm gonna call you out -- once again -- for making preposterous claims that look like fact
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  15. #15
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by r937 View Post
    giving you the benefit of a weekend off, could you now take a moment, please, and give an example of one resolution and one medium where a web page with tables won't work

    otherwise i'm gonna call you out -- once again -- for making preposterous claims that look like fact
    One really simple example.

    Any table with a width of over 748 pixels in width is broken for print media.

    Another simple example.

    Any page that has a width other than 544 pixels is broken for webtv media and so if the table forces the page wider than that it is broken for that media.

    So as anyone who knows the first thing about what restrictions apply to specific media can easily see it is extremely easy to create situations using tables that are broken for specific media.

    You really ought to stop suggesting that all the FACTS that I quote are preposterous just because you haven't looked into the situation sufficiently to realise that those facts exist.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  16. #16
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,341
    Mentioned
    63 Post(s)
    Tagged
    3 Thread(s)
    nice one, stephen
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  17. #17
    SitePoint Zealot
    Join Date
    Apr 2003
    Location
    New Zealand
    Posts
    168
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    One really simple example.

    Any table with a width of over 748 pixels in width is broken for print media.

    Another simple example.

    Any page that has a width other than 544 pixels is broken for webtv media and so if the table forces the page wider than that it is broken for that media.

    So as anyone who knows the first thing about what restrictions apply to specific media can easily see it is extremely easy to create situations using tables that are broken for specific media.
    Are these issues specific to table layout?

    Would the following not also be true?
    Any DIV or image or other fixed-width content with a width of over 748 pixels in width is broken for print media.

    Any page that has a width other than 544 pixels is broken for webtv media and so if a DIV or image or other fixed-width content forces the page wider than that it is broken for that media.

    Seems to me the issues described are not so much a consequence of using tables, but more a consequence of poor design (and poor design is media agnostic ).

    Disclaimer: I do not encourage table based layouts.

  18. #18
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by computerbarry View Post
    ...update from tables to DIV layout...
    No...! That is wrong. Going to "DIV layout" is just as bad as using TABLES for layout. Use semantics elements, h# for headers, p for paragraphs, etc. Just barfing up a bunch of DIVs all over the place is just as bad if not worst then TABLES.
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.


  19. #19
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by KiwiJohn View Post
    Are these issues specific to table layout?

    Would the following not also be true?
    Any DIV or image or other fixed-width content with a width of over 748 pixels in width is broken for print media.
    Yes but using CSS you can have a fixed width layout of over 748px for the screen and a separate narrower layout for printing - you can't do that with tables.

    Also with CSS you can float the fixed width elements in such a way that they restack themselves vertically when they will not fit next to one another - you can't do that with tables.

    Using tables for layout instead of doing it correctly with CSS means that you cannot have different layouts for different media and you can't have layouts that adapt themselves to the viewport size. That means that if you use tables for layout then you MUST keep the overall width to a maximum of 544pixels since going over that means webtv users will see only a part of the page. Using CSS you can define an alternate page layout for the webtv users and have a page width that isn't fixed at 544 pixels for everyone not using webtv.


    Anyway, it doesn't matter that there are other things that can break in those situations since the point being made is that layout tables over 544 pixels wide will always get chopped off for some users whereas using CSS means you can apply a different appearance for the different media to take into account the fixed widths.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  20. #20
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,738
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    there were superior and more efficient solutions using CSS that would save them money, etc. in the long run.
    making the change from table-driven to CSS-driven pages will save them money in the long run
    Funny enough I have a book with this example. How would this save them money? The book says: bandwidth and maintenance costs. How else could you save money? And why would this be more cost effective?
    No...! That is wrong. Going to "DIV layout" is just as bad as using TABLES for layout. Use semantics elements, h# for headers, p for paragraphs, etc. Just barfing up a bunch of DIVs all over the place is just as bad if not worst then TABLES.
    I didn't mean wrapping divs around every HTML element... more of a box/grid layout to hold all the HTML elements etc, 3 column for example and how most sites are built today with 3/4 main div containers.

    Good explanations felgall thank you . I doubt we'll need to worry about webTV but I'm sure print.css will be used a lot and thanks for starting the debate r937.

    Do people still use spacer.gifs to fix the spacing between columns?

    Thanks guys
    The more you learn.... the more you learn there is more to learn.

  21. #21
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,738
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If <tables> do have to be used is it ok to place div inside:

    <table>
    <div>
    <ul>
    <li></li>
    </ul>
    </div>
    </table>

    just getting a better understanding thanks
    The more you learn.... the more you learn there is more to learn.

  22. #22
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,869
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by computerbarry View Post
    Funny enough I have a book with this example. How would this save them money? The book says: bandwidth and maintenance costs. How else could you save money? And why would this be more cost effective?
    Imagine that they want to move one element in the template from one spot to another. If its position is defined in the template using HTML tables then each and every existing page needs to be updated separately to change it. If you have several thousand pages to update then the change could take weeks. The same change to site using an external CSS file would take seconds.

    Since changing the entire site over to use CSS shouldn't take much longer than moving the one element making the change to use CSS instead of tables will at worst start saving you update time by the third or fourth such update as compared to leaving the site in the stone age.

    So change one moving an element but retaining tables takes say two weeks while change one converting to CSS takes say five weeks. Change two still with tables takes two weeks while change two after converting to CSS takes five minutes. Change three still with tables takes two weeks while change three after converting to CSS takes five minutes. At this point converting to CSS at the start has become the cheaper more cost effective option.

    Since all sites generally make changes to their template at least once a year if not more often this makes it more cost effective to convert any site to CSS that is expected to still exist in three years time.

    And that's a worst case situation, most sites would be better off within months.
    Last edited by felgall; Apr 18, 2010 at 12:46.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  23. #23
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    I didn't get that from a book or website. Though I think Stephen nicely explained the 'main points' concerning "modular design" and CSS being more flexible than the clunky TABLE and how it would save having maintenance headaches, across a variety of media, etc.


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
  •