I’ll build it in HTML first, and then design it in Photoshop
Many beginners are so excited about HTML that they completely neglect the design phase and go straight to their text editor. DON’T DO THIS! At least grab a paper and pencil and jot down some rough sketches! If you go straight to HTML you will lose sight of the bigger picture and the overall design will suffer as a result.
I’ll just export it from Photoshop
Photoshop is a great tool for designing interfaces but you should NEVER rely on it to generate your HTML. I don’t care what version of Photoshop you own, it simply can’t create the lean, standards based code that you can by hand.
The only time I would recommend using Photoshop’s HTML feature is if you want to create a semi-usable website for your client as a prototype.
I don’t know how to code, I’ll just use the design view
No no no no no!
There’s no way around it, if you want to produce quality HTML designs you’re going to have to use the code view. In fact, I would just recommend turning off design view entirely because they are notoriously unreliable. Do yourself a favor, code it by hand and use the browser to see your changes.
Tables are great for layouts!
There is no excuse for using tables for your layouts. Let me say that again, there is no excuse for using tables for your layouts!
Tables were the norm about 10 to 12 years ago and even then they were on their way out! I can’t tell you how much it irks me to see “modern” websites using that old method, there’s absolutely no reason for it. Instead, use DIVS and CSS to make your layouts, they download faster and are more accessible.
It looks fine, I don’t need to close that tag.
Sometimes I see people using just one <li> or <p> tag. Though it might look “OK” in your development browser it can cause unpredictable behavior in your website that would be hard to fix if you didn’t know what to look for. Just do yourself a favor and close that damn tag!
Tag attributes are handy!
Tag attributes such as <font> and <center> used to be the only way to handle fonts and alignment but there are much better ways now and there’s no reason to use those anymore.
DOCTYPE?
Gone are the days where all you had to do was put <html> in the text editor. New browsers are more complicated and can handle more types of information. As a result you need to tell it how you want to display your content. Is it HTML 4? XHTML? strict? transitional? The browser can’t guess for you!
Character what?
Do you know about character encoding? Have you heard of UTF-8 and ISO-8859-1? Do you know what they do?
Tags can go anywhere inside the body tag
Don’t confuse an inline element with a block element! EVER! No that <div> tag won’t fit nicely in your <span> tag. And don’t cheat by declaring all your span tags a block element in your CSS either.
CSS is a great video game!
There is something wrong (and scary) about this statement. Please please please, don’t confuse Counter Strike Source with Cascading Style Sheets! If you don’t know what CSS is go out and get a book or give up entirely!
Comments
Post by gSvoren on February 10, 2010
Hello, I agree. There are many things that people do wrong, many of which I must admit I've done myself. But the funniest is really how people confuse CSS (the game) with CSS (the stylesheets). Good blog entry, but with a tad of hate in it. Might seem intimidating to many! :)