Using Div Instead Of Table

by 13 replies
17
What is the advantage of using div instead of table?




With Best Regards
Natarajan R (UI Designer)
KAPSYSTEM (International Bulk SMS Services, Web Designing Company, Payment Gateway India, USA, UK)
#website design #div #table
  • hi Natarajan,

    below i am listing down the 10 advantages of using css
    1. Faster page loading
    2. Lowered hosting costs
    3. Redesigns are more efficient
    4. Redesigns are less expensive
    5. Visual consistency maintained throughout website(s)
    6. Better for SEO
    7. Accessibility
    8. Quick website-wide updates
    9. Easier for teams to maintain (and individuals)
    10. Increased usability
    hope this 10 points will help you to understand as to why css is better than table in designing.
    • [1] reply
    • I think Faster page loading is main, Browser did't show table until it's full load.
  • The time to use tables is with tabular data.

    Fred
  • I think learning how to build sites in tables is a good way to start. It helps your mind piece together designs. Once your decent at it, switch over to divs
  • First of all, Divs are part of the web standards and you should definitely design your pages by those standards.
    By doing so you get better SEO as you are able to seperate information from the structure of your website. Webpages also become lighter when using divs (css) instead of tables. The ease of maintenance also improves as you don't have to individually change every page but you can just change the style.css file.

    Hope this helped.
  • If you are making a ridiculously simple website, then tables might be OK.... but if you are beginning a project that you want to develop, or even has the slightest possibility of getting additional content being added, you are going to wish you had used div tags instead. It is MUCH cleaner programming. It helps with SEO. Adheres to web standards (always a good thing). And it is much better at differentiating the different sections of your website.
    • [1] reply
    • [QUOTE=pronoun;4312989]If you are making a ridiculously simple website, then tables might be OK.... but if you are beginning a project that you want to develop, or even has the slightest possibility of getting additional content being added, you are going to wish you had used div tags instead. [...]/QUOTE]


      Soooo right! I am building my first website by scratch myself with HTML - something very simple.

      Well, I thought it was a simple layout. Everytime I have to add anything more than one word somewhere I am having the nightmare of my life... Tables start jumping one on top of the other, disappear, you find them in the opposite corner etc...

      If I was to build other sites I would most likely go for a pre-formatted template.

      But it doesn't look like it is going to be anytime soon...
  • The most important advantage from my point of view is its flexibility as it is much easier to modify a site later using div layout as compared to table layout.
  • There's an awesome Smashing Magazine article about this at
    Table Layouts vs. Div Layouts: From Hell to… Hell? - Smashing Magazine

    This has been one of the biggest issues in design community for years.
  • Here are couple advantages from the top of my head:

    - screen readers - people with impaired vision that use audible readers can browse your website normally where in Table layout it gets all messed up. Most of the Government and Public service websites are done with Accessibility in mind.

    - mobile browsing or browsing on smaller screens can cause tables to act unpredictably. Most smartphone can adjust autozoom based on your divs; doesn't exactly happen with table.

    - divs sizing is independent of each other. Once you start nesting tables, making one cell bigger pushes adjacent cells to be bigger too.

    BTW, great link SJL!

    also HTML should be written in XML format. By using table for "visual" representation in HTML code is not very XML-ish. CSS must dictate formatting, not XML code.
  • Divs along with good CSS formatting give you far more control over how your content looks and how's it's rendered to the end user...

    I used to be all tables when I very first started out but once I got my head around divs I never looked back
  • If you're learning how to design websites for a living then you'd best learn how to use div's.

    If you're building quick websites for yourself to earn a side income, you'd still better learn how to use div's.

    Why? Because you'll thank yourself later with all the time you will have saved from using the right method to build a website.
  • Use div's, float them as needed, and don't think that anyone has mentioned, but you will want to get yourself cozy with the "clearfix" CSS code...will save you lots of headaches trying to figure out why your divs are on top of one another...read this:

    Developer's Notebook: Forward-thinking CSS float-clearing | Pathfinder Software

Next Topics on Trending Feed