When implementing this for my fulltime employer, College Prowler, I stumbled upon a genius post by Matthew James Taylor who has a series on multi-column liquid layouts that are all cross-browser compatible and SEO friendly in the sense that I speak of above. I adapted it a little bit to account for some specific 10px margins and a specific navigation width of 300px, which you can also adjust. The requirements are quite simple to implement, and here’s how to do it:

The HTML:

<div class="mainWrap">
  <div class="mainSubWrap">
    <div class="mainContentWrap">
      <div class="mainContentSubWrap"><!--All your main content goes in here--></div>
    </div>
    <div class="navContentWrap"><!--Nav content goes in here--></div>
  </div>
</div>

The CSS:

.mainWrap {
  position: relative;
  clear: both;
  float: left;
  width: 100%;
  overflow: hidden;
  margin: 10px 0px;
}
div.mainSubWrap {
  float: left;
  width: 200%;
  position: relative;
  left: 290px;
}
div.mainContentWrap {
  float: right;
  width: 50%;
  position: relative;
  right: 290px;
}
div.mainContentSubWrap {
  margin: 0px 10px 0px 310px;
  position: relative;
  right: 100%;
}
div.navContentWrap {
  float: left;
  width: 290px;
  position: relative;
  right: 290px;
}

Basically you end up using relative positioning to move the navigation box over to the left of the main content box, and visa versa, yielding the main content appearing on the right side of your screen, but appearing first in your code. The benefit to this over a simple float is the ability to assign background colors that you want to fill to the bottom of the screen regardless of whether or not the background colored div is the largest in height. It is also pretty much a sure bet that it won’t break across browsers.

Definitely give it a shot, and if you have any questions, don’t hesitate to ask!

Okay, first a definition. Simply put, Search Engine Optimization is an attempt to get your website higher up on search results run by Google, Yahoo, et cetera. Why is this important? Don’t you want visitors!?! Search engines are the best marketing tool out there. You’ll never come close to getting more direct or referral traffic than search traffic to your website (unless you are as big as say facebook.com for example). Even the biggest of businesses such as Amazon.com still rely very heavily on search traffic. So how can you push yourself higher on those results?

Well, there are countless articles out there trying to tell you how to perform SEO. I’m not saying you should listen to me, in fact, I consider myself a novice when it comes to SEO, but I do have a few easy suggestions that just about anyone can do.

1. Make sure to set up a redirect between the www and non-www version of your website. Search engines see http://www.example.com as a different site than http://example.com. If you set up a permanent redirect, then search engines will bump you up higher, links to your site will be consistent. Here is a great tutorial on it.

2. Register with sites like dmoz and yahoo and zoominfo. These sites are essentially listings of websites and companies and people. Being listed on these helps show search engines that your website is essentially more reputable than websites not listed there. Yahoo costs money, but dmoz is free. Hurry up though, it can take months for them to get you on the list!

3. Write a BLOG!!! I know, ironic right? The reason that I started this blog in the first place was to drive more traffic to my site. Sites with blogs have tons more content, and because the content is constantly changing and updating, it is much more likely to pop up in search results. Even more than that, people might start bookmarking your blog posts on sites like del.icio.us and digg.com. Bookmarks on these sites can drive hundreds of visits in under an hour once they are posted. Also, when there are bookmarks to your site from these websites, search engines use that as another form of validation that your content is useful, just like being listed in those conglomerate sites mentioned above.

4. Get lots and lots of links to your site. The more links that exist on the web to your site, the better. Search engines see those links as even more validation for your content. Try establishing relationships with other businesses you work with on a regular basis and get them to link to your site in return for a link to theirs. Make a facebook page for the website with a link. Anything that will add more links to your site out there in the web is good!

5. Lots of content, that you update, with good header tags. Google is known to use the content of a website to determine what is on it. Go figure right? In the past, all search engines used the Meta Keyword and Description tags, but then people started stuffing their tags with thousands of unrelated words in hopes of landing on tons of search results. As a result Google, and many other search engines have followed suit, do not use them anymore. Stick to under a dozen keywords, and then just pay attention to your content. Having useful header tags (h1, h2, h3, etc), lots of good content, preferably that you update, and purposeful images will do wonders.

I’m going to use this blog as a way to help drive traffic to my online portfolio. Also, working as a full-time web designer, I’ve discovered that whenever I can’t figure something out, I google it. More often than not, I end up on a blog site, reading someone else’s CSS trick that saves my life. Well, by now, I seem to have quite a few tricks up my own sleeve, so why not unite them under one roof?

From recent issues I’ve dealt with, here are a few of my upcoming posts that you can look forward to:

• HTML: Getting Started
• Screen Resolution
• CSS Basics
• Common IE6 Bugs
• Sticky Footers

Other suggestions are always welcome. We’ll see how I do with moderating/reading comments. Please feel free to make requests.