When making changes to my websites I always take the time to view them live on the web before closing up my editing software and patting myself on the back in self-satisfaction of a job well done. Even with minor changes, I like to view them one last time to make sure my changes didn't cause any shifts in on-page display, or I didn't inadvertently create an error somewhere that inadvertently jacked everything up (believe me, it's happened more times than I can count!) But regardless of how careful I am to double check my work, there is one thing I almost always overlook; verifying that my site looks good in the "other" browser.

At any given time I have three FireFox browser widows open, each with their own number of open tabs. So it's natural for me to check and verify my changes using my browser of choice. Sometimes, I even think to check my changes in Internet Explorer. Admittedly, I don't regularly check IE when the changes are relatively minor, but always when the changes effect formatting. But that's not the other browser I'm referring to.

We get so accustomed to our own way of surfing the web that we forget that there many other browsers and browsing experiences that may be foreign to us. Now most web designers will do their due diligence and check a site in multiple versions of FireFox, Internet Explorer, Netscape and Safari. Heck you might look at a half of dozen other browsers that most people, including myself, have never even heard of. But those are not the browsers I'm referring to either.

There are four primary "other" browsers and browsing experiences that are typically overlooked by site owners, casual webmaster and, yes, even by the average web designer. But with more and more users moving to these alternate browsing experiences, it is even more important to check your websites to make sure that they function properly for these users.

For the next several illustrations I'm going to use my own website as an example. Here is what it looks like in it's current form:

Snapshot of Pole Position Marketing Website in it's natural state

The image-less browser

In a previous article I address the necessity of using ALT attributes on your images. But why is this so important? The image ALT text helps visitors surfing with images turned off to get a better sense of whatever meaning your images are trying to convey.

Snapshot of Pole Position Marketing Website with images turned off

I remember a few years back I had very limited connectivity. And by "limited" I mean: dial up. For several weeks I had to live with the slowest of all slow internet connections. You had better believe that I turned images off in my browser. I didn't have the time for many of today's image-heavy websites to load before I could get the information I needed. During this period I came to appreciate well-thought out ALT text.

While the accessibility of high-speed internet means that fewer regular browser users are surfing with images off, there are still plenty of users that do, for a variety of reasons.

You can see in the screenshot above that all of the images, save for one, are replaced with descriptive image ALT text. The only one that doesn't is the flag next to the H1 tag, which is inserted using CSS. This is just decorative so there really isn't any need for ALT text anyway. But even with images turned off, the site is still completely navigable.

While surfing with images off isn't necessarily done using a completely different browser, it is a completely different browsing experience, and one that does need to be addressed to ensure your site works for all types of visitors.

The CSS-less browser

CSS is wonderful for web design and keeping code bloat to a minimum. But even still, some sites are so heavily dependent on CSS that they forget to make sure that the site still works with CSS turned off.

Snapshot of Pole Position Marketing Website with CSS turned off

My site was designed specifically to make sure the content was placed higher up in the code than the rest of the on-page elements. When doing so, we ensured that when viewed without CSS the layout is pretty consistent with the CSS version including the right-side information bar.

The only primary difference is that the header and main navigation is at the bottom rather than the top. This is because we used absolute positioning in the CSS to place the header above the content. Normally site identification is something I am concerned about when looking at a site without CSS. But we've taken care of it here by making sure the breadcrumb, which always reads" Pole Position Marketing" is the first content on each and every page.

Obviously the formatting isn't just the way I want it to be, but that's to be expected. All of the important elements are here and in place. The site can be read properly, as intended, and my calls to action are still properly visible.

The text-only browser

Now I have to admit that I have great difficulty using the Lynx text browser. But it is definitely a handy device to see not only what your site looks like with just about everything but links turned off, but also to get a better understanding of how your site might be read if the visitor uses a screen reader.

Snapshot of Pole Position Marketing Website in a text-only browser

One of the biggest problems most sites have when pulled up via text-only browsers or read from screen readers is that the left-side navigation always appears first on each page. This is one of the problems with tables designs that have their navigation on the left. Now I don't advocate moving your navigation to the other side of the screen, but there are other things you can do (as we did with Pole Position Marketing) to get your content higher up on the page.

The text-only browser will help you see if your site is too heavily dependent on visuals to get visitors to interact with your site. Here you have no formatting and no images. Just the words on the page. If you can't get your point across here, and can't persuade your visitors to move through your site, then there is a good chance that you have a deeper problem than how "pretty" your site may or may not be.

The mobile browser

Mobile web browsing is becoming more and more frequent. Cell phones are becoming mobile devices designed to connect us to the world wirelessly regardless of where we are. That means more people are using the internet on their tiny cell phone screens to shop, gather information, learn, read and research. For many businesses, ensuring that their web site looks good on mobile devices will be time and money well spent.

Snapshot of Pole Position Marketing Website in a mobile browser

Of course, developing your site to look good on mobile devices isn't easy. Every phone uses a different browser which may or may not import CSS and/or images. Here, perfection isn't necessary, just so long as the site is usable with strong site-identification.

These are the two major issues that I've seen on mobile devices. The header gets messed up to the point where you can't tell what site you're on and the main navigation is jacked up to make navigation near impossible. If you fix those issues, also ensuring the text is readable, then you're meeting at least the basic needs of your mobile audience.

How important is all this, really?

One of the basic of the web is making sure you meet and exceed your audience's expectations. Many make the argument that the audience that browses with images or CSS turned off, or even on text-only browsers is so small that going through the effort to fix that just isn't worth it. I disagree.

Think of it in terms of the long tail. Sure, a clear majority of your visitors use the standard browser on a high-speed connection to browse the web. Most of them will never even know, or care, if your site functions in these other browsers. But that doesn't make the people who do any less important. Nor does it make them any less of a customer.

For the same reasons that businesses must have ramps for wheelchairs and handicapped accessible parking, businesses on the web need to take care to care about this audience as well. Target has already been sued because their site wasn't accessible for disabled visitors. It likely won't be long before every site must come into certain accessibility compliances or risk similar repercussions, or worse.

As far as the mobile browsers goes, well, that's where more and more internet activity is headed. It's best to be ahead of the game, rather than trailing behind. No sense giving up customers to your competitors who do take the time and effort to meed the needs of this growing audience.

July 8, 2008

Stoney deGeyter is the President of Pole Position Marketing, a leading search engine optimization and marketing firm helping businesses grow since 1998. Stoney is a frequent speaker at website marketing conferences and has published hundreds of helpful SEO, SEM and small business articles.

If you'd like Stoney deGeyter to speak at your conference, seminar, workshop or provide in-house training to your team, contact him via his site or by phone at 866-685-3374.

Stoney pioneered the concept of Destination Search Engine Marketing which is the driving philosophy of how Pole Position Marketing helps clients expand their online presence and grow their businesses. Stoney is Associate Editor at Search Engine Guide and has written several SEO and SEM e-books including E-Marketing Performance; The Best Damn Web Marketing Checklist, Period!; Keyword Research and Selection, Destination Search Engine Marketing, and more.

Stoney has five wonderful children and spends his free time reviewing restaurants and other things to do in Canton, Ohio.


[Editor Note: Winston from http://www.wistop.com/blog originally posted this but I accidentally deleted it.]

This handy little site will show you a preview of your own site in more
browsers than you can shake a stick at: http://browsershots.org/

I guess im guilty of working with IE - as it's by far the most popular.
As an amateur designer I only have a tiny time allowance between work
and family so it's hard to justify large amounts of time on changes
that only a few people will notice. But at the same time I believe in
accessability for all so it becomes really tricky.

I recently did a quick round up of windows browsers
( http://www.wistop.com/list-best-web-browser.html ) and actually found
that Firefox probably isn't even the better of the alternatives. It
just has the most momentum and support.

I'm still trialing, and this week I have mostly been experimenting with
Safari. Quite like it actually ;)!

Nice post. Cheers.

Nice post.

Its important that even though a web designer has a favorite browser. He should ensure that the site is tested in at least some of the important browsers before going live.


Overkill in 99% of sites.

If you look at things from the business perspective, then yes, the long tail _can_ and _will_ be ignored. As it should be mind you. The cost to a company wanting a site compliant with legacy browsers and mobile phones, for example, will easily be doubled or tripled. The designers will have to spend far more time it is worth in order to meet the project requirements functionality wise, while maintaining the fluent look between browsers/platforms.

Face the facts. Anything beyond your typical blog type website that is being built by a designer _for a company_ will almost always abandon everything outside of IE6/7, FF, Opera and Safari. Netscape and the rest are not worth the cost of supporting unless the fix is very simple, easy and most importantly, readily apparent from the start.

As for no images - ALT text on images is a Standards thing anyways.

As for no CSS - You cannot care about this too much since the user has to turn off CSS themselves, therefore they know the consequences 99% of the time. They will expect that your page, along with a vast majority of other pages online will look way way way out of wack. Moreover, suggesting someone does this over other accessibility issues is just plain wrong. If you want to be worried about reaching as many as you can the best you can, then you are much much better off suggesting makings sites at the lowest supported resolution (800x600) with any significant share of the users.

It is quite ridiculous to suggest that how your page looks with CSS turned off is more important than supporting the users with lowers resolutions. Why would you worry about how the site looks with no CSS if your site is forsaking more people with other decisions?

Your site is 1070px wide, which is 2 whole jumps past the 800x600 level. You didn't even bother to go with the #1 browser resolution, 1024x768! So your site looks bad to well over 50% of users and you are worrying about supporting the 1 tenth of 1% of users that have CSS turned off. Whenever you make your first concession to not support a certain group of people, lets say 5% for example, things get hairy. You will have a very hard time justifying making fixes for any group that represents anything less than that 5% of people you already forsaked. Why would you spend time to make things work for a group that represents 1% of your users when you already made a decision to not support 5% elsewhere. If the goal is the most users with the least work, then you would go back and make that 5% group work, not the 1% one. Unless you have real good market research being done, you will not be able to justify making those choices in most cases.

Thanks for rescuing my post. I've been having problems posting comments here? It just errored the first time I've tried to post this too :(. Apologies for increasing your moderation duties! Cheers.

Hmmm, seems ironic that you're talking about the importance of cross browser compatibility and the site in the example is built using tables...

CSS and web standards is the quickest route to cross browser compatibility.

Why is that ironic? The site is cross browser-compatible.

It's sad that the browsers can't get their acts together and standardize how they look at things. I can't tell you how many times we had issues with our drop down menus on the new version of http://www.v-rooms.com

Now with the Kindle and Sony e-readers gaining traction, there will be quite a few people using those devices as browsers. oh...and the apple tablet that is rumored too!

Comments closed after 30 days to combat spam.

Search Engine Guide > Stoney deGeyter > Is Your Website FUBAR in the "Other" Browser?