I've used only variable width CSS themes on my sites for the past two years. I am amazed that theme builders are still putting up fixed width themes.

The large LCD/Digital monitors 19" and up are now priced very low. I recently purchased a 22" LCD monitor for less than 300 USD. When you look at a fixed width theme on these larger monitors there is so much space and so little content visable.

Competition is now almost altogether using variable width themes, and it forces anyone with any sense about building sites to do the same. I keep my monitor now set at 1024x768 to optimize my sites. I know this is not a large screen size, but I think it is sort of middle road for most users right now.

A 750 pixel width theme is now so dated looking. I realize it is easier to configure themes that have fixed sizes for their component elements of the site. It's just going to take more effort to provide components with variable width considerations built in I guess.

I'll be glad to read what theme builders have to say abou this topic, and I'm sure many explanations are valid. The problem is not what is best.

It's the increased screen sizes of monitors and the extra content that can be included in sites that are variable width. Users want to fill the screen with the gobble-de-goop and verbiage we supply.

Sorry for the triple posts... I couldn't tell if the boards were accepting the posting. I've lost so many postings on these boards that just didn't post. SOmething to do with a timeout I guess. If I take to long to write a post it just drops out when I finish and submit. I now make copy to clipboard a couple times during the post.

ANyway...if anyone reads this has the ability to delete the extra postings. GO FOR IT, and forgive me.

Personally, I have done fixed width themes because the original layout design required them (I have converted a lot of designs, especially anime-style layouts from other designers)and they would not work as variable-width themes.

I understand what you're saying, but SOME variable width themes look weird if there's not much content, on a high-res monitor: it's all stretched across the width, with not much height to the site.

I have done variable-width themes before too.

Hi domineaux,

Quote:

I think there are pros and cons to the Fixed Vs. Variable width theme debate. I agree that some fixed width themes look very strange on the big monitors, since the web pages take up such a small portion of the screen space. This is especially true if the user keeps his/her browser window maximized.

On the other hand, I don't like the way some variable width themes look when maximized. A block of text or article text spread across the entire width of the monitor can look really bad, and is difficult to read. I think it depends on many factors, including the font and font size used, how many blocks are on a page, how many columns are used, and how the blocks of content are distributed. Yes, I agree that variable width is the safer option, but it doesn't always look as good as fixed width.

It really can be frustrating being a web designer. Nothing ever looks the same between different browsers, different browser versions, and different monitors. I was looking at my web site the other day on my friend's notebook, and the color shading was very different from the way it looks on my desktop system. Yes, using only safe web colors can help that, but yet it is very limiting. The other problem is fonts. My friend had her browser font set to large, which caused some of the blocks to break the theme structure. I was already aware that this would happen, but I assumed that most people kept their fonts set on normal. Not a very good assumption on my end. Thus, it can be very frustrating when trying to implement a theme that looks satisfactory within different user environments.

The safest option is to focus on presenting content in a way that is user-friendly and compatible to the widest audience and widest range of settings. Variable width is probably safest in that regard. However, there are also times when the site needs to be very visually stimulating in support of some kind of image/idea being communicated to the web surfer. Fixed width themes sometimes work better in that regard, since it is easier to have more control over the dimensions of the visuals integrated into the design. Although, this is when it becomes very difficult, since it can look terrible on the larger monitors. I'm not sure that there really is an answer to this. Although, as you said, it would be interesting to hear the opinions of different theme developers and XOOPS users.

Dave

My biggest no, no is 800x600 we forget in the west, that the poor countries are getting our old PC's and many people buy antique internet ready bundled packages in papers; not realizing they are getting ripped off and can buy it brand new, same price.
Also some people, well most older people can’t see so well, and so larger resolution is what they use also.
Anyways I think added benefit of size adjustable is to make sure you cater for 800x600 always.

Most of my fixed width themes are intended for domains that are planning to use margin ads.

I always try and draw out my themes in Photoshop at 800x600. So that I know that it will definitely shrink that small.

This goes hand in hand with the Firefox vs IE argument.

Just because we power users think that things should be a certain way does not mean that Janet the legal secretary on her 10yr old HP thinks the same way.

Ultimately I do agree that with enough content a variable width theme is optimal. My most recent theme started out this way, I just opted for fixed width at the last moment.

If you are that interested in a variable width version of the theme I am certain that I could put that together for you.

IMHO, it depends on the design objectives. As already stated, some themes look best as fixed width.

What I've started to do is design themes that can be "switched" just by changing one CSS id.


This gives the end user 2 options to change there theme from fixed to variable.

Ultimately, I feel it is our responsibility to make designs that are compatible with all the major screen resolutions from 800x600 and up. While 770px width themes do guarantee compatibility with 800x600 screens, it also has a tendency to break with a lot of modules.

Best Practice:
Give your users a choice by designing your theme in such a way that they can switch the theme between fixed and variable widths with minimal effort.

Real World:
Some designs just look better fixed width.

End the end, it's a balancing act that is handled on a theme by theme basis.

Quote:

Exactly, specifically with themes that use border graphics.

in order to utilize a variable width theme where you have graphics running along the border you have to break down the Body table like this



This isn't the only situation where this is used either. In a graphic rich theme this is pretty much the best way to do it. Your blocks everything essentially use this same method so that they can be elastic. Essentially it wraps graphics around the outside of the table and allows you to define a bg-color.

but anyway I am ranting.

Great topic

If you want to achieve the same effect as mentioned by Biteronboard, but you don't want to introduce tables into your theme, you can use the following method...

theme.html

style.css


This is just off the top of my head and untested, so you may have to tinker a little with the CSS for it to work, but in theory, it should.

Even thogh the above takes more code to produce the same effect, it's better for accessibility and SEO. Also, you can use display:none; in your print.css to hide the left and right mains in your print preview.

Variable themes are the only way to go in my book.

But my concern is leaving out all the 800x600 people to early in the game.

As an automotive business owner I half to choose themes that display at 800x600. Based on my log files half the #OOPS# planet is still at 800x600.

Yea sure there is going to be someone that says hey what about 1680x1280, etc. monitor sizes. What are you kidding me? I cant even see the icons on my 19" desktop at that res lol. They look like lil specs. Granted im 42 now and the eyes are surely worse but #OOPS# 1680x1280 can wait till everyone has a 21" in front of them and 25's are the norm with techie folk.

I will not lose customers because they half to scroll sideways to see all the info on the site. Elastic sites are the way to go but look like crap no matter who designs it at 1680x1280.

Tables vs css? I could care less either way! Yes its nice to have no tables.

On the other hand I've never had any problem running my site up in the search engines with a table style XOOPS site.

I can produce #1's consistently either way. SEO using XOOPS is not rocket science. Any 10th grader can figure out SEO with tables or css.

script_fu,

RE: Tables vs. Table-less...

In practice, I agree with you to an extent. Depending on the market you are targetting, you could easily achieve #1 placement with a table based site. However, as prominent theme designers in the community, we also have a torch to carry. That torch is teaching "Best Practices". That doesn't mean we should never use tables. However, it does mean that we should aspire to educate others on standards compliance and accessibility, which is also the best method of SEO.

I think all of us whith some experience under our belts understand that it's a matter of give and take. Only the uber-elite can produce sites that follow every rule of the specification and still appear visually appealing, but that does not mean that we should say "F*** it!" and take the lazy way out. We should always strive to do better. Not just because it will make our sites more accessible to more users, but because it will raise the bar for designers who come after us.

This is the mindset that has driven the Web for many years and brought about many inovations that has made the Web as enjoyable as it is. Never become complacent. Always strive to be better.

I'll hop off the soap box now.