Advanced Search

Page 1 of 2 12 LastLast
Results 1 to 10 of 16

Thread: difference between<table> and <div>

  1. #1
    Join Date
    Sep 2009
    Location
    pakistan
    Posts
    28
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Question difference between<table> and <div>

    What are the major differences between <table> and <div> and which when is better to use.

  2. #2
    Join Date
    Jan 2008
    Posts
    4,158
    Thanks
    28
    Thanked 623 Times in 619 Posts
    Blog Entries
    1

    Default

    Div's aren't aligned, you need to align them in the right place. Tables act like the kind of table you fill out when your signing up for something... Or like in word when you go: Insert->Table. Tables are better for INFORMATION. Divs are better for LAYOUTS.
    Jeremy | jfein.net

  3. The Following User Says Thank You to Nile For This Useful Post:

    aqeel (02-05-2010)

  4. #3
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,154
    Thanks
    260
    Thanked 690 Times in 678 Posts

    Default

    divs are page sections. tables are information display charts.
    Daniel - Freelance Web Design | <?php?> | <html>| espa˝ol | Deutsch | italiano | portuguŕs | catalÓ | un peu de franšais | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  5. The Following User Says Thank You to djr33 For This Useful Post:

    aqeel (02-05-2010)

  6. #4
    Join Date
    Feb 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    If we talk from SEO point of view then DIV based structure is better than table based structure. There is a logical reason behind this. DIV based structure will reduce the length of code with compare to table based structure. So it'll be easy for search engine spiders to crawl website in a more faster way.

  7. #5
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    Quote Originally Posted by ericwilliams10 View Post
    If we talk from SEO point of view then DIV based structure is better than table based structure. There is a logical reason behind this. DIV based structure will reduce the length of code with compare to table based structure. So it'll be easy for search engine spiders to crawl website in a more faster way.
    The length of the website is not factored into the crawl, however search engines may get confused when tried to navigated nested tables.

    For more information please review one if not all of the following links http://wsc.opera.com/ , www.htmlhelp.com/ , http://css-discuss.incutio.com/ , www.brainjar.com/ , www.htmldog.com/ , http://css.maxdesign.com.au/, http://howtocreate.co.uk

  8. #6
    Join Date
    Feb 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I'm not agree with you. Using a DIV based structure will definitely reduce the length of code and that will become an easier task for search engine spiders to crawl the website rather than crawling a website using table based structure.

    If we design website using table structure then code will be lengthy and it'll become tedious job for search engine spiders to crawl a lengthy code.
    Last edited by ddadmin; 02-11-2010 at 08:13 PM.

  9. #7
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,621
    Thanks
    63
    Thanked 516 Times in 502 Posts
    Blog Entries
    5

    Default

    it's the complexity and predictability of the site's layout that matters, not the length of its markup (as long as its not broken). Search engine spiders don't mind tedious jobs, but they only follow stuff as long as it makes sense to them. for example, you could have a menu with a layout like this:

    | home | contact |
    | mark | jason |

    "home" goes to the home page
    "contact" goes to a contact page
    "mark" and "jason" go to profile pages.

    You could make this look exactly the same to the user using either divs or a table.

    If you used divs, a spider wouldn't have a problem either, as each div (and its content) is separate.

    HOWEVER, if they were in a table, then the spider would expect the "jason" page to be about how to contact jason, when in reality, it may have no contact info at all. The spider would conclude that your site has no substantial content and/or hasn't been updated recently (the menu's out of date), and your ranking would suffer as a result.
    We Only Torture the Folks We Don't Like (You're Probably Gonna Be Okay)
    It's a Party in the CIA

  10. #8
    Join Date
    Oct 2006
    Location
    New York, NY, USA
    Posts
    230
    Thanks
    31
    Thanked 24 Times in 24 Posts

    Default avoid <TABLE> for layouts

    Ahem! Are we mixing it up here?

    I can understand how <TABLE> clutter can obscure content from robotic search-engine crawlers, but is download time really a primary factor in how subjects are indexed?

    Search engine robots look for key words / phrases in Web-site pages' title, meta tag description, meta tag keywords, page content, etc. (see http://websearch.about.com/od/beginn...enstepsseo.htm for tips) to index subjects. "Accessibility" (as in http://www.w3.org/WAI/intro/accessibility.php) deals with human factor of handicapped individuals (for instance, visually impaired people using screen readers).

    The use of HTML <TABLE> element for Web page layouts (especially when nested) added irrelevant clutter and made content inaccessible for some people with disabilities.

    Tad-ah-ah! Separate content from presentation! Enter CSS (Cascading Style Sheets) to the rescue to embellish presentation of HTML content without clutter of <TABLE><TR><TD>content</TD></TR></TABLE>to display something. The CSS <DIV> is an all-purpose, ubiquitous block-level container that can be styled with "class" or "id" specifications to position content. <SPAN> is an all-purpose CSS inline container. Current Web-standards discourage use of <TABLE> element for layouts or non-tabular data.

    See for example, http://webdocdo.tripod.com/demo/wsdds.html (wherein I tried to convert my dentist) and then view his page source at http://www.wsdds.com to see all the useless garbage a screen-reader has to wade through.

  11. #9
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,621
    Thanks
    63
    Thanked 516 Times in 502 Posts
    Blog Entries
    5

    Default

    Quote Originally Posted by auntnini View Post
    ...I can understand how <TABLE> clutter can obscure content from robotic search-engine crawlers, but is download time really a primary factor in how subjects are indexed?
    no. (especially considering how minuscule the time difference is, in this case.) that was my point.

    Quote Originally Posted by auntnini View Post
    The use of HTML <TABLE> element for Web page layouts (especially when nested) added irrelevant clutter and made content inaccessible for some people with disabilities. [...] The CSS <DIV> is an all-purpose, ubiquitous block-level container that can be styled with "class" or "id" specifications to position content. <SPAN> is an all-purpose CSS inline container. Current Web-standards discourage use of <TABLE> element for layouts or non-tabular data.
    I think we've got it covered then, unless the OP has any further questions.
    We Only Torture the Folks We Don't Like (You're Probably Gonna Be Okay)
    It's a Party in the CIA

  12. #10
    Join Date
    Oct 2006
    Location
    New York, NY, USA
    Posts
    230
    Thanks
    31
    Thanked 24 Times in 24 Posts

    Default correct me

    The CSS <DIV> ...
    *

    That's poorly stated; I should be corrected: HTML <elements> are the bases of a document's structure. <DIV> and <SPAN> (like <TABLE>) are HTML elements (maybe added, because of their innocuous nature, so styling for logical divisions or sections of content could be designated with CSS rules).

    According to http://www.alistapart.com/articles/previewofhtml5: "The [html4] div element can be replaced with the new[html5] elements: header, nav, section, article, aside, and footer." Thus we'll no longer have to include "id" or "class" style specs in divs like now -- <div ID="footer">

    The goal is to have clean, simple, minimal, logical markup -- which can be best achieved using CSS in an external, linked document. The multi-layered <TABLE> element was not intended for layout purposes. I go bonkers when seeing <DIV>s added to table cells for styling. CSS-advocate Jeffrey Zeldman's "Designing with Web Standards" 1st ed. featured ways to enhance <TABLE> layouts with CSS "id" and "class" specs applied to cells.
    Last edited by auntnini; 02-14-2010 at 12:21 AM. Reason: spelling "innocuous"

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
  •