I do not often rant and rave about anything but today is an exception. As a developer of new website themes and templates, I am finding myself more and more frustrated. I find myself spending hours and hours coding and checking various things that will eventually have very little effect on the final product. Today I draw the line and in future all templates (both static as well as blogs) I produce, will no longer follow the so-called norm for development.
There are 4 things that are really getting on my nerves and I am going to stop worrying about all four of them. In so doing, I realize that I am going to ignore advice that has previously been advocated on this very blog.
Equal Height Columns
The previous owner of this blog had a very strict set of standards which he used for all development work. Amongst many other things he felt very strongly that all templates/themes should have equal height columns.
This entire problem is caused by one thing and one thing only. The users want background colors on the content area that are different than those used on the sidebar area. If both these areas have the same background colors the problem goes away as the difference in height cannot be seen. From here on in, I no longer am going to use all sorts of fairly complicated tricks to ensure equal heights in the columns, I am simply going to use a single background color for the relevant columns.
The Mighty Microsoft
The whole concept of “Any Browser” has been advocated on this blog for a while now. I am afraid I am going to break this rule from now on.
I test all my work in the latest versions of Internet Explorer, Firefox, Flock, Google Chrome and Opera. How did I decide on this specific list? These are the browsers that the majority of my clients and visitors to this blog use.
Cross-browser compatibility is very important but one has to draw the line. I will continue checking with all these browsers but I am definitely going to stop checking with the older versions of the browsers. Internet Explorer is of course the biggest culprit here. Funnily enough, this is a bigger problem on the static side of things than on the blog themes. If I continue checking my work with IE5 and IE6 I effectively double my development time. Unfortunately the clients are not prepared to accept a doubling of the price.
On this blog a very small percentage of users use Internet Explorer but it is still very popular in general. Why this is so, I do not know. If you have to use a browser that simply refuses to comply with the standards as used by everyone else, please make use of the latest version of the software. As far as I am concerned any IE browser before IE7 no longer exists.
WordPress Security
This one is a WordPress theme problem only. The view on this blog has until now, been the following:
You should not show the version number of the WordPress you have installed. Many templates love having this info in the footer. Why provide a potential hacker with any information. The version number currently installed is normally also included as a meta tag in the markup. This information you will normally find near the top of your template’s header.php file.
This is not a major issue but it is something I always have to keep in the back of my mind. Have I shown the version number or not? This one no longer serves any purpose. There are quite a few Firefox add-ons (WordPress Helper amongst others) that show the WordPress version number when you open any WordPress site, immaterial if the version number is included in the markup or not. I am not going to worry about this one anymore.
Horizontal Scrolling
The standards used for development work as used by Nice2All also had a strict policy regarding horizontal scrolling on any website page. This is a nice ideal but it is not so easy to comply with.
The solution to this problem is in fact quite simple, you make use of flexible (elastic) designs but guess what? The users do not want flexible designs, it appears as if fixed width designs are the popular ones. So just what must one do?
From now on I am only going to test my designs for horizontal scrolling in a resolution of 1024 X 768 and higher. I am convinced that the percentage of users that actually use a smaller resolution than this has got to be be very small.
It is essential in development work to follow a set of personal standards. I have now changed just a few of the standards I personally use for the development work I do for others, for the themes used on this blog as well as the free themes I make available on this blog. Moaning normally means nothing to anyone, but at least I now feel better.
Have you entered the competition running on this blog. The competition ends soon.
Till next time.
Ah, the age old “equal height columns” issue!
This has bugged me for a long time. I have battled with the issue so many times it’s not even funny.
As you know, there are many ways to skin a cat:
1. Design using tables
2. Complicated, nested DIV’s
3. Mess with the border of one col to “fake” the background for the next col, then position the next col with a minus value.
4. Faux colums
5. Javascript hack
There just seems to not be an ideal solution anywhere. Personally I settled on faux colums. I would be interested to debate with anyone why that is a worse solution than any of the others out there.
If there was a perfect way of creating equal height columns, yet I was using faux-colums then I would be lazy, but the only reason I do it is because there is no (IMHO) better way.
The sad thing is, technically the best way is to go back to using tables for layout, but then I’d get whacked with the naughty-stick!
I have a feeling the comments on this issue will be interesting to read.
Nice post, Lyndi, once again!
Jim Seftons last blog post..New Macbook Pro range
Jim,
Personally I will not use tables for layout purposes (I do use them for tabular data of course). Javascript, you run into people who say you are excluding those without JS. Faux, depending on how it is done, it could affect load times. So for me that only leaves the complicated ways or just ignoring the problem (like I intend doing).
I do not know if you have checked out Sailor’s way of doing this. It is not too complicated but maybe someone like you could make it easier still. IMO, anyone who comes up with an easy, fool proof solution for this problem will be a star. Here is your shot at getting into the history books.
I do suppose the final solution will only come with some serious changes to CSS. Maybe a variable to remember the longest columns height and then setting the other column(s) height to this same value. Now I’m dreaming.
Thanks for a very nice comment.
If css worked how I used to imagine it did, it would be a simple case of having a single container, and setting the heights of the divs inside to 100%… simple. Alas it doesnt work like that.
As for the loading times for faux colums, I disagree. The way I do it is witha 1px gif file (usually with only 2 or 3 colours as wel, so tiny) and use repeat-y to mke the columns. Not perfect, but it works, and in my opinion is no more of a hack than nesting 3 or 4 levels of DIV’s to achieve it in “pure” CSS.
I don’t suppose CSS3 will be any better in terms of this issue, but I haven’t investigated it yet so I don’t know.
Jim Seftons last blog post..New Macbook Pro range
Sorry, I meant to say 1px HEIGHT… of course it is the width of all the columns LOL. In my case it is 4Kb, but I could make it a lot smaller if I tweaked it.
Jim, from what I have been able to find to read on the matter, CSS3 does not fix the problem neither. Maybe CSS33
My way from now on would be similar to what I did on this blog. I use a container to hold the content and sidebar areas. The content and sidebar(s) have the same backcolor as the mentioned container. I then use different color ‘blocks’ in the sidebar(s) to create the illusion that I have overcome the height problem. Until something better comes along, that is the way I will go.
Funny, I see this more as a “how to stop going crazy post” than a rant. Even your rants are pleasant!
I agree that IE 6 and below are not worth testing in. For my actual web design site, Web-Betty (http://www.web-betty.com), I have completely given up on IE 6. I spent hours trying to make all of my elements play nice. And for ONE browser that is on its way out anyway. I like your horizontal scrolling “rule” too. I detest horizontal scrolling due to design oversight, but you just can’t develop for every possible scenario. (Of course, if you check out Web-Betty, you’ll see intentional horizontal scrolling…)
Thanks for yet another nice, insightful post. It’s always a pleasure!
Web-Bettys last blog post..I’d like to thank the Academy…
Web-Betty, a horizontal site, I love it. A great idea! Horizontal scrolling seems to be just fine if it is not coupled to vertical scrolling at the same time. Everything is above the fold.
If I remember correctly we used to find these kind of sites a few years ago. Apart from Plurk, yours is the first of this type that I have seen for a long time.
Who says one cannot dare to be different, well done.
If you have not seen this site before, go check it out.
I think this is why I haven’t done the whole website designing thing in over 2 years. It just gets too frustrating in general - and I really wanted to focus on content a little bit. Sure I worry a little about the design of my site but only to the extent of which I can control it.
Good luck Lyndi!
fragilehearts last blog post..Flickr Friday: Pink roses
I feel your pain. Sailor’s rules were tough even on him.
I guess the thing to do with the columns is to offset them so they look intentionally done. I recently tried out one theme that had the side bar column hiked up into the header area. It had rounded corners to it and was a dark color with light print which contrasted rather nicely with the much larger area reserved for posts which was white with black print. If it had supported widgets better, I probably would be sporting it on my site right now.
I think we have limited ourselves to this rectangular box too long. While we must have our websites displayed in it, there’s nothing that says it has to be CONTAINED or CONSTRAINED by it.
ê¿ê
Margarets last blog post..Customizing Your Wordpress Theme
fragileheart, at the end of the day I suppose I have to do what the client’s wantt (i.e. on the paid stuff) but as for the freebies I am going to concentrate more on the really functional stuff and forget about the rest.
Margaret, I have started doing something similar to what you describe but I have started moving the darker areas downwards into the footer area. What you have said here gives new meaning to ‘thinking outside of the box’
Lyndi, I also feel your pain, and I’m not even a designer - although I am a coder. Injader (my open source CMS) has had to deal with some of these issues in the past.
I do think there is more to the IE6 issue than people seem to realise though. The URL I’ve posted with this comment links to a post on my blog that explains why a lot of people still use IE6. It is not as simple as upgrading if you don’t have XP Service Pack 2, if you browse from work, or if you’re unwilling to learn another browser. IE7 is quite different to IE6 and it’s an optional upgrade even for the versions of Windows that support it. No wonder a lot of people are stuck on IE6.
Though I fully understand your views and agree that you have to draw the line somewhere, cutting out IE6 is one thing I’m not prepared to do just yet. Having said that, I don’t invest loads of effort in making themes looking pixel-perfect in every browser. Remember that if people browse on mobile devices (as many people are starting to do), the site will look TOTALLY different to how it looks on a regular PC or Mac.
My goal is to prioritise the serious issues - e.g. ensuring columns don’t “jump down” beneath each other due to IE6’s margin/padding measurements being slightly different to other browsers. Or making sure that certain elements don’t print on top of each other. I think it’s fine to say a theme won’t look exactly the same in every browser, but it’s worth spending a little time even on IE6 just to see if things are readable.
Your mileage may vary.
Ben Bardens last blog post..10 posts you don’t want to miss
Ben, unfortunately you might be correct. Unfortunate for me, that is. Maybe I should still just have a look at a new theme/template in IE6. I will be visiting your article as soon as I can.
Not only Ben’s comment but all the comments received on this post have been outstanding.
On this article most of the really valuable information is contained in the comments. My thanks to all the commenters, this is just wonderful.
Ben, you have raised a couple of very valid points in your article. You have really got me re-considering this whole thing.
If anyone would like to read Ben’s interesting article on why people are still using IE6, just click on his name two comments above this.
Thanks again Ben.
Ben raises a very good point there, about sanity checking the site in all browsers but not getting too hung-up about everything being pixel-perfect.
Personally I try to avoid certain things I know will break in certain browsers (without a lot of effort). Hopefully over time things will get better, but for now I try to keep things simple.
I have found that although people like pretty websites the content and layout are far more important, and if you nail those two then people will forgive different length columns etc… Saying that, for me it’s like not painting the wall behind the sofa.. you know deep down it’s not right, and it does bug you!
Great comments on this too… thinking outside the box (or should that be, “thinking outside the DIV”?). LOL, I’ll get my coat!
Keeping things simple. That is the best advice of all. If one follows this advice most of the other problems disappear.
The problem is not all clients realize this. Try explaining to someone why a ’simple’ page filled with gigantic graphics (some of these animated), an embedded video or two as well as a quite a bit of Flash IS going to slow a page down.
The attitude out there seems to be that I want all the latest goodies but the pages must validate, they must have cross-browser capabilities, they must meet the accessibility standards and of course they must be fast.
The final nail in the coffin is normally, I want it yesterday and of course I want it all for next to nothing.
Who said web design is easy?
Thanks for your advice Jim.
“The final nail in the coffin is normally, I want it yesterday and of course I want it all for next to nothing.”
“ummm but of course! Why not??” said Marie Antoinette on the way to the gallows.
ê¿ê
The ‘all seeing eye’ has spoken
A lot of those things grind my gears Lyndi. Mainly the Internet Explorer issues. I check my sites in IE6 just to see how they look, but I don’t go out of my way to fix things. If things are a little off, the user is a little off for using IE6
John, you said it, I didn’t
PS. I like your avatar, simple but eye catching.
Lyndi, I know, but I only feel bad for the users forced to still use IE6 by their IT Department. They need to get with the times.
Thanks for the compliment about my avatar, its part of my personal logo.