Is A Full Width Template The Answer?

Do you really want a full width template design for your site?

Here we will discuss the pros and cons of various sized templates for use on your SBI! site.

One question I get asked often is ...

Can you do a full width template for me to upload to SBI!

The answer is easy ... Yes, I can! However, do you REALLY want a full width? Take some time to consider what issues a full width template may cause.

Here are some examples you can view that show differing widths so you can get an idea of what I mean.

First, full width:

Full width template that shrinks and stretches

This is similar to DebtSteps but there is really one serious issue with a full width design ... if your screen resolution is set high (over 1024 pixels wide) then the content area can get quite wide. Usability studies show anything over 600 pixels wide is harder to read (content area width) as the line lengths are too long. This can cause your visitors to become uncomfortable, their eyes to become strained, and then they leave!

I am going to be fixing mine for this reason (when I find the time, of course! lol)

Next, the 800 width a/k/a 760-780ish

800 fixed width design

For this style, you really have to center the site, so you want a contrast background outside the template or finished sides (like a small bar that runs down the page). This design is a fixed width, so it will always be this size no matter the resolution of the visitor.

As you can see, however, in order to have sufficient width in the content area, you have very narrow sidebars. The sidebars are 160 pixels wide and the content is 480 pixels wide. You do not have all this space to use however as there are margins/padding that take up some of that space so content/images do not lay on the borders (text especially needs space around it for comfortable reading).

This last design is also meant to be centered for balance.

900 pixel fixed width centered

It is 900 pixels wide with wide sidebars; you can adjust to have more content area and less width in the sidebars than what is shown here. I do recommend a 500-600 px wide content area.

The one issue with this design is visitors with lower resolution 800x600 may not see all of the right bar without scrolling. This is becoming less of a problem each day as all newer computers handle higher resolutions and there are fewer and fewer visitors with low resolution settings.

A compromise would be this 850 pixel wide design.

850 pixel fixed width

The sidebars are 150 pixels wide, the remaining 550 is contentarea (less padding and margins for whitespace).

Another option is a percentage based flexible width template that will change within the constraints of the browser size. If you choose this option, your content could get too long on larger resolutions as noted above plus you need to consider how your logo would look if the holder is stretched as well.

A good workaround is to make your logo a background image that can repeat; or set 2 images in the logo area ... one left and a smaller one right with a matching background so the full header appears like one image. You can see an example of this at my site here.

You can check out each design and resize your browser to see how the various templates adjust (or NOT adjust) depending on their format. You can also change your monitor resolution settings temporarily to see how your views of these templates change to get a better idea of what your site would do as well.

To change monitor resolution settings on a PC, right click on your desktop area, choose Properties, then Settings. In the Settings tab, you can change your resolution and then view the templates.

Do consider your visitors before you choose a wider design. Visitors who are more likely to surf the web with lower resolutions include those with vision problems, which can include a large portion of the Senior population. Making your visitors comfortable has to be a high priority in choosing a design width as well as when it comes to formatting of the textual content.