A while back while ranting about the lack of qualified (available) web developers I wrote that nasty piece of XHTML that I wanted people to try and correct/comment on.
The awesomeness:
<style>
#H1{
Font-size:10px;
Font-color:Red;
}Li{
Font-color:white;
}#greenBox{
Background-color:light-green;
}
</style><H1>Hello World</h1>
I’m not fat I’m big boned
<div id=‘greenBox’>
<li>Option 1
<li>Option 2
<li>Option 3
</div>Of course I want some cheesy poofs
<div id=‘greenBox>
<li>Option 1
<li>Option 2
<li>Option 3
</div>
(excuse the dodgy indenting)
Ok, here goes:
- No Document Type
- No <HTML>
- No <Head>
- No Body
- Embedded styles are tacky
- <h1> is an html element; even if it was possible to create an identity definition called h1 it would still be retarded.
- Fixed (px) sized fonts are not good for all kinds of usability reasons.
- There is no such thing as “font-color”
- While “Red” is currently understood by most browsers, the hex colour code would be a better choice for future compatibility.
- Setting your <li>s globally to a foreground colour of white is a bad idea. You’ll be constantly having to override that every time you want it black(ish) again. (I even created an element on the page called greenbox to show that the entire design was going to be on a white background)
- id style definitions (#greenBox) really shouldn’t hint at your current presentation (Colours or Layout). #greenBox is a bad name… especially in a years time when the design calls for that box to be purple.
- light-green is not a valid html colour.
- Personally I like to use lower case tags… but dammit, don’t mix them up. (H1, h1)
- Considering there is no <body>, the “I’m not fat I’m big boned is top level text. It should be inside a body, but additionally it would be better for it to be wrapped in a paragraph or label.
- <li>s by themselves, without being wrapped in a <ul> (unordered list) or a <ol> (ordered list) is bad form… but you’d be amazed at how often you see stuff like that on big sites like cnn.com etc.
- Reusing the “greenBox” identity will cause various issues in various browsers. It’s an obvious mistake but sadly not picked up by too many people.
- greenBox should probably be a class since it’s being used like a class.
- The second greenBox quote isn’t closed.
There you go. 18 without any repetition. I’m sure there are some I’ve forgotten. Engage lively debate *now*.
So we spent the evening listening to the lovely sounds of a wailing hammer drill… I’m all for home improvements and I understand that some people just don’t have the luxury of being able to do them during the day or over weekends, but once 10pm rolls around I really expect anyone who thinks they’re a decent human being to stop drilling holes in their walls.