Seven Useful Web Development Tips & Tools for Cross-Compatibility

By / Jan 6, 2010 / Tips
shares

As a web designer, you would think that the major Internet browsers would’ve come to some sort of agreement on standards and best practices after all this time. In reality, browser compatibility is a minefield of confusing conflicts and picky platforms that refuse to play nice with each other. Here are some useful tools and tips for riding out the waves:

Tip: Create a profile of your target audience.

cross-compatibilityYou could easily spend hours optimizing your pages for every browser from the first iteration of Mozilla forward. At some point you have to ask yourself, who is using this?

Does your website cater to contractors and DIY homeowners who may use their cell phone for texting, but are more comfortable surfing the net on a PC? Are you trying to reach C-level execs who have their iPhone surgically attached to their hand?

Think about their native technology environment, and prioritize your compatibility efforts based on the technology your audience prefers. The idea is to shape your message to their medium, or browser in this case.

Tip: Do not guess about what your audience is using.

Research and prioritize intelligently, and be prepared to back up your decisions with facts. Everyone loves seeing statistics.

Let’s say your client or your boss asks you to make the website compatible with their pet platform. You need something more compelling than, “Your browser is out of date; you should upgrade.” Let them know you mean business. “Your browser currently represents .5% of global browser users,” carries the weight of authority. And you can back it up.

Fun W3Schools Usage Statistics as of November 2009:
95% of browsers have JavaScript enabled
90% use Windows family operating systems
62% use Windows XP

Tool: W3Schools – Browser Share Statistics

cross-compatibility

W3Schools has the latest numbers for browser share past and current. They offer a monthly breakdown of the most popular browser platforms, including which versions garner the lion’s share of users. Firefox and IE ( versions 6, 7, and 8 ) are the most common browsers. At the back of the pack, Google Chrome has captured 8.5 percent, with Safari holding 3.8 percent. These statistics are extracted from W3Schools’ log-files, but W3Schools monitors other sources around the Internet to assure the quality of these figures.

W3Schools – Browser Share Statistics

Tool: W3Schools – Browser Display Statistics

This breakdown will show you what screen size visitors will most likely use to view your website. You can also see how colors will be viewed on your site.

Surprising, most computers are using a screen size of 1024×768 pixels or more, with a color depth of at least 65K colors. Remember the old standby screen size of 800×600? Only 4 percent of visitors actually use that setting!

Keep in mind, this data comes from W3Schools, a website catering to web technology hounds. Definitely a tech-savvy audience there. Your mileage may vary.

W3Schools – Browser Display Statistics

Tip: Website audiences are unique.

Global averages are helpful, but the important thing is how your users see your site. Website audiences are unique as a fingerprint. Some web site users favor the latest technology, while others have grudgingly accepted email as a universal form of communication. Dig into your website analytics to find out what technology your visitors use to access your website.

“First get your facts; then you can distort them at your leisure,” – Mark Twain.

Tool: Google Analytics – Browser Capabilities

cross-compatibility

Google has a fantastic (and free!) tool to analyze your own Browser statistics. From your dashboard, select Visitors > Browser Capabilities to access this tool. You can view by Browser alone, or look at the OS driving the browser technology.

This Analytics section provides very detailed information about your visitors. You can view typical screen resolutions, screen colors, operating systems, and so much more.

Wondering how your latest Flash creation or JavaScript app will play with your audience? You can see which version of Flash your visitors are using, and how many have JavaScript enabled.

Another useful feature of Analytics enables you to look at visits, time spent on site, new visits and bounce rates for these various browser segments. You can also view goals and conversions for each type of browser, OS, and screen resolution. See how these technologies affect your goals for the site.

Google Analytics

Tip: Do not idolize statistics.

cross-compatibilityIn the immortal words of Oscar Wilde, “The pure and simple truth is rarely pure and never simple.”

Keep in mind, many statistics may have incomplete or faulty browser detection. It is quite common by many web-stats report programs not to detect the newest browsers.

Also, if you find that a small segment of your traffic is extremely active or spending a lot of money on your site, you may want to optimize for them. Even if they’re a small part of the overall pie, they could be crucial to the success of your site.

“You cannot – as a web developer – rely only on statistics. Statistics can often be misleading.” – W3Schools

About the Author

Jessica Cox explores the far reaches of the Internet, researching the latest marketing, web design and development techniques for Aqua Vita Creative. Sign up for our newsletter for more news, tips and updates. @jessicafcox

19 Comments

  1. Matt
    January 6, 2010

    http://www.w3counter.com/globalstats.php

    That’s a great site to go to for more neutral-ish statistics. I like W3Schools, but they are serving statistics based on a very select group that doesn’t really represent the web at-large.

    Reply
  2. denbagus
    January 6, 2010

    i think Tools for Quick and Clean Code Development is very useful for me..thank you

    Reply
  3. fosron
    January 6, 2010

    Really great article!

    But you’ve got something wrong. GA doesn’t track JavaScript, it track’s Java (Web browser plugin) compatiblity :) GA Tracking code itself is a JavaScript, so there’s no way it could work with JavaScript not present (mostly off) in the browser :)

    Reply
  4. Sonali Agrawal
    January 6, 2010

    Google Analytics is the place for me..I find it really useful…Thanks for the wonderful article.

    Reply
  5. Coupon
    January 6, 2010

    Yea, you can go on w3counter for better statistics, but here are good ones too. Very useful, thanks.

    Reply
  6. cooljaz124
    January 6, 2010

    I hope Google Chrome wil come in Top 3 soon ! and when IE will officially die ? :)

    Reply
  7. Ken
    January 6, 2010

    Great article discussing how to rationalize what browsers, display resolutions, and capabilities (flash, no flash) to test your website against. Once you have decided what to test, you need a testing environment which supports these choices. CrossBrowserTesting.com does this by:
    - Supporting a wide variety of browsers on numerous operating systems
    - Whether doing a live interactive test of taking screenshots, it enables you to specify the display resolution of the system you wish to test with.
    - Has configurations loaded with and without flash
    If you do not want to build your own testing environment, we invite you to try it out.

    Reply
  8. James Costa
    January 6, 2010

    Thanks for the tips! Profiling is a major part of things, and you need to build your website in thought of your users. I mean, using CSS3 on your website that has 75% users using IE6 isn’t going to be useful at all.

    Reply
  9. Chris Lee
    January 6, 2010

    Nice tips. It’s good to read an article that doesn’t beat the quit support IE6 drum when it comes to compatibility. Sites must be designed with the user in mind, not the wills or desires of the developer or designer.

    Reply
  10. Dan Grossman
    January 6, 2010

    Unlike Google Analytics, W3Counter does track JavaScript usage on your website. When JavaScript is not available for tracking, it falls back to using a tracking image, which lets it record that JavaScript was disabled.

    Reply
  11. Jessica Cox
    January 7, 2010

    Matt: Fantastic find; +1 to stats! http://www.w3counter.com/globalstats.php is a great resource.

    Denbagus: I’m glad to hear it.

    Fosron: Good catch, thank you! Java the Web browser plugin, not JavaScript

    Sonali: /agree. Analytics is tasty and addictive.

    Cooljaz124: Chrome is rocketing up pretty fast, and IE is very comfortably entrenched for the moment it seems.

    Reply
  12. Jessica Cox
    January 7, 2010

    Ken: Glad to hear you weigh in; lovely tool you’ve created.

    James Costa: I completely agree. Knowing your customer serves as the basic tenant for all web design, development, and business in general.

    Chris Lee: Thank you! Yes, the user is king. We’re all working for them at the end of the day.

    Dan: So W3Counter can read JavaScript usage on your site? Interesting. Seen anything of note?

    Reply
  13. Michel Karmick
    January 7, 2010

    Michel
    from <a href="http://www.karmicksolutions.com&quot;

    Hi Jessica great post.w3school tools is cool.

    Reply
  14. Inside the Webb
    January 7, 2010

    This is an amazing article dude! I really have to say you’ve used some great tips here, I really like your tools and ideas for web development. Great blog design as well, keep up the awesome posts

    Reply
  15. Xaby
    January 8, 2010

    Thanks for the info. And talking about this, IE 6 came to my mind as THE browser where many developers and designers are dropping support for. How i wish all browsers would adhere to a common standard to make things easier for us all.

    Reply
  16. Jose Fernandez
    January 10, 2010

    W3C global stats are more accurate, but I feel that the best web browser market share info is here:

    http://en.wikipedia.org/wiki/Usage_share_of_web_browsers

    Net Applications in particular utilizes a huge data set. They also have resolutions, operating systems, etc:

    http://marketshare.hitslink.com/browser-market-share.aspx?qprid=2

    I really wish people would stop recommending the regular W3C page. They even indicate on the page itself that they have higher than normal rates for non-IE browsers due to their subject matter.

    Reply
  17. SMiGL
    January 12, 2010

    Nice post. Google Analytics just beautiful

    Reply
  18. Satya Prakash
    January 12, 2010

    W3School visitors are web tech persons. so think of your visitors.

    Reply
  19. Jessica Cox
    January 12, 2010

    Xaby – We just helped one of our clients update from IE6, so I’m right there with you.

    Satya – Very true! It’s a tech-savvy demographic over at W3Schools

    SMiGL – /agree. Much love for Analytics

    Inside the Webb – Thank you! That’s very kind.

    Reply

Leave a Reply