PDA

View Full Version : Guidelines for creating better markup


456 Berea Street
13th Apr 2007, 03:25 am
I've mentioned several times here that I feel writing markup (or any other code, for that matter) is a craft. I take pride in writing as lean and clean code as possible. From the looks of things there aren't a whole lot of other Web professionals that feel that way, but we do exist.
One of them is Garrett Dimon, who has touched upon this subject before, and in Markup as a Craft (http://www.digital-web.com/articles/markup_as_craft/) (published at Digital Web Magazine) provides twenty-one guidelines that will help you create better markup. That's a lot of guidelines, but they are all relevant and contain very good advice. Highly recommended reading.
After reading Garrett's article I couldn't resist creating a list of what I think are the six most important guidelines for writing better markup:

Keep it simple. Keep your markup as simple as possible, which is often simpler than you may think at first.
No layout tables. This is obvious to anyone who has not been living in a cave for the last several years. Unfortunately, the caves seem full of Web developers. Tables are meant for marking up tabular data, not creating layouts. Use CSS instead.
Avoid classitis. Does every element you want to style with CSS have a class attribute? They almost certainly do not need to. Use descendant selectors (http://www.456bereastreet.com/archive/200510/css_21_selectors_part_2/) instead.
Structure and meaning first, presentation later. Focus on semantics and document structure while you are writing markup. Save the presentational thinking for when you are writing your CSS.
Know all HTML elements and attributes. Go through the Index of Elements (http://www.w3.org/TR/html4/index/elements.html) and the Index of Attributes (http://www.w3.org/TR/html4/index/attributes.html) in the HTML 4.01 Specification. You will probably make some new acquaintances. Read up on them and learn when to use them.
Validate, validate, validate. The markup validator (http://validator.w3.org/) is your friend, not your enemy. Anybody can make typos or mistakes. The validator will help you catch them and improve your markup. What would your most important guidelines for writing better markup be?
Visit site to read or post comments… (http://www.456bereastreet.com/archive/200704/guidelines_for_creating_better_markup/#comments)Add 456 Berea Street to your Technorati favorites. (http://technorati.com/faves?add=http://www.456bereastreet.com)
Posted in (X)HTML (http://www.456bereastreet.com/archive/categories/xhtml/).
http://feeds.feedburner.com/~a/456bereastreet?i=EX7B7E</img> (http://feeds.feedburner.com/~a/456bereastreet?a=EX7B7E)
http://feeds.feedburner.com/~f/456bereastreet?i=t35mC7yS</img> (http://feeds.feedburner.com/~f/456bereastreet?a=t35mC7yS) http://feeds.feedburner.com/~f/456bereastreet?i=gbxebDAm</img> (http://feeds.feedburner.com/~f/456bereastreet?a=gbxebDAm) http://feeds.feedburner.com/~f/456bereastreet?i=Fyy0yzUK</img> (http://feeds.feedburner.com/~f/456bereastreet?a=Fyy0yzUK)


More... (http://www.456bereastreet.com/archive/200704/guidelines_for_creating_better_markup/)