As a self-taught designer, I’ve learned the hard way that sometimes our best-designed layouts don’t always look right in all browsers. I’ve gotten used to testing everything I build in at least IE, Firefox, and Chrome, and occasionally I’ll even use sites like BrowserShots to help me test in many, many other browsers/versions of browsers as well.

However, this point newly hit home with me just this week, as I shopped online for a new bra from LaneBryant.com.

The Problem: A Missing “Add To Cart” Button

I browsed and quickly found what I was looking for–the rest of the site was designed very well. Then I went directly to the merchandise page…but for love or money I could not find the “Add to Shopping Cart” button. I must have hunted for about 10 minutes, going over the page in what felt like pixel-by-pixel increments. “Either I’m just ignorant, or the button ain’t here,” I found myself thinking after a while.

I knew by looking at this part of the page (and being a webdesigner myself) that the button should be right below the sizing chart. But, as you see in this screenshot, it was nowhere to be found. Below this lay only the footer of the site, nothing else.

Finally I went to the brand’s Facebook page and asked about it; the person running the Facebook page got back to me very quickly and courteously, and suggested either clearing my browser cache or switching browsers. I cleared the cache with no luck, so reluctantly I switched from my beloved Firefox (newly updated to v.19) over to Google Chrome.

Sound the triumphant fanfare! There the button was, right where I thought it would be, just below the sizing chart! In moments, what I thought was a digital impasse was resolved, simply by switching my browser. I completed my order and was happy.

…But, if I had been an ordinary user unused to “browser display issues” like this one, I would have just thought you couldn’t order anything from the site, and closed the window. Therein lies the danger for sites that don’t display right in certain browsers–they can lock out crucial functions of your site without you knowing until someone reports them!

Moral of the Story: REALLY Check Your Site in All Browsers

Seriously. Don’t just do a cursory layout check to make sure the layout displays right–make sure all your scripts and functions work the same in all browsers, too. This is important; otherwise, our sites won’t work for everyone, and we can easily lose viewers and business!