HTML Table WTF



  • Here's a page from one of my favorite sites, and I can't get over the sheer sloth of the person who coded it.  First off, it's done in ASP, which explains a lot.  But this guy/girl/person-of-unknown gender decided to layout a table which shows the list of videos in chronological order, except he left spaces for future entries.  How hard is it to stream the data until it fills the first column, then wraps to the next column, leaving the empty spaces at the end, not the beginning?

     



  • @TunnelRat said:

    this guy/girl/person-of-unknown gender

     



  • Well, I'm guessing since he wants to flow items from top down, and HTML tables naturally flow from left to right, the (n + count() / 2) calculation to figure out how to fill the second column was more than trivial to the creator of the page.



  • The real WTF are the banner ads and the BMI of The Guy From Boston.



  • @Sunstorm said:

    Well, I'm guessing since he wants to flow items from top down, and HTML tables naturally flow from left to right, the (n + count() / 2) calculation to figure out how to fill the second column was more than trivial to the creator of the page.

    It would still have looked better if it was in, you know, forward chronological order, with the empty spaces for future events at the end. If anyone else had posted this, we'd have been agreeing it's a WTF. Yes, TunnelRat is a dick, but we're falling into the trap of a logical fallacy argumentum ad TunnelRat - "if TunnelRat says it, it must be false"



  • Crap.  I feel into another trap.  If TunnelRat starts a thread, it must also be a blog post.  So I checked his blog to see.  It's not.  The WTF is that I've increased his blog's pageview count by one, not to mention the adviews. 



  • @belgariontheking said:

    Crap.  I feel into another trap.  If TunnelRat starts a thread, it must also be a blog post.  So I checked his blog to see.  It's not.  The WTF is that I've increased his blog's pageview count by one

    That's just his way of leaving empty spaces for future posts.

    It would still have looked better if it was in, you know, forward chronological order, with the empty spaces for future events at the end.
     

    It would have looked better without empty spaces because I don't want to know.



  • @Random832 said:

    @Sunstorm said:
    Well, I'm guessing since he wants to flow items from top down, and HTML tables naturally flow from left to right, the (n + count() / 2) calculation to figure out how to fill the second column was more than trivial to the creator of the page.

    It would still have looked better if it was in, you know, forward chronological order, with the empty spaces for future events at the end. If anyone else had posted this, we'd have been agreeing it's a WTF. Yes, TunnelRat is a dick, but we're falling into the trap of a logical fallacy argumentum ad TunnelRat - "if TunnelRat says it, it must be false"

    I didn't say it isn't a WTF. It's just a mild one.

    I'm possibly one of the few people here that doesn't mind TunnelRat.
     



  • On a totally diffrent issue that guy from boston has some serious issues. It actually makes tunnelrat look like a leftwing parade boy.

    http://www.theguyfromboston.com/playvideo1.asp?video=/videos/Illegal-Aliens.wmv
     



  • @PSWorx said:

    The real WTF are the banner ads and the BMI of The Guy From Boston.

    ROFL!!



  • @vt_mruhlin said:

    @TunnelRat said:

    this guy/girl/person-of-unknown gender

     

    Yeah, I'm sure that fat guy in the videos is also doing the coding of his website.

    Double duh. 

     



  • @TunnelRat said:

    @vt_mruhlin said:
    @TunnelRat said:

    this guy/girl/person-of-unknown gender

     

    Yeah, I'm sure that fat guy in the videos is also doing the coding of his website.

    Double duh. 

     

     

    Programmers are never fat...



  • @vt_mruhlin said:

    @TunnelRat said:
    @vt_mruhlin said:
    @TunnelRat said:

    this guy/girl/person-of-unknown gender

     

    Yeah, I'm sure that fat guy in the videos is also doing the coding of his website.

    Double duh. 

     

     

    Programmers are never fat...

     Correction: good programmers are never fat...  Chubbiness is an indication of laziness.

     



  • @Sunstorm said:

    Well, I'm guessing since he wants to flow items from top down, and HTML tables naturally flow from left to right, the (n + count() / 2) calculation to figure out how to fill the second column was more than trivial to the creator of the page.

    HTML really should have a <tc> (table column) tag so that you could flow tables from top to bottom.



  • @d3matt said:

    Correction: good programmers are never fat...  Chubbiness is an indication of laziness.

    Correction: All good programmers are lazy. That's why they write programs to make their lives easier. 


  • Considered Harmful

    @savar said:

    @Sunstorm said:

    Well, I'm guessing since he wants to flow items from top down, and HTML tables naturally flow from left to right, the (n + count() / 2) calculation to figure out how to fill the second column was more than trivial to the creator of the page.

    HTML really should have a <tc> (table column) tag so that you could flow tables from top to bottom.

    The real problem is table-abuse.  People use them incorrectly to achieve a certain look, but style is the role of CSS, not HTML.  Tables are for displaying tabular data.  Period.  What I see here is a list.  You can style a list to look just like that, if you want to.  Semantics are important. 



  • @Sunstorm said:

    Well, I'm guessing since he wants to flow items from top down, and HTML tables naturally flow from left to right, the (n + count() / 2) calculation to figure out how to fill the second column was more than trivial to the creator of the page.

    HTML really should have a <tc> (table column) tag so that you could flow tables from top to bottom.



  • @savar said:

    @Sunstorm said:

    Well, I'm guessing since he wants to flow items from top down, and HTML tables naturally flow from left to right, the (n + count() / 2) calculation to figure out how to fill the second column was more than trivial to the creator of the page.

    HTML really should have a <tc> (table column) tag so that you could flow tables from top to bottom.

    There's a <col> tag, but it doesn't do that (it basically just lets you put borders and a background on the column - you used to be able to set text alignment, but not with css)



  • @Zylon said:

    @d3matt said:

    Correction: good programmers are never fat...  Chubbiness is an indication of laziness.

    Correction: All good programmers are lazy. That's why they write programs to make their lives easier.

    Are you calling me fat? 



  • @bstorer said:

    @Zylon said:

    @d3matt said:

    Correction: good programmers are never fat...  Chubbiness is an indication of laziness.

    Correction: All good programmers are lazy. That's why they write programs to make their lives easier.

    Are you calling me fat? 

    Fat and lazy.



  • @joe.edwards@imaginuity.com said:

    The real problem is table-abuse.  People use them incorrectly to achieve a certain look, but style is the role of CSS, not HTML.  Tables are for displaying tabular data.  Period.  What I see here is a list.  You can style a list to look just like that, if you want to.  Semantics are important. 

     Yeah people abuse tables...but I don't see any reason why a grid needs to flow left-to-right instead of top-to-bottom. Imagine if your source data is already organized in memory top-to-bottom...you have to transpose the rows and columns just to display it.



  • @savar said:

    @joe.edwards@imaginuity.com said:
    The real problem is table-abuse.  People use them incorrectly to achieve a certain look, but style is the role of CSS, not HTML.  Tables are for displaying tabular data.  Period.  What I see here is a list.  You can style a list to look just like that, if you want to.  Semantics are important. 

     Yeah people abuse tables...but I don't see any reason why a grid needs to flow left-to-right instead of top-to-bottom. Imagine if your source data is already organized in memory top-to-bottom...you have to transpose the rows and columns just to display it.

     

    No you don't. You just have to think up a better way. You could for instance have 3 div containers that float to the left, each container, contains all the items from a single column. Thus making it possible to work per column instead of per row.

    <div>
        <div class="col" >
            <div class="rowitem">1</div>
            <div class="rowitem">2</div>
            <div class="rowitem">3</div>
        </div>
        <div class="col">
            <div class="rowitem">4</div>
            <div class="rowitem">5</div>
            <div class="rowitem">6</div>
        </div>
        <div class="col">
            <div class="rowitem">7</div>
            <div class="rowitem">8</div>
            <div class="rowitem">9</div>
        </div>
    </div> 


  • I'm sure the guy from Boston is taking all this in.

     

     


  • Considered Harmful

    @TunnelRat said:

    Yeah, I'm sure that fat guy in the videos is also doing the coding of his website.

    Double duh. 

     

    @TunnelRat said:


    I'm sure the guy from Boston is taking all this in.

     


     

     



  • @stratos said:

    @savar said:
    @joe.edwards@imaginuity.com said:
    The real problem is table-abuse.  People use them incorrectly to achieve a certain look, but style is the role of CSS, not HTML.  Tables are for displaying tabular data.  Period.  What I see here is a list.  You can style a list to look just like that, if you want to.  Semantics are important. 

     Yeah people abuse tables...but I don't see any reason why a grid needs to flow left-to-right instead of top-to-bottom. Imagine if your source data is already organized in memory top-to-bottom...you have to transpose the rows and columns just to display it.

     

    No you don't. You just have to think up a better way. You could for instance have 3 div containers that float to the left, each container, contains all the items from a single column. Thus making it possible to work per column instead of per row.

    <div>
        <div class="col" >
            <div class="rowitem">1</div>
            <div class="rowitem">2</div>
            <div class="rowitem">3</div>
        </div>
        <div class="col">
            <div class="rowitem">4</div>
            <div class="rowitem">5</div>
            <div class="rowitem">6</div>
        </div>
        <div class="col">
            <div class="rowitem">7</div>
            <div class="rowitem">8</div>
            <div class="rowitem">9</div>
        </div>
    </div> 

    Now, get those divs to automatically resize all together as in a grid to the width and height of the cell contents, and vertically center the data in them. Make it work in all browsers from IE5 up. Oh, and no Javascript. I'll be right here waiting.



  • Correction: All good programmers are never lazy to get their laziness.



  • @Sunstorm said:

    Now, get those divs to automatically resize all together as in a grid to the width and height of the cell contents, and vertically center the data in them. Make it work in all browsers from IE5 up. Oh, and no Javascript. I'll be right here waiting.

    Fuck if I'm going to support IE5(.5)



  • @dhromed said:

    @Sunstorm said:

    Now, get those divs to automatically resize all together as in a grid to the width and height of the cell contents, and vertically center the data in them. Make it work in all browsers from IE5 up. Oh, and no Javascript. I'll be right here waiting.

    Fuck if I'm going to support IE5(.5)

    I oppose all versions of IE up to and including the current release.



  • @m0ffx said:

    @dhromed said:
    @Sunstorm said:

    Now, get those divs to automatically resize all together as in a grid to the width and height of the cell contents, and vertically center the data in them. Make it work in all browsers from IE5 up. Oh, and no Javascript. I'll be right here waiting.

    Fuck if I'm going to support IE5(.5)

    I oppose all versions of IE up to and including the current release.

    Well, IE7: not that bad, in terms of CSS support. I wished IE6 would DIE already.



  • I'd still take an elegant solution that works in only Firefox/IE7/Opera. I have yet to see someone beat the flexibility and the power of the table tag.



  • @Sunstorm said:

    I'd still take an elegant solution that works in only Firefox/IE7/Opera. I have yet to see someone beat the flexibility and the power of the table tag.

    Tables are popular because they're inflexible. A table layout adapts to nothing and is hard to change.



  • @dhromed said:

    @Sunstorm said:

    I'd still take an elegant solution that works in only Firefox/IE7/Opera. I have yet to see someone beat the flexibility and the power of the table tag.

    Tables are popular because they're inflexible. A table layout adapts to nothing and is hard to change.

    It's relatively easy to make a layout with tables that uses the whole width of the browser window - or a certain percentage of that, with fixed-size borders and a variable-sized content in the middle.

    For example (warning: shameless self-advertizing) http://www.itek.at/alt/ganzneu-eng.html 

    Doing the same with CSS, in a way that works with all browsers, is not exactly easy. 



  • @ammoQ said:

    @dhromed said:

    @Sunstorm said:

    I'd still take an elegant solution that works in only Firefox/IE7/Opera. I have yet to see someone beat the flexibility and the power of the table tag.

    Tables are popular because they're inflexible. A table layout adapts to nothing and is hard to change.

    It's relatively easy to make a layout with tables that uses the whole width of the browser window - or a certain percentage of that, with fixed-size borders and a variable-sized content in the middle.

    For example (warning: shameless self-advertizing) http://www.itek.at/alt/ganzneu-eng.html 

    Doing the same with CSS, in a way that works with all browsers, is not exactly easy. 

    cough

    step1: put a div in your body.
    A div is automatically has a 100% width. ( although that's not the same as CSS width: 100% )

    step2: margin: 0 20px;
    The div now has 20px margin on either side.

    step3: border: solid 5px red
    The div now has a fixed size border.  


    For instance look at my webpage http://www.stratos-online.nl and if you want to know what flexible means, look at it in FF and look at the alternative style sheet that i'm working on.

    -edit- 

    Yes there are things that are difficult to do in CSS because of lacking support or because it's difficult to express directly what you want in CSS. Mostly this happens when you start to talk about vertical aligning because thats implemented a bit tricky and in some cases simply isn't possible. However 95% of all designs can still be implemented without abuse of tables. 



  • <div>
        <div class="col" >
            <div class="rowitem">1</div>
            <div class="rowitem">2</div>
            <div class="rowitem">3</div>
        </div>
        <div class="col">
            <div class="rowitem">4</div>
            <div class="rowitem">5</div>
            <div class="rowitem">6</div>
        </div>
        <div class="col">
            <div class="rowitem">7</div>
            <div class="rowitem">8</div>
            <div class="rowitem">9</div>
        </div>
    </div> 

     

    Doing the layout of the OP page like that is certainly not the best approach. As a matter of fact, I find it pretty [insert adjective here] to do it that way.

    That list is a TABLE, and as a table it should be done.

    Tables are not evil, I know there is a lot of misuse of tables (legacies of the pre-StykeSheet era), but I've seen the "CSSist Inquisition Church" going too far, too many times. (Just like the "XMList Order of Templars", and the  "ActionScript Freak Circus")

     


  • @fatdog said:

    <div>
        <div class="col" >
            <div class="rowitem">1</div>
            <div class="rowitem">2</div>
            <div class="rowitem">3</div>
        </div>
        <div class="col">
            <div class="rowitem">4</div>
            <div class="rowitem">5</div>
            <div class="rowitem">6</div>
        </div>
        <div class="col">
            <div class="rowitem">7</div>
            <div class="rowitem">8</div>
            <div class="rowitem">9</div>
        </div>
    </div> 

     

    Doing the layout of the OP page like that is certainly not
    the best approach. As a matter of fact, I find it pretty [insert adjective here] to do it that way.

    That list is a TABLE, and as a table it should be done.

    Tables are not evil, I know there is a lot of misuse of tables (legacies of the pre-StykeSheet era), but I've seen the "CSSist Inquisition Church" going too far, too many times. (Just like the "XMList Order of Templars", and the  "ActionScript Freak Circus")

     

    If you would have actually read what that message was a response of, you would have seen that it had very little to do with the layout from the linked site in the opening post.

    It demonstrates a easy way how you can implement side by side, columns where the items float to the top, instead of to the left.



  • @stratos said:

    @fatdog said:

    <div>
        <div class="col" >
            <div class="rowitem">1</div>
            <div class="rowitem">2</div>
            <div class="rowitem">3</div>
        </div>
        <div class="col">
            <div class="rowitem">4</div>
            <div class="rowitem">5</div>
            <div class="rowitem">6</div>
        </div>
        <div class="col">
            <div class="rowitem">7</div>
            <div class="rowitem">8</div>
            <div class="rowitem">9</div>
        </div>
    </div> 

     

    Doing the layout of the OP page like that is certainly not
    the best approach. As a matter of fact, I find it pretty [insert adjective here] to do it that way.

    That list is a TABLE, and as a table it should be done.

    Tables are not evil, I know there is a lot of misuse of tables (legacies of the pre-StykeSheet era), but I've seen the "CSSist Inquisition Church" going too far, too many times. (Just like the "XMList Order of Templars", and the  "ActionScript Freak Circus")

     

    If you would have actually read what that message was a response of, you would have seen that it had very little to do with the layout from the linked site in the opening post.

    It demonstrates a easy way how you can implement side by side, columns where the items float to the top, instead of to the left.

    I'm not reading anything, I'm right and you are wrong.. and I always behold the tru... oh wait... No I don't.

    Sorry, nevermind me, I just got carried away [insert long and boring excuse here].

     




  • @stratos said:

    @ammoQ said:
    @dhromed said:

    @Sunstorm said:

    I'd still take an elegant solution that works in only Firefox/IE7/Opera. I have yet to see someone beat the flexibility and the power of the table tag.

    Tables are popular because they're inflexible. A table layout adapts to nothing and is hard to change.

    It's relatively easy to make a layout with tables that uses the whole width of the browser window - or a certain percentage of that, with fixed-size borders and a variable-sized content in the middle.

    For example (warning: shameless self-advertizing) http://www.itek.at/alt/ganzneu-eng.html 

    Doing the same with CSS, in a way that works with all browsers, is not exactly easy. 

    cough

    step1: put a div in your body.
    A div is automatically has a 100% width. ( although that's not the same as CSS width: 100% )

    step2: margin: 0 20px;
    The div now has 20px margin on either side.

    step3: border: solid 5px red
    The div now has a fixed size border.  


    For instance look at my webpage http://www.stratos-online.nl and if you want to know what flexible means, look at it in FF and look at the alternative style sheet that i'm working on.

    -edit- 

    Yes there are things that are difficult to do in CSS because of lacking support or because it's difficult to express directly what you want in CSS. Mostly this happens when you start to talk about vertical aligning because thats implemented a bit tricky and in some cases simply isn't possible. However 95% of all designs can still be implemented without abuse of tables. 

    Sorry, I wasn't precise enough. I was thinking of custom borders, with rounded corners, pseudo-3d-textures and stuff.


Log in to reply