Do websites need to look the same in every browser?
It can be a hell sometimes fixing a project and tweaking stuff to work in all browsers (specially IE8/7/6). I’ve given up pixel perfect designs across browsers a long time ago, because that way I can only use stuff that is supported by the least capable browser. Another way to achieve some of the nicer features like rounded borders, shadows, highlights, text shadow, etc… would be using a sh*tload of images. Some of them can be fixed with css, even some javascript, others would use extra markup to achieve the effect wanted. This all leads to one thing:
More markup + more images = more to download = longer time to download
I can hear some voices whispering ‘longer time to download?’, but I have a super fast internet connection! Well, so do I but that’s not the issue because as we speak most of us own a mobile phone that’s capable of surfing the world wide web using 3G, edge, … So adding extra markup / images will not only slow down your site on slower connections, depending on the viewport and the capabilities of your browser some stuff might not render the way it was meant to.
So you got to ask yourself: Is it really worth it? Does every visitor needs to have the same layout? I say ‘NO‘, and I strongly believe that customers need to be informed about this. The web is not a printed medium, it’s a big collection of data shared across a huge network. The tools to share all this data isn’t paper and ink, but browsers, and as we all know, browsers are a free market. Whether you use safari, chrome, firefox, Internet explorer, you can access this data. And that’s the point of it all, people surf to get information, not because a site looks nice. And even more important, real users don’t open a website in different browsers to see how it looks. I’ve had a personal experience a couple of years ago that woke me up from the ‘pixelperfect-crossbrowser’ dream.
Before we booked a hotel, I wanted to find some pictures from the rooms, restaurant, etc… Travel agencies tend to make the pool look bigger, the rooms are huge and you would kill for the view from the balcony. Anyway, while I was surfing the web, I bumped into some nice looking sites that alas didn’t give a lot of pictures, and even those on the sites weren’t very satisfying. So instead of checking those sites in other browsers because they looked nice, I continued the search, jumping from one site to another until… I bumped into an ugly yellow-backgrounded page, playing some nasty music using a flash player but it was loaded with pictures!
Mission accomplished
It even made me realize that layout doesn’t matter, it’s the content that drives people to certain sites. I’m not saying layout is not important, but instead of designing pages, design content! And if your browser supports text shadow, for the love of God, use it! If it doesn’t, bummer, but be sure it’s readable! The same with border-radius, box-shadow, etc… I can’t remember the last time someone told me he was going to buy some electronic gadget but decided not to, because in safari the buton was all glossy and had a nice shadow and in Internet explorer it didn’t…
Truth is, people don’t care about the design / cross browser experience and you shouldn’t care too, because the only people who care are your customers. And I agree, these are the ones that pay you, but these are also the group that need to realize that technology is non-stop moving forward, and at a very fast pace. Your customer should ask himself how he uses the web, and believe me, they use it the same way as everybody else: google what you need, scan the page for what they need and take action. Nobody cares about the several hours the developer spent on making those fancy buttons cross browser, they will just click it. I bet that if you would ask them about the button details (button color, font color) they wouldn’t even know!
My opinion: develop for the best, optimize for the rest!
So what’s your opinion? How do you develop your websites?
Comments (5)
Age old discussion, the answer is: it depends. It’s probably not worth it to use images for fancy buttons. It’s probably worth it to make sure your site at least displays more or less correctly in IE6.
+1% visitors can mean +0.1% revenue. If the “fixing” takes 1 hour and the 0.1% revenue is more than your billable hourly price, it’s worth it.
Nobody likes fixing their sites so they work in IE6, the same counts for making e-mail newsletters work in Outlook 2007. There are designers who prefer plain text e-mails, when asked why they’ll come up with all kinds of reasons (“Displays better on smartphone”) (“E-mail was not made for images!”) but all these reasons stem from the fact that coding up HTML e-mails is a shitty job that no webdesigner really wants to do.
I find people who don’t make sure the site works in IE6 tend to forget IE7 too, which still has a large user base.
Also, for most small websites I don’t really need to fix all that much to make the site work properly in IE6. It’s easy to blame IE if your code is not up to par. I’ve seen people blame IE for everything but they couldn’t explain what the clearfix is nor how floats and clears work (technically). I’m sorry but you have some reading to do then.
P.S. Of course the layout matters, why did you put that drop shadow there in the first place?
Pingback: Tweets that mention Do websites need to look the same in every browser? - Bloggink -- Topsy.com
At no point I said I won’t optimize for older browsers, people deserve to have a descent site experience. Most of the fancy CSS3 stuff that is available now has been available in Internet explorer for ages, shadows, rotations, etc.. It has nothing to do with being lazy or ignorance. Let’s take an example.
Say you design a website who uses some nice 3D transformations to display images. You can make it cross browser by saving the images in their rotated state. Job done, kudos! Biggest problem however is that it’s hard for your customer to maintain the website or update images if he doesn’t save them rotated.
What I tend to do is explain that modern browsers like safari, firefox, opera, etc.. will support the 3D rotation, for Internet explorer however we will use a safe fallback and display the images in a flat state. Easy to maintain and the user experience stays the same: getting an overview of the photos.
Of course we could discuss if the designer should have used 3D images in the first place, but I like to embrace the available technology. So I stick to my point: develop for the best, optimize for the rest.
Btw, maybe this was a little harsh:
“It even made me realize that layout doesn’t matter, it’s the content that drives people to certain sites.”
But let’s face it, ebay.com isn’t very appealing and yet they have a large userbase. They do what they do, helping people sell and buy stuff.
It’s really simple: Content is king. How you choose to
deliver the content is absolutely important, but it’s never as
important as the content itself.
As Mike basically said before me: make sure the message comes across in all browsers. It really doesn’t need to look exactly the same in all browsers.
If your design is (hopefully) adding to the content, then decide for yourself how much of it is needed in IE6 to have more or less the same added value. Talk to your designer on a per project base. I guess (s)he’s the only one that can take the right decision here.
ps. Coca Cola doesn’t taste the same in every country. I never heard anyone complain. Good point Jochen.