My Take On Browser Testing Order

Recently I came across this article on Browser testing order for debugging CSS in which the author suggests that you build and test your web sites in the following order:

  1. Firefox/Flock/Camino on OSX
    (he says, “Firefox is my development browser during the first phases of CSS development. No other browsers in my dock gets opened.”
  2. Firefox/Flock on Windows XP
  3. Safari on OSX
  4. Internet Explorer seven
  5. Opera on OSX and on Windows XP
  6. Internet Explorer 6 on Windows XP

I feel the need to, respecitively, differ on his take. Recently I wrote about my initial experience with IE7. At first, all seemed fairly rosy … not at all the apocalypse I had feared. So, I quickly upgraded to IE7 on my primary laptop, and thought I would leave IE6 for testing on my secondary laptop. Big mistake.

Curse IE!

Normally, I develop in Firefox and test along the way in IE. I can’t imaging leaving IE til last … it would be so difficult to pinpoint problem code! I have a Firefox and IE window going at all times, and every time elements are added or changed I refresh both browsers. That way I can pinpoint the exact code that I need to work with if there are problems. After downloading IE7 onto my primary laptop I experienced a new descent into IE hell when, once “finished” with a site, or page, or new feature, which worked great in IE7 and Firefox, I would turn to my secondary laptop to fire up good old IE6 only to discover a plethora of difficulties. I got into some crazy situations trying to placate both IE6 and IE7. A fix for one broke the other, and vice versa. I now had three style sheets – one for IE6, one for IE7, and one for everyone else. Suddenly my IE troubleshooting time was twice as long. Or, more like three times as long, since I no longer had all the quirks and hacks under my belt … I was now wrestling with new ones! If it took me two hours to build something and get it working, it would take me 2 and 1/2 hours to get it ship-shape for the IEs. It was not fun.

Back to Basics

It didn’t take me long to discover that I needed to put IE6 back on my primary machine, and save IE7 for the testing machine. Even though IE7 is presenting a new slew of little headaches, it’s still a big improvement in the arena of supporting standards. Chances are much, much better that if you have a site working in IE6 that it will be OK in IE7 than if you have a site working in IE7 and then check it out in IE6. Since I made the switch back, my life has been much less stressful.

So the Winners are …

  1. Develop for Firefox (Mac or PC) but test in IE6 the whole way through
  2. Test for IE7

    (now you’ve got the majority of users covered)

  3. Test in Firefox on the browser you didn’t develop on
  4. Test in Safari on the Mac
  5. Test in Opera on the Mac

11 Responses to “My Take On Browser Testing Order”

  • David Hucklesby Says:

    I agree about testing IE 6 before 7. Then just go through the “IE-only” style sheet and hide unnecessary fixes from IE 7 with the Holly Hack (* html …). That seems to work for me.

    My primary browser is Opera, mainly because I prefer its developer tools. FireBug may make me change that idea. Mac users have more choices for excellent benchmark browsers. :)

    I find the multiple IE installation from Tredosoft works quite well. Microsoft has a solution too, but I also need to test in IE 5.5.

    BTW – you can get your two browsers to refresh themselves. Just add a META REFRESH and PRAGMA NO-CACHE to your document while testing. Saves a lot of keypresses!

  • Radu Cugut Says:

    Try the “IE Tab” Firefox add-on. I like it and find it very useful.

  • Sheriar Designs Says:

    Yes – IE Tab is great! I use it constantly. I should have said, “I have a Firefox and IE TAB going at all times.” =)

  • Mark Says:

    Cursed IE. I’ve left IE6 as the only browser on my primary Win machine at work…and I’m constantly finding bugs my coworkers are unaware of. @Home I have IE7…in my second Win XP Parallels machine, on my macbook.

  • Peter Gasston Says:

    I’ve found that IE7 only requires one or two lines of bug fix code in order to display properly. After that, I dumb down for IE6.

  • Kevin Says:

    You can get a stand alone version of IE 6 and run it on the same machine as IE 7. This much easier than switching machines.

  • marj Says:

    hey, for browser testing, have you ever used php coding in your css to make corrections? thanks in advance!

  • Drew Says:

    Browser sniffing? eww, I think css hacks are considered a better solution. No?

    I agree with your debugging strategy, it doesn’t make any sense to do all that backtracking when your almost finished, its just a waste of time, IMHO.
    I think all these problems with IE6 –> IE7 are because Microsoft is kinda just testing the water of this whole “standards compliant” fad thats going on now, lol. So some of the major bugs are fixed with IE7 but there are also a few left over, and they’ve thrown in a few new ones ( for added value! Yay! ) . Major headache.

    On a side note one nasty bug that IE7 created was the ’sticky menu’ with the suckerfish drop down menus. Incidentally, just use an [IE] filter and then position: static to fix it.

  • Heidi Cool Says:

    Testing 6 before 7 makes perfect sense. It’s better to focus on the major hiccups first. You may also want to consider running multiple versions of I.E.

    There are a few ways to do this. The first route I took gave me erratic results, but then I found http://tredosoft.com/Multiple_IE offers a multiple version install for IE 3 through 6 that works cleanly with IE7. Now I can open 6 and 7 on the same machine, test the pages, create my different stylesheets and get all the bugs worked out without having to pester my co-workers to see how something looks on their PC’s. Since I am mostly Mac and have but 1 Windows machine this has been a huge convenience.

  • Splicer Says:

    СВАРКА ОПТИЧЕСКОГО ВОЛОКНА

    Компания окажет услуги по монтажу и сварке ВОЛС.
    Мы быстро и оперативно решим вашу проблему.
    Качество и оперативность выполнения работ достигается нами при помощи квалифицированных специалистов в области монтажа волоконно-оптических соединительных изделий.
    Работы проводятся с использованием автоматических сварочных аппаратов Fujikura s50 и Fujikura s60, которые являются флагманами ведущей мировой компании.
    При необходимости мы можем дополнительно провести замеры параметров волоконно-оптической линии при помощи рефлектометров Yokogawa AQ7261 и FOD 7003, что даст вам дополнительное подтверждение качества проделанных работ.

    ПОДКЛЮЧЕНИЕ ЦИФРОВОГО СПУТНИКОГО ТЕЛЕВИДЕНИЯ.

    Компания окажет услуги по подключению цифрового спутникового телевидения.
    На сегодняшний день при помощи установленных нами антен вы сможете смотреть 34 телевизионных канала, из которых 20 являются бесплатными.
    Стоимость комплекта подключения (ресивер, конвертор, антенна , карта “Старт”) – 8500 руб.

    Абонентская плата:
    0 руб./год. – Инфоканал, Первый, Россия, НТВ, Культура, ТНТ, Спорт, Вести, Петербург, РЕН ТВ, Бибигон, CTC, Союз
    400 руб./год. – Кинопоказ, Дом Кино, Много ТВ, Комедия ТВ, Индия
    400 руб./год. – Teen TV, Веселое ТВ, Телепутешествия, Зоо ТВ, Авто+, 365 дней ТВ, Боец
    500 руб./год. – Ночной клуб, Русская ночь
    600 руб./год. – Teen TV, Веселое ТВ, Телепутешествия, Зоо ТВ, Авто+, 365 дней ТВ, Боец, Кинопоказ, Дом Кино, Много ТВ, Комедия ТВ, Индия
    0 руб./год. – Мать и дитя, Теленяня, ДТВ, ТВ Центр, Муз ТВ, Домашний, Тонус ТВ (Бонус при условии подключения платных каналов).

    Контактная информация:
    почтовый ящик – splicer@bk.ru
    ICQ – 426245530

  • Max Says:

    I totally agree with you

Leave a Reply