The Importance of Clean Syntax and Markup

When it comes to writing code, obsessive compulsive behavior tends to help me out and save my ass at times. I’m one of those people that have to cross every ‘t’ and dot every “i”… Web development has gotten very strict when it comes to XHTML Validation and W3C Validation. The use of the correct html tags and doctypes can actually make your website appear to perform better. I’ve experienced the ways browsers can tend to manipulate the markup differently in many different ways and how to avoid these problems. Also when writing code it is best to use clean coding practices. Another important aspect is to nest your tags correctly, this applies to almost all coding languages.

Some “Cleaner” Markup Tips and Tricks

When writing PHP, I usually go to a new line to place my open and closing curly bracket. So it would appear like so:

< ?php
if ( $foo == $bar )
{
    if ( $bar == $foo )
    {
        echo "Hello World!";
    }
}
else
{
    echo "Line up your cursor to the curly brackets and start scrolling with your wheel!";
}
?>

After lining up your cursor to the curly brackets and scrolling, did you notice how easy it was to figure out what control structure was opened or closed? This could potentially save you about half an hour of searching and finding what conditions are within what control structures. It’s important to use this strategy especially when you have over thousands of lines of code to work with.

Nesting HTML Markup Correctly

In order to have perfect XHTML/HTML Markup and pass the W3C Validation, you must nest your html attributes appropriately. An example of correct nesting procedures vs. incorrect method is below.

Good Markup

<strong><small>HELLO WORLD!</small></strong>

When nesting your tags, you must nest them within each other rather than, messy. Of course I wouldn’t ever write multiple elements all at once. Instead I would use either a DIV or a SPAN tag with an id or a class that calls the style from a cascading style sheet (CSS). This would be the correct XHTML approach.