66 replies
  • WEB DESIGN
  • |
What is better to use? "div" or "tables"???????
#div #tables
  • Profile picture of the author JulieJ
    "divs" every time!
    Although tables are easy to build websites with, they are not recognised as web standard and divs are the way forward (see Web Content Accessibility Guidelines 1.0). Tables are fine to use within a website to show data but if you're only just starting out building websites, it worth the time and effort to learn how to use divs. Tables are also hard for screen readers to read information.
    {{ DiscussionBoard.errors[3062143].message }}
    • Profile picture of the author jeffmac
      [DELETED]
      {{ DiscussionBoard.errors[3358888].message }}
      • Profile picture of the author oscarte
        But if you use all your divs absolutely positioned; that as wrong as tables.
        {{ DiscussionBoard.errors[3359153].message }}
        • Profile picture of the author phpbbxpert
          Originally Posted by oscarte View Post

          But if you use all your divs absolutely positioned; that as wrong as tables.
          There is no reason to do that. :rolleyes:
          You only position block elements with absolute when it is needed, same as using anything else. Use it when it applies.

          You can do complete graphical layouts in divs without ever using absolute.
          {{ DiscussionBoard.errors[3359768].message }}
          • Profile picture of the author oscarte
            Originally Posted by phpbbxpert View Post

            There is no reason to do that. :rolleyes:
            You only position block elements with absolute when it is needed, same as using anything else. Use it when it applies.

            You can do complete graphical layouts in divs without ever using absolute.

            I say that because that happen to people that made the code with Photoshop.
            Photoshop have the option to code the design in tables or in divs; but both are the same trash. The div option is basically a table of divs because all the divs are absolutely positioned and sized.

            Good design in divs is the one that is semantic and hand-coded following W3C standards.
            {{ DiscussionBoard.errors[3374542].message }}
  • Profile picture of the author TonyMontana
    "div" for sure
    {{ DiscussionBoard.errors[3062153].message }}
    • Profile picture of the author CarloD.
      Use tables for tables of data.

      use divs for your layout
      Signature

      {{ DiscussionBoard.errors[3062747].message }}
  • Profile picture of the author Steve Wells
    Everyone says divs. I agree that divs are the way to go if you can do them, they can get tricky the more complex the design. But from my experience there really isn't much of a difference on the users side. If there is a load time issue, it is soooo small that it really does not matter unless you are anal.

    Now, from the coders side, I think that someone somewhere, at sometime started pushing divs hard, probably some coding nerd. And now its the new up and coming standard.

    As for tables not being recognized as a valid website. That makes no sense. Because w3C validates a website as 100% even if its designed in tables........ You will however need to use css though.
    Signature
    Need Custom Graphics Work? - Message Me For A Design Quote!
    {{ DiscussionBoard.errors[3063122].message }}
    • Profile picture of the author Lloyd Buchinski
      Originally Posted by Steve Wells View Post

      Everyone says divs.
      Thanks for your comments Steve. I started off being throughly impressed by everyone saying that, and that was the way I went. But especially when a site is being adapted for IE 6, tables seem to work better than css. Hopefully they'll bury the browser soon and it won't be a problem any more.

      But I have seen a few sites put up by people I think are really intelligent, using tables for layout. I guess it still does have its uses.
      Signature

      Do something spectacular; be fulfilled. Then you can be your own hero. Prem Rawat

      The KimW WSO

      {{ DiscussionBoard.errors[3068712].message }}
  • Profile picture of the author Istvan Horvath
    Nobody said tables cannot be valid. The issue is: tables are for tabular data not for layout design. It's that simple.

    At the beginning of the time... it was tables and inline styles.
    Have you ever tried to change the design of a site with 100 pages all done with tables and inline styles...?

    Compare the scenario above with web pages designed with divs and one single CSS file. (Yes, to tell the truth you can have 100 pages designed in tables and one single CSS file, too... it's just that tables were invented for something else.)
    Signature

    {{ DiscussionBoard.errors[3063164].message }}
    • Profile picture of the author Steve Wells
      Originally Posted by Istvan Horvath View Post

      Nobody said tables cannot be valid. The issue is: tables are for tabular data not for layout design. It's that simple.

      At the beginning of the time... it was tables and inline styles.
      Have you ever tried to change the design of a site with 100 pages all done with tables and inline styles...?

      Compare the scenario above with web pages designed with divs and one single CSS file. (Yes, to tell the truth you can have 100 pages designed in tables and one single CSS file, too... it's just that tables were invented for something else.)
      they are not recognised as web standard
      This is what I took as not being valid.....

      Yep, I know tables were invented for tabular data, but they still work, and from a users point of view, as long as it works and looks great they do not really care. Yep, you can have tables and one css file......

      I just mentioned this and made my comment because so many people are talking about divs as if tables cannot be used. Which they can be and they produce on the users side a great looking site they can only be differenciated if looking at the code.

      I use divs and I have used tables, they both load super fast, unless you are image heavy, which is normal for most stupid IM sales pages. Not all though.

      I think that most people, users, have no clue what they hell either way, as long as it works properly. They pay just the same also. Now, I will endeavor to do divs, but sometimes a quick table site is just what works, at least for me....
      Signature
      Need Custom Graphics Work? - Message Me For A Design Quote!
      {{ DiscussionBoard.errors[3063204].message }}
      • Profile picture of the author mintdesignnz
        Depends on the usage actually, for layout is "div" and for dynamic tabular data display, it's "tables".
        {{ DiscussionBoard.errors[3064658].message }}
        • Profile picture of the author russblanc
          Tables are so passe. CSS and XHTML is the proper way to code a site...
          Signature

          Affordable Bluehost Web Hosting | Affordable Hostgator Web Hosting

          {{ DiscussionBoard.errors[3064669].message }}
          • Profile picture of the author jminkler
            Originally Posted by russblanc View Post

            Tables are so passe. CSS and XHTML is the proper way to code a site...
            IE 5,6,7,8,9 wont render true XHTML served as XML. And probably never will.
            {{ DiscussionBoard.errors[3407212].message }}
      • Profile picture of the author JulieJ
        Sorry Steve, I meant 'not recommended for layouts'. (that will teach me to read what I write properly!). Just think it's a good habit as a web designer to use 'best practice' techniques, though I agree lots of people just a want a good looking site up and running quickly and aren't bothered whether tables or divs are used.
        {{ DiscussionBoard.errors[3071075].message }}
        • Profile picture of the author elronzo
          In addition to what all the other warriors have said ...
          DIVs and TABLES have their place.
          For SEO / SEM - I think its CSS all the way. For blind folks you pretty well need to keep content and form/design distinct so the screeen reader can read it. It is however neat if the screen reader shouts out HEADING... when its a header.
          The more complicated the design, the more you will wrestle with floats and alignment. Much of the time with a css design you will make the image with a white margin just so it will look right in every browser. In a perfect world you can kill browser defaults and check your design in browser check sites (or the Adobe one) - but in the real world when you are handed artwork that isnt a traditional L shape, or simpe columns, then CSS can get pretty hackish. For pro coders, time is money and quick is good if proper didnt work first and second time!
          At this point you may want to come in from the cold and stick a table into the design - Its your design and if you need a quick fix on someone else's css code, there aint nuthin like a table for gettin the job done.
          There is also a school of thought that TABLES are for data and just a special container. They are also good for sucking out data from a page.
          For SEO and Visually impaired folks then a table generally is not your best option. But for tabular data, a property commented table is ideal.
          {{ DiscussionBoard.errors[3071301].message }}
    • Profile picture of the author Ruwan
      Originally Posted by Istvan Horvath View Post

      Nobody said tables cannot be valid. The issue is: tables are for tabular data not for layout design. It's that simple.

      At the beginning of the time... it was tables and inline styles.
      Have you ever tried to change the design of a site with 100 pages all done with tables and inline styles...?


      Compare the scenario above with web pages designed with divs and one single CSS file. (Yes, to tell the truth you can have 100 pages designed in tables and one single CSS file, too... it's just that tables were invented for something else.)
      Hahahaa.. that's painful, even hearing it.
      Signature
      FREE WordPress Services (Consultation | DIY Training)
      Limited-Time OFFER!
      {{ DiscussionBoard.errors[3379430].message }}
  • Profile picture of the author mojojuju
    Divs. But using tables for layout probably isn't going to kill you.
    Signature

    :)

    {{ DiscussionBoard.errors[3065035].message }}
  • Profile picture of the author orvn
    div baby
    Signature
    Orun Bhuiyan[@orvn] [linkedin] See what I've been doing lately by visiting my marketing agency's site. SEOcial specializes in content marketing and integrated optimization. We create conversions for businesses by gracefully connecting the realms of design, development and marketing.

    {{ DiscussionBoard.errors[3071414].message }}
  • Profile picture of the author icun
    div x 100,000

    Using tables with CSS, jQuery, AJAX and all the other cool stuff available now is going to cause untold grief for you.

    Tables = betamax
    div = VHS :-)
    {{ DiscussionBoard.errors[3071437].message }}
  • Profile picture of the author Jesterhead
    I use div tags for the basic layout. Therefor I only use tables to display data (like in a excel sheet).

    Most people start with tables, so did I. But if you are used to css, div tags are way easier and cleaner!
    {{ DiscussionBoard.errors[3071453].message }}
  • Profile picture of the author ECS Dave
    Deprecated
    Originally Posted by Steve Wells View Post

    Now, from the coders side, I think that someone somewhere, at sometime started pushing divs hard, probably some coding nerd. And now its the new up and coming standard.
    Tables will likely NOT ever become "obsolete".

    So, whatever works for you (and the MAJORITY of your targeted visitors), is what's recommended...

    Be Well!
    ECS Dave
    {{ DiscussionBoard.errors[3071468].message }}
  • Profile picture of the author mrsgs
    It will make sence for you to use tables for displaying something like spreadsheet data, however id mainly use divs for everything else.
    {{ DiscussionBoard.errors[3072503].message }}
  • Profile picture of the author dellingter
    The google Standard Is Css So You Better to Use Div base Css
    {{ DiscussionBoard.errors[3072814].message }}
  • Profile picture of the author dialseo
    DIV IDs for foundation elements, DIV classes for fonts, buttons, boxes (where mulitple instances of are present on the same page).

    No one's going to kill you for using tables, but they load slower and are overall jankier than well written CSS.
    {{ DiscussionBoard.errors[3074535].message }}
  • Profile picture of the author LiquidSeo
    Originally Posted by sortshots View Post

    What is better to use? "div" or "tables"???????

    DIV -- almost every time.

    Tables are great for representing data in a tabular format, but are typically used incorrectly by most web designers.

    In general, I prefer DIV.
    {{ DiscussionBoard.errors[3076414].message }}
  • Profile picture of the author best web designer
    Hi,
    My suggestion is use div because the table is fixed.That means you cant move the table,It divides the webpage.But div is not fixed, You can move the div anywhere in your webpage.
    {{ DiscussionBoard.errors[3320703].message }}
    • Profile picture of the author weaveronline
      "Div" is best for layouts
      Signature

      Thanks & Regards,
      Reach us at dukeduke600@gmail.com.
      Web Design| Logo Design | Banner Design | Web Development | Mobile Applications [iPhone/iPad/Android/Windows Phone]

      {{ DiscussionBoard.errors[3322498].message }}
  • Profile picture of the author kooldesigning
    Div is best Do not think for tables
    Signature
    Landing page design focus to improve Inquiry or Sales.
    Get Custom website design of your dreams
    {{ DiscussionBoard.errors[3322656].message }}
  • Profile picture of the author kaytav
    I always use div as it is easy to use and lot of features .
    {{ DiscussionBoard.errors[3322772].message }}
  • Profile picture of the author 723Media
    Those who say div's for layout and tables for tabular data are correct. Pragmatism aside, div's work best for layout for two big reasons:

    1. Easier on screen readers
    2. SEO

    Div's are essentially meaningless to most browsers whereas tables are meaningful and are meant to mark up data. If you look at a site built using tables for layout and data with a screenreader, it's going to be messy.

    Similarly, if a search engine robot comes to your site and has to dig through nested tables, it's going to be messy.

    So it boils down to what you are displaying and why. If you don't care about SEO or semantically correct HTML, then use whatever you like.

    If you care about writing the correct markup, then use not just div's but take a look into POSH (Plain Old Semantic HTML).
    {{ DiscussionBoard.errors[3322914].message }}
  • Profile picture of the author dudumolin
    When I want to do something fast i use tables....
    I spent a little more time using divs!
    {{ DiscussionBoard.errors[3323191].message }}
    • Profile picture of the author Wasim
      Originally Posted by dudumolin View Post

      When I want to do something fast i use tables....
      I spent a little more time using divs!

      That's exactly what I used to do but that's only because I'v always done it all in dreamweaver but the more I played around and practiced with DIVS in the html and then CSS as a seperate file the more easier it became. Personally I prefer the idea of setting up the html and css files seperately now and then only having to edit the CSS file for any changes. I also prefer the flexibility of being pixel perfect with CSS & DIVS.
      {{ DiscussionBoard.errors[3323448].message }}
  • Profile picture of the author promo_guy
    I prefer divs too. Basic tabular data I might use tables but I love divs and have created some great effects using divs for tabular data too.

    I find tables for design to be bloated, heavy, causing more potential problems (from a design POV).

    To tackle IE6,7,8, you can add a simple IE specific stylesheet VERY easily and fix most "bugs"
    {{ DiscussionBoard.errors[3324460].message }}
    • Div is the best way..coz it will be load fast so its good for doing SEO too..
      {{ DiscussionBoard.errors[3326275].message }}
  • Profile picture of the author Bob Phantom
    Divs, always Div's, not matter what you do Divs
    {{ DiscussionBoard.errors[3326676].message }}
  • Profile picture of the author limcode
    Always using div except tabular data(table)
    {{ DiscussionBoard.errors[3326996].message }}
  • {{ DiscussionBoard.errors[3360631].message }}
  • Profile picture of the author samphaifan
    defently DIVS! Today it is to easy to use div's EVEN if it is data ! HTML5 rules! and maybe you should use CSS3, even if some browser doesnt support is propperly yet, it will save you time and headache later ;-)
    {{ DiscussionBoard.errors[3360955].message }}
  • Profile picture of the author dellingter
    i prefer div to make layouts and data for tables
    {{ DiscussionBoard.errors[3361171].message }}
  • Profile picture of the author nxtgencreative
    Originally Posted by sortshots View Post

    What is better to use? "div" or "tables"???????
    It is really good to use div. Tables were used in the early 2000's. Tables are not that customizable. With "div" CSS can do a lot more.
    {{ DiscussionBoard.errors[3363969].message }}
  • Profile picture of the author staciejortega
    div is used to separate section of html into an object. and besides allow CSS tags and other html codes to act upon the entire div section. it is important to give a name to your div.
    {{ DiscussionBoard.errors[3365278].message }}
  • div for the win!
    {{ DiscussionBoard.errors[3365286].message }}
  • Profile picture of the author PBaxter
    "div" the best option
    {{ DiscussionBoard.errors[3369537].message }}
  • Profile picture of the author jacobecoenergy
    "table" will be the best option according to your requirement.
    {{ DiscussionBoard.errors[3374848].message }}
  • Profile picture of the author staciejortega
    if you want to use table, you will also have to use CSS to modify styles
    {{ DiscussionBoard.errors[3378640].message }}
  • Profile picture of the author telltimmy
    I prefer divs over table always as they are good with css and compatible with most browsers.
    {{ DiscussionBoard.errors[3379169].message }}
  • Profile picture of the author davidlouis88
    I think Table is better. Table makes your site loading faster than Div make, my boss said that.
    {{ DiscussionBoard.errors[3379196].message }}
  • Profile picture of the author Tim Brownlaw
    What drove me to learning divs and css layouts?
    Trying to modify some complex tabled laid out, messy unreadable....site.

    Tables are for eating your dinner off of ( with a plate in between the table and your dinner...) and sticking numbers etc into.

    Divs can do the lot!

    So although I went through a phase were I took great pride in making everything without tables - they do have their place, even on websites.
    {{ DiscussionBoard.errors[3379904].message }}
  • Profile picture of the author madhead29
    Yeh defo Divs tables are not really made for the layout of a page. Plus they are a super pain to main and can cause cross-browser problems. But tables still have there use with tabular data. Can be done also with divs and css but it can get abit of a pain as a lot of work is needed.
    {{ DiscussionBoard.errors[3380617].message }}
  • Profile picture of the author gloribel5
    DIV tags the best..
    Signature
    {{ DiscussionBoard.errors[3383564].message }}
  • Profile picture of the author freshmusic
    I use div for layot
    {{ DiscussionBoard.errors[3398218].message }}
  • Profile picture of the author chetankumar20
    Div is the best option to use. Most of the developer and designers prefer to "div" due to its lots of benefits.
    {{ DiscussionBoard.errors[3401929].message }}
  • Profile picture of the author pc101seo
    I was very keen to know the difference between the table and div as most of the webmaster's preferred DIVs than Tables. Why SEO says that using div is better than table. After reading on various blogs and forums I have analyzed some good reasons for preferring DIVs than Tables. Below are the data which I have collected, I hope this will help you in knowing the benefits of div over tables.

    1. Div Loads faster than Tables
    2. Tables can be inflexible
    3. Accessibility issues are easier with DIV
    4. Tables don't print as well
    5. Div is great for SEO - powerful to do content positioning. So basically you can place the bulk of your rich content closer to the top of your HTML code, but it will still render on the browser in the same place
    6. DIVs can reduce the size of page - Use of DIVs and CSS can allow you to reduce the size of your HTML significantly, depending on how nested your tables are. TABLE tags require, TR, TD, and some cases include, TH, THEAD, TBODY, TFOOT. This adds quite a few tags that can all be condensed into a few DIVs.
    {{ DiscussionBoard.errors[3402465].message }}
  • Profile picture of the author wowohwowdesign
    It is my understanding that Google can only "try" to index your site with table based designs due to all the extra code necessary to make it function. Divs and CSS are definitely the way to go.

    JasonGarland
    {{ DiscussionBoard.errors[3402531].message }}
    • Profile picture of the author jminkler
      Originally Posted by wowohwowdesign View Post

      It is my understanding that Google can only "try" to index your site with table based designs due to all the extra code necessary to make it function. Divs and CSS are definitely the way to go.

      JasonGarland
      huh? how did they survive in late 1990's then?
      {{ DiscussionBoard.errors[3407218].message }}
  • Profile picture of the author iphonesupport
    i prefer div over tab. as seo's point of view, with the use of div there is a decrease in the ratio of code to content, the web crawlers would be able to find your site’s content pretty easily.
    {{ DiscussionBoard.errors[3403879].message }}
  • Profile picture of the author RyanAndrews
    HTML5 semantic block level elements?
    Yeah, too soon.
    {{ DiscussionBoard.errors[3418963].message }}
  • Profile picture of the author watchamakalit
    DIV for me!
    {{ DiscussionBoard.errors[3463818].message }}
    • Profile picture of the author bodiddley
      If you're doing simple landers, then use tables if you're not already familiar with CSS layouts. CSS can be a blatant violation of the KISS principle. All of these turd-polishing, sugar-coating closeted masochistic nerds evangelizing CSS can shut it.
      Signature

      {{ DiscussionBoard.errors[6931907].message }}
  • Profile picture of the author cssbros
    Definitely DIVS's.

    Though there are cases that table are the best choice, take example for tabular data.
    {{ DiscussionBoard.errors[6932388].message }}
  • Profile picture of the author PaceSolDallas
    divs for the website development and for any data/form we use tables.
    {{ DiscussionBoard.errors[6932550].message }}
  • Profile picture of the author JohnnyS
    Originally Posted by sortshots View Post

    What is better to use? "div" or "tables"???????
    it depends on the use..

    for layout purposes you should use DIVs it's more flexible than creating a layout using a table.

    if your presenting a tabular data such as stats it's better to use a TABLE rather than creating a table by using a div.
    {{ DiscussionBoard.errors[6932583].message }}
  • Profile picture of the author Greg71
    Use divs for everything, unless it's tabulated data.

    For example, if you have a restaurant website, the menu could be put in a table with 3 columns.

    One column is for item names, the next is for "Small" and the next for "large" size dishes/ drinks, containing prices.

    The advantage of using the table is that it makes it easier to align everything.

    Example: http://www.cafe235.com.au/coffee-menu
    {{ DiscussionBoard.errors[6932919].message }}
  • Profile picture of the author nstephan
    Tables can be used, but DIV's are seen more on higher end sites, kinda personal preference if you know what your trying to achieve!
    {{ DiscussionBoard.errors[6935961].message }}
  • Profile picture of the author vgvetter
    WordPress could not exist without tables!
    {{ DiscussionBoard.errors[6936374].message }}

Trending Topics