Article 6M5SK CodeSOD: A List of Mistakes

CodeSOD: A List of Mistakes

by
Remy Porter
from The Daily WTF on (#6M5SK)

Yesterday we talked about bad CSS. Today, we're going to talk about bad HTML.

Corey inherited a web page that, among other things, wanted to display a bulleted list of links. Now, you or I might reach for the ul element, which is for displaying bulleted lists. But we do not have the galaxy sized brains of this individual:

<table style="font-family: Verdana;"> <tr> <td valign="top">  </td> <td> Google <br /> <a href="http://www.google.com" target="_blank">http://www.google.com</a> </td> </tr> <tr> <td valign="top">  </td> <td> Yahoo <br /> <a href="http://www.yahoo.com" target="_blank">http://www.yahoo.com/</a> </td> </tr> <tr> <td valign="top">  </td> <td> Bing <br /> <a href="http://www.bing.com" target="_blank">http://www.bing.com</a> </td> </tr></table>

Here, they opted to use a table, where each list item is a row, and the bullet is a literal symbol in the code.

For web developers of a certain age, we remember when laying out your entire page inside of tables was a common practice. This let you easily define distinct header, sidebar, and footer sections in an era before CSS and divs everywhere.

But they were never meant to be used like this.

proget-icon.png [Advertisement] ProGet's got you covered with security and access controls on your NuGet feeds. Learn more.
External Content
Source RSS or Atom Feed
Feed Location http://syndication.thedailywtf.com/TheDailyWtf
Feed Title The Daily WTF
Feed Link http://thedailywtf.com/
Reply 0 comments