Finally, I decided to try WordPress. And I was surprised with simplicity, elegance and power. The first thing that came to my mind-I want my own template for WordPress.

As I told you some time ago, I’m definitely not Picasso, nor Dali. This means that people would not come to my web place, looking for fine art. All that I really want is a simple light design, easy to navigate, semantically correct, three columns with flexible width content area. I decided to have flexible width main area for content and 2 right sidebars with fixed width. I also wanted content area to load first, providing semantically optimized design.

Semantically correct design may give you some SEO advantages. What is more important, semantically correct approach may increase usability of your website. In our fast changing web environment, with thousands of websites, competing for the same search term, people are looking at your page for a couple of seconds. The sidebar may contain some slowly loading items. Some ads from your sponsors and etc. In this case your web page will load slowly and even choosing the fastest web hosting would not help. You may not be able to show your content and people may leave before page will load. The other advantage of semantically correct design is better indexing of your content. Do you know how long Google, Yahoo or MSN web spider will wait before it will try to capture your content? If it would not be able to get fast response, your content would not be indexed very well.

I tried this design concept before and described it in In search of the Holy Grail. True 2-3 columns CSS layout that works. Can’t say that I was completely happy with results. What I learned was: CSS is not suited very well for positioning and all major browsers are treating CSS rules differently. You may argue with me about these statements. You may tell that there are a lot of designs that involve CSS positioning and properly rendered by Firefox, Internet Explorer and Google Chrome. However, majority of proper designs with CSS positioning are fixed width CSS designs. Things are getting much worse when you try to combine flexible and fixed width columns of different height, header and footer.  

I made new research and found Matthew James Taylor’s article: Ultimate multi-column liquid layouts (em and pixel widths). I used his technique in my design approach. This resulted in Gadget Deals template for Wordpress. It is 3 column design with flexible main content area, 2 fixed width sidebars (both are right side sidebars), semantically correct, SEO friendly light blue template. By SEO friendly I mean some modifications to common template meta tags, content tags, better H1 and H2 tag usage (no H1 tags in the header, H1 is used in content title only). Together with proper link structure, supported by Wordpress, this gives good enough SEO structure to start with. You may want to make more aggressive SEO modifications but they are out of our scope for today.

Follow this link to check live example of Gadget Deals template for WordPress. I tested and tweaked it to work in Firefox, Internet Explorer 6, Internet Explorer 7, Google Chrome and Safari for Windows.

You can download Gadget Deals template for Wordpress here.

Comments

Add New Search

Write comment

Name: Email:  do not notifynotify Website: Title:   Please input the anti-spam code that you can read in the image.

Powered by !JoomlaComment 3.26

3.26 Copyright (C) 2008 Compojoom.com / Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved."