Tables or CSS or Neither?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Frinavale
    Recognized Expert Expert
    • Oct 2006
    • 9749

    Tables or CSS or Neither?

    I found this really great article I just wanted to share with everyone.
    Hope you find it as informative as I did.

    http://www.mcu.org.uk/articles/tables.html
  • drhowarddrfine
    Recognized Expert Expert
    • Sep 2006
    • 7434

    #2
    Here is a better one.

    Comment

    • AricC
      Recognized Expert Top Contributor
      • Oct 2006
      • 1885

      #3
      Bottom line use tables for displaying data use CSS for formatting/layout. Although, using CSS for displaying data is a very viable option too.

      Comment

      • vituko
        New Member
        • Dec 2006
        • 48

        #4
        For me the concept of layers is much more flexible and powerfull and for the browser is even lighter. The capabilities for structure graphically a document are unbelivebly much more advanced.
        CSS2 can be enough but javascript + CSS2 is... and wait also for CSS3...
        CSS kernell attributes :
        display (block/inline/none and even table, but no universal and we would be working back with tables)
        overflow (hidden/scroll/visible)
        position absolute : the first way, the block doesnt follow the flow of its container and is independent of its brothers. For me this way without js isnt full.
        position relative : the second way, it flows vertically.
        Float / clear : it flows also horizontally and allows an effect that remind tables but better.
        position static : default, it doesnt move.
        position fixed : I heard it will finally work with ie7, doesnt scroll.
        With png and opacity / filter: alpha(opacity=X X) the posibilities grow. There is also svg (not really yet for me but soon). What else can anybody want ?

        Excuse my english ;)

        Comment

        • AricC
          Recognized Expert Top Contributor
          • Oct 2006
          • 1885

          #5
          Originally posted by vituko
          What else can anybody want ?
          Peace on earth and good will to men?

          Comment

          • steven
            New Member
            • Sep 2006
            • 143

            #6
            Originally posted by Frinavale
            I found this really great article I just wanted to share with everyone.
            Hope you find it as informative as I did.

            http://www.mcu.org.uk/articles/tables.html
            That article was written early 2002. The data and it's arguments are now null and void.

            Comment

            • drhowarddrfine
              Recognized Expert Expert
              • Sep 2006
              • 7434

              #7
              As a note:
              1) There is no such thing as 'layers'. Layers is a Dreamweaver term for positioned divs but is confusing to those of us who don't use Dreamweaver because 'layer' can mean several different things. Call a div a div.
              2) 'filters' are IE only and non-standard.

              Comment

              • AricC
                Recognized Expert Top Contributor
                • Oct 2006
                • 1885

                #8
                Originally posted by drhowarddrfine
                As a note:
                1) There is no such thing as 'layers'. Layers is a Dreamweaver term for positioned divs but is confusing to those of us who don't use Dreamweaver because 'layer' can mean several different things. Call a div a div.
                2) 'filters' are IE only and non-standard.
                Dr don't you think the gradient tool is at least somewhat neato?

                Comment

                • Frinavale
                  Recognized Expert Expert
                  • Oct 2006
                  • 9749

                  #9
                  Originally posted by steven
                  That article was written early 2002. The data and it's arguments are now null and void.
                  This article isn't completely null and void. How would you know to work around the issues brought in the article if you were just starting to get serious about website design?

                  People are still going to use legacy browsers...and blind people still use software that reads web pages aloud...and PDA and cell phone browsers are being used more and more these days. These issues are still relevant to this day and will be for many years to come.

                  I was completely surprised by this article because I was taught to use tables for web-page layout and not so much about <div>'s and CSS. I had no idea that accessibility problems like these would be an issue.

                  Also I'd like my sites to load faster...and I'm still a little cautious about CSS since it doesn't always display data in all browsers the way I'd like. Although I'm just starting to get serious about learning CSS too.

                  After reading that article I know now that I have a lot of learning to do when it comes to website design. It was inspiring for me.

                  -F

                  Comment

                  • AricC
                    Recognized Expert Top Contributor
                    • Oct 2006
                    • 1885

                    #10
                    Originally posted by Frinavale
                    This article isn't completely null and void. How would you know to work around the issues brought in the article if you were just starting to get serious about website design?

                    People are still going to use legacy browsers...and blind people still use software that reads web pages aloud...and PDA and cell phone browsers are being used more and more these days. These issues are still relevant to this day and will be for many years to come.

                    I was completely surprised by this article because I was taught to use tables for web-page layout and not so much about <div>'s and CSS. I had no idea that accessibility problems like these would be an issue.

                    Also I'd like my sites to load faster...and I'm still a little cautious about CSS since it doesn't always display data in all browsers the way I'd like. Although I'm just starting to get serious about learning CSS too.

                    After reading that article I know now that I have a lot of learning to do when it comes to website design. It was inspiring for me.

                    -F
                    Most people are/were taught to do layouts with tables this is for the sake of simplicity. As you get more familiar with CSS you can start using DIV's to replace tables. One thing that hasn't been mentioned is make sure you are using the correct strict doctype and that you are validating your code. As for the differences in browsers, you should test your pages with at least IE & Firefox/some browser that supports standards.

                    HTH,
                    Aric

                    Comment

                    • drhowarddrfine
                      Recognized Expert Expert
                      • Sep 2006
                      • 7434

                      #11
                      Originally posted by AricC
                      Dr don't you think the gradient tool is at least somewhat neato?
                      63% of the visitors to one of my sites do not use IE so, no. I do gradients with other methods.

                      Comment

                      • drhowarddrfine
                        Recognized Expert Expert
                        • Sep 2006
                        • 7434

                        #12
                        you should test your pages with at least IE & Firefox/some browser that supports standards.
                        That leaves out IE. ;)
                        Test using Firefox or Opera. Then you can adjust for IEs quirks and bugs.

                        As one who only started coding for the web three years ago, maybe less, I have never used tables for layout because CSS was readily available and made more sense to me.

                        If you are going to start learning CSS and you've come from a tables background, you have to force yourself not to think of the layout in a tables fashion. So often I see people trying to create rows and columns of divs trying to recreate a table which is either unnecessary or complicates the layout.

                        Comment

                        • AricC
                          Recognized Expert Top Contributor
                          • Oct 2006
                          • 1885

                          #13
                          Originally posted by drhowarddrfine
                          63% of the visitors to one of my sites do not use IE so, no. I do gradients with other methods.
                          You mean images? Over 50% of the world still uses IE you can't just throw that stat out. The filter gradient with IE is cool (not that I would recommend using it) I don't care what you say!

                          Comment

                          • drhowarddrfine
                            Recognized Expert Expert
                            • Sep 2006
                            • 7434

                            #14
                            What I'm saying is that filter won't work on any browser but IE so it doesn't do any good if you want the effect to appear in any other browser. That means more than half of the visitors to that one site of mine would never see the effect, so I don't use it but would do so with other CSS means.

                            Cool does you no good if it can't be seen. And you can't throw out half of your other viewers either.

                            Comment

                            • AricC
                              Recognized Expert Top Contributor
                              • Oct 2006
                              • 1885

                              #15
                              I agree with you on that front ( just think they're neat ) do you use any method other than images with CSS?

                              Comment

                              Working...