Lets face it. When you’re first starting out in this “web design stuff” it can be pretty intimidating. There’s tons of information to learn, questions popping off in your head, curiosity about how things work, worry if you’ll ever be as good as some people, or just the thought of where to start. Hopefully the following tips will ease that headache and get you on your way. (Disclaimer: The following assumes you have basic HTML and CSS knowledge)

5. Semantic Markup

Practicing semantic markup and getting it right is a godsend. Do your absolute best to stick to the rules the w3c has layed out, they’re there for a reason. If you write proper code it serves the best chance of displaying correctly across all the different types of browsers out there. (even that one…internet exploder) Do you always have to stick to the rules? That’s up to you. Sure you won’t get fined money, or beaten by the mafia if you don’t use semantic markup, but if headaches are your thing you go right ahead and code the way you want.

4. Reset  Your Styles - Reset.css

Ever start building a site and things start to look different across multiple browsers? The list you just put in is just right in firefox, but about 10px off in IE. That’s due to default settings in each browser. A reset stylesheet would do just that, reset everything to zero. Some will argue that its not smart to reset EVERYTHING and that some settings are good, but I’d rather just reset all of them and start with a clean plate. The following is the stylesheet that I use in my projects. It was written by Nick rigby, an author on the A list apart site. (Hint: great place to learn).

Reset Styles for all browsers - Author: Nick Rigby
body, blockquote {
margin: 0;
padding: 0;
font-size: 62.5%;
background: #FFF;
font-family: Arial, verdana, sans-serif;
color: #000;
}
p,em{
margin: 0;
padding: 0;
}
a img, iframe { border: none; }
/* Headers
——————————*/
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-size: 100%;
}
/* Lists
——————————*/
ul, ol, dl, li, dt, dd {
margin: 0;
padding: 0;
}
/* Links
——————————*/
a, a:link {}
a:visited {}
a:hover {}
a:active {}
a:focus{outline: none;}
/* Forms
——————————*/
form, fieldset {
margin: 0;
padding: 0;
}
fieldset { border: 1px solid #000; }
legend {
padding: 0;
color: #000;
}
input, textarea, select {
margin: 0;
padding: 1px;
font-size: 100%;
font-family: inherit;
}
select { padding: 0; }
.clear{clear:both;}

3. PHP Includes

Lets say you’ve got a huge site to manage, 100+ pages. The navigation for the site is just FULL of links that go in all kinds of directions. Now, imagine your boss asked you to add just 1 link to the navigation. No problemo!….except for that one where you have to add the link to…100+ pages! With includes, you’d only have to add that link to one file. Yep! just one file.
There’s plenty of different formats depending on what kind of server you’re developing on.

php includes
<? include(nav.php); ?>

or

asp includes (enclosed in html comment tags):
<!--#include file="file.inc"-->

Just to name a few. So basically, where you write the include line, the contents of the file being called are written or “included” into the page in place of the include line.

2. Use Shorthand CSS

Nah, you don’t have to use shorthand when you write css, but it helps to do it. By writing shorthand css you decrease the amount of code in your css file, making it easier to update down the road. The smaller file size css document is also parsed faster than the larger one….duh. Say you have:

font-family: arial, helvetica, sans-serif;
font-weight: bold;
font-size: 11px;
margin-top: 5px;
margin-right: 4px
margin-bottom: 3px
margin-left: 2px;

This chunk of css can be broken down into only 2 lines.

font: bold 11px arial, helvetica, sans-serif;
margin: 5px 4px 3px 2px;

BAM! If you can do that across your entire stylesheet it’ll keep it nice and short for easy updating down the road.

1. Take a break

Yeah, take a break. Whenever you get frustrated with something you start to get angry at it. And being angry usually clouds everything and that doesn’t really help you solve your problem. Or just to break the monotony of the work, go play a flash game for 10 minutes, smoke a cigarette if that’s your thing, whatever. Just do yourself the favor and get away for a brief amount of time. Don’t worry, the project will be there when you get back.