EggHeadCafe Site Layout Changes for 2012

Robbe discusses the major layout changes to EggHeadCafe. Get some insight about advertising and search engine optimization.

Earlier this year, EggHeadCafe hired an agency to review the entire site. It had been through all sorts of changes over the last 10 years but noone other than myself or Peter had reviewed what we were doing from a search engine optimization as well as a usability perspective. In 2011, a lot has changed in the search engine world especially with Google. They have pretty much turned the world upside down and sideways via changes to their algorithms most noteably through updates code named Panda. Changes in Google Adsense and the general advertising market have also been felt here at EggHeadCafe. Some due to the economy and how it affects Information Technology departments and vendors as well as how visitors interact with ads.

We figured with all of these changes going on, it was time to conduct a long overdue external review. What we have found is that the hundreds of thousands of backlinks from other forums, articles, rss feed publications, etc. have drastically changed in ranking value from previous years. The whole landscape has changed. In fact, if you look at the whole tech forum landscape, you'll see a negative trend. EggHeadCafe was also provided with a great deal of information as to how social media such as Twitter and Facebook play a much bigger role in search rankings than they did even one year ago. We do utilize Twitter and Facebook but have yet to form a strategy for getting the most out of them.

As part of the external review, I also started to look closely at a typical daily visitor to EggHeadCafe. Our visitors almost always come from a search engine query (usually from Google - very little love from Bing) where an IT professional has a problem or question to address and they are looking for a specific answer to that question. Once they find their answer (hopefully), they quickly return to their task and leave the site. It was this simple concept that has driven much of the new user interface to EggHeadCafe. Make the pages more readable and have the content focus only on the issue at hand. This meant making better use of screen real estate and either moving or removing extraneous things like site navigation, biographies, and author photos. As Joe Friday used to say on Dragnet, "just the facts ma'am". In our first release, there have been some successes and some failures that I'll touch on more below.

To help visitors out, in 2010 we introduced a well received feature for related items at the bottom of content pages. We created these by using dtsearch to manage an internal search engine with snippet extraction capabilities on all EggHeadCafe content pages. On those pages that our algos did a good job of determining keywords, this feature worked extremely well. On others, not so much. We received numerous comments from members as well as non-members that this was a useful feature because they could quickly find other code samples that referenced a similar method, event, property, or functionality that originally brought them to the page. This was particularly useful with rarer keywords. Unfortunately, in 2011, Google's algos started seeing these related item sections as on-site duplicate content. So, we were forced to remove a useful feature to serve the Google gods. Insert colorful adjective of choice here to express my feelings on that...

In an attempt to attack the related item concept from a different angle, I started tracking all of the keyword search phrases and words used to find a given page. When the page is rendered, my code picks up the top 7 phrases or words based on visitor usage and displays them at the top of the page in the form of links to our own search engine. Essentially, I'm letting our visitors tell use what is important on the page. My original intent was to display the total number of pages on EggHeadCafe that contained that word or phrase but the performance just wasn't fast enough on the fly. So, the counts you see are visitor counts. I may revisit this in the future as I think the total page count on a given subject is of far more use to the visitor.

As more and more visitors find the page from a Google search, the more accurate the keyword targeting. While it has only been out for a week or so, our page views versus visits is up about 10% even though the site navigation has been removed from the view of non signed in members. I expect that to improve as our search keyword history improves. One interesting thing that has come from this endeavor is that people are horrible spellers. However, Google's algos seem to understand visitor intent. The keyword history also gives you a feel for how people search specific subjects. Over time, we hope to write content that targets these behaviors better.

Internal Site Adjustments

The internal factors that needed to be addressed focus largely on url seo optimization across the site, reduce on-site content duplication, drastically reduce the total number of urls indexed in the search engines, and reducing our html code to human readable text matrix.

Reduce Total Urls Indexed

We've identified via Google Webmaster Tools that our listing pages (and their myriad of different filter options) have created millions of urls that are indexed. In previous years, this really didn't have much of an affect on the ranking of the overall site. In 2011, that has changed. To compound the problem for us, we had dynamically created forum post summaries and used them on these listing pages. The net affect of that is that Google now sees those summaries (and they myriad different ways they can be found) as on-site duplicate content. That means that millions of urls on EggHeadCafe were seen as problem pages for Google. To address this issue, I've done a couple of things. First, remove the summaries from the listing pages and alter the page layout. Second, take steps to suggest that the search engines not index the listing pages at all by using a meta tag for no index.

Improve Url SEO Optimization

In some places on the site, we were already adding the topic to the url but not all. That has been changed. As a general rule, you want to get as many keywords that actually exist in the page in your url while still keeping the url as small as possible. We do a combination of keywords as folder names as well as dash delimited keywords as filenames. The one area I wanted to change was to remove the Guids from the article and faq urls but the level of effort was just to great. Whenever you request a content page on EggHeadCafe, our code compares the url used with what the url should be and issues a Response.RedirectPermanent(validUrl, false); call when they don't match. So far, this seems to work properly. We've noticed that it takes awhile for Google WebMaster Tools to pick this up though.

Site Speed

We've moved our page logging from the page load to an offline process. We significantly reduced the amount of css and total number of images used and moved virtually all of our fixed images to static.eggheadcafe.com where no logging occurs. Moved css and scripts to folders where we could disable IIS logging. Tuned a few major queries. Google Web Master Tools already shows a steady trend towards faster page load times.

Html Code To Human Readable Text Matrix

Ultimately, this meant moving away from our knarly use of nested tables within nested tables that have been used for 10+ years now. Tables work really well for the wide variety of screen resolutions, browsers and browser versions, and constraining the effects of html pasted into our forum posts from members. It was strongly suggested to move our content pages (forum threads, faqs, and articles) to a DIV tag based approach and try to use as few of them as possible. Our articles and faqs were the easiest to change. The forum posts were an entirely different animal.

The DIV tag based approach exposed serious issues with individual builds of IE compounded by differences with Compatibility View settings, and differences between older and newer versions of FireFox and Chrome. One of the bigger issues that affected numerous areas of the site was how different builds of IE (even differences across builds of IE 8) rendered DIV tags. In particular, hidden or collapsed DIV tags with HTML in them. DIV tag height and width properties in a "float" type layout scheme are important. Not all browsers will automatically render the width to 100% or the height appropriately by default. If you see wrapping of text where you wouldn't expect it, this is likely the issue.

The other major issue with a DIV tag approach is that it exposes unknown problems with pasted in HTML content in our forums. We clean out hazardous stuff but do not attempt to address the thousands of different things that could hose up a page. This is most common when a member pastes in html from another site (which we strongly discourage) to answer a question. Tables that contained this same HTML constrained the rendering much better in more browsers.

In an IT shop setting, one would need a couple of dozen virtual machines configured to test all of these. We don't have that here at EggHeadCafe and to be honest, I was just too lazy to do it. So, over 300 posts later from our EggHeadCafe members, I was able to get most of the issues fixed within a few days. Some of these issues (namely the Telerik editor we use for our forum posts) are not going to be addressed for older browsers. It is crap like this that drives me to Silverlight for web based business applications.

Advertising (got to pay the bills)

To improve the performance of our image and text ads, I created a page layout that is considerably different than what you see in most forums. Today, that view is only available to non signed in members. The idea is to remove all extranous links, names, dates, buttons, merit scores, etc... from the vertical view of the thread. This makes it read much like a piece of paper. I've found over the years that advertising performs much better when the eye is not distracted by other content, graphics, links, etc... This is especially the case with text ads.

On EggHeadCafe forum threads, you'll see that we have a large block of text ads (up to 10) in the form of a list (signed in members don't see these ads). You'd think this would have the potential to really irritate visitors. However, the click thru percentage is twice what a typical block of 4 or 5 ads would be. This is reflected across the board regardless of the subject matter. In fact, the larger the base of related/applicable/on target ads for a given subject, that percentage goes up. The really irritating part of using contextual based ads and their algo is that you often get unrelated ads show up higher in the list. So, if you restrict your ad block to 4 or 5 ads, you often get a block of completely irrelevant ads. Thus, your click thru percentage goes through the floor. By showing up to 10, you've got a much better shot that even a lower paying ad will get clicked because it is relevant. In the first couple of weeks, the click thru percentages are up in the new layout.

Our image based ads have largely been restricted to our new fixed header. This brings the readable content closer to the top of the page and reduces wasted screen real estate. In most months, we run banners for giveaways in this space upwards of 25% of the time, so I wanted to keep this visible as much as possible.

Forum Issues

Our signed in members quickly told me that just because one layout makes reading posts easier doesn't mean it makes the forum easier to use. During development, I didn't see the new layout as an issue but our members felt differently. Since they are more important, I quickly put out a different view for signed in members. Going forward, serious consideration is being given to permitting members to customize how threads are viewed. They would only see there own view. So, if they screwed it up, only they would be affected. EggHeadCafe has such a diverse member base that coming up with a single view that works for people is almost impossible.

Logo

I got so many emails from an old image I did with Dr. Dotnetsky drinking a martini and one of my own personal catch phrases "will code for booze" that I just had to do something with it. Neado Designs was given the simple assignment of creating a logo with an egg and a martini. What you see here is the first crack. Peter and I loved it so it stuck.

Summary

Well, this gives you some insight as to why I did the things I did. Still got some work to do but it has given us a bit of a boost in the areas I wanted to address quickly. Thanks again for all the help from our dedicated members! I tried to reward alot of you with forum content points for taking the time to submit bugs and screen shots.

By Robbe Morris   Popularity  (2447 Views)
Picture
Biography - Robbe Morris
Robbe has been a Microsoft MVP in C# since 2004. He is also the co-founder of NullSkull.com which provides .NET articles, book reviews, software reviews, and software download and purchase advice.  Robbe also loves to scuba dive and go deep sea fishing in the Florida Keys or off the coast of Daytona Beach. Microsoft MVP