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!

1. Enhance your user experience: Google analytics has tools to track the types of users you are getting. You can look at their location (in the world), their computer specs (computer type, screen size, operating system, browser/version), their viewing trends (page views, bounce rates, time on the site), and much more.

So why is this helpful? It allows you to design your site around your users. You know what browsers and versions they are using, so you can decide how much time to spend cross browser testing. You know what screen sizes your users are using, so you can figure out how wide you want your designs to be. You can see when you launch major changes to your site what happens to your user trends (did it cause an increase or decrease in the positive experience of your users). But these are all very broad things, let’s get more specific.

2. Test and improve specific content: Google analytics takes the first benefit a step further by allowing you to look at most of the above data and more with specific pages and sections of your site. This will allow you to test out smaller changes to your site by looking at user trending and navigation on specific pages or new sections that you just launched or changed.

So why is this helpful? Imagine you just put up a new section of your site that is a little more alternative to the standard navigation you have throughout the rest of your site, or the design is a bit more energetic and you aren’t sure how it will be received. Now, say a week after your launch, you can go back and see how your users interacted with the new section. You can see where they came from in the site to get there, what they did there, when they left, and where they left to go to. You can compare the visitor trends with the overall site averages and get a feel for whether the new design and/or navigation is an improvement to your site, or a detriment. It can then guide future changes to that section, or even the rest of your site!

3. Pimp out your SEO efforts: With the “sources” section of Google Analytics, you can track where your users are coming from, and how they are finding you. You can see how many users are coming in directly (typing in your web address or using a bookmark), through referring sites (external links), or through search engines. Then you can look at keywords that people used to land on specific pages within your site, or the site in general.

So why is this helpful? If you have been trying to up your SEO, then you can see how often people are linking to you (based on the rate of referring sites) and how effective you are at certain keyword searches that you are trying to optimize for. Knowing what people already land on your for and teach you what your site is doing well, and help you decide what other keywords you might want to focus more on.

4. Make some moolah: Lastly, Google Analytics allows you to track sales and other goals within your site. If you have specific items you are trying to sell, you can put in a specific goal that tracks it. Then you can see the paths those users took to get to that sale and optimize for it even more. To be honest, I haven’t focused on these tools much myself. For my own website, I don’t have much of a need for it with all the other customization options. For my work at College Prowler, though we do have sales, I tend to focus more on the user experience considering that is where my background is, and my boss looks at everything, including the sales “goals” and “ecommerce” options.

All of these sections have some additional benefits that Google Analytics is still testing out, in particular the “advanced segments” tool. This tool allows you to set up segments of your visitors or your site so that you can get even more detailed with your website’s statistics. Say you have too main sections of your site, and though they sometimes cross over with users, they are often relatively separate. You might want to see just what one half of the users are doing, as compared to the other half, because they really represent two completely different user bases. Again, it allows for even more customization to your user. There are some downsides to this tool though. In particular, you can create segments, but you can’t share them with co-workers that might be on the same analytics account, they are only available to you. I already emailed Google months ago and complained about this, but they are slow to respond to that kind of stuff. I think sometimes they pretend to be all focused on usability, but in reality, they lose that focus too often…

One more downside to Google Analytics is the slight inaccuracy of information. Data is never 100% accurate or reliable. This is a problem with really small sites where small differences can really cause issues with the data (because of low statistical power). Still, take everything you see with a grain of salt, but also put some trust in it. If anything, it will lead you in specific directions for real user testing! Overall though, fantastic tool!

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.