49

How can I see what my web site looks like in various browsers?

Short of actually having every different browser version installed, is there any tool or service that can provide a preview?

13 Answers 13

38
1
  • 2
    I like the parenthetical comments, good answer. Commented Jul 8, 2010 at 19:57
32

BrowsersShots and BrowserLabs are what I can think of off the top of my head. I think there is also something else I've used but I can't recall the name right now.

Edit: Sadly Adobe shutdown their BrowserLab project back in March 13th 2013.

1
  • 1
    Just make sure with BrowserShots that you deselect everything then just select the few you want (like IE6). Who the heck is using "Dillo"?! Commented Jul 12, 2010 at 15:01
10

LitmusApp is a new player in the field. Their current major value-add is e-mail client testing (33 clients, including mobile), but they also do "in the cloud" browser testing of up to 24 browsers. In fact, browser testing was their first product, and it's still available independently through the Alkaline tool.

I use Alkaline routinely. It's quite nice.

The best thing about it is: you don't have to own or install any of the browsers you want to test. They take care of all of that, and give you screenshots of the browser running on a real system in isolation. Myself being a terrible sysadmin person, this is ideal.

1
  • yes, they are friends of ours -- they also run doctype.com which is in the footer (though likely to get bumped soon) Commented Jul 11, 2010 at 3:34
6

This is quite good: http://browsershots.org/

See how it looks on a range of browsers and resolutions. Needs to be on the web though.

6

I would highly recommend testing IE in IETester, available here. It's lightweight, fast, accurate and supports all IEs from 5.5-up.

1
  • 1
    IETester gives a good reference on how your site looks like in the IE browsers. However we did have occurences where the rendering of IE6 was different then the real IE6 rendering engine.
    – Rickjaah
    Commented Jul 9, 2010 at 10:52
5

Have the browsers local gives you more flexibility. If you have an interactive website where you need to click on several buttons to test, you cant verify this with an image.

5

MS also have (as part of the Expression toolkit) a product called SuperPreview, which allows you to work either side-by-side or overlaid with an interactive version of your site in all versions of IE and the latest version of Firefox.

It also includes access to a web service that show you what your site looks like in Safari on a Mac - this will generate an image of the output, but also uses a metadata file that allows you to see which parts of the markup generated which parts of the image, so it's still quite powerful.

4

This is one of the core reasons to develop on an Apple computer. Using VMWare Fusion or other emulation softwares, it is the only computer that you can legally install all of the major operating systems on.

Then you can test the actual browsers in the actual OSes, not reliant upon outside sources to do your dirty work for you, where you can use the native debugging tools to fix/diagnose any errors.

4
  • Why Apple? You can also use a virtualbox.org on Linux or Windows...
    – mbrochh
    Commented Jul 9, 2010 at 7:51
  • 1
    Why Apple? Because you can't install OSX on Linux or Windows without violating the Terms of Service.
    – Dan Gayle
    Commented Jul 9, 2010 at 20:03
  • 1
    That seems a bit silly to me, you're saying one of the core reasons to develop on an Apple is that you aren't allowed to use OSX on other computers.
    – delete
    Commented Jul 10, 2010 at 2:45
  • If I could legitimately run a Hackintosh, I probably would, hardware issues aside. But again, it's just one consideration.
    – Dan Gayle
    Commented Jul 14, 2010 at 20:56
4

http://www.browsercam.com/ (online, not free) is another one.

4

Using a preview for the general design is good, but don't forget to test the behaviour of your site as well. This is especially usefull if your using a lot of hover, ajax or java-script effects, which you can't see on a picture.

I use VmWare with different virtual machines with the most important browsers installed seperately.

If you're using Windows 7 Ultimate I can refer you to a tutorial with Virtual PC and Xp Mode, which is a solution for running different IE versions on one host.

4

You may want to check out the thread on StackOverflow called: Testing a website on mobile browsers.

2
  • 1
    I think it's OK for the topic to be duplicated here because it is of special interest to webmasters. Commented Jul 11, 2010 at 3:35
  • 1
    @Jeff: That's why I used an answer, rather than marking as duplicate
    – Casebash
    Commented Jul 12, 2010 at 4:13
3

MogoTest is a very recent TechStars startup that does this well. It provides screenshots from different browsers and OSes, and validates your HTML & CSS, too.

1

I've used http://www.browserstack.com/ a few times, it works really well - surprised no-one's mentioned it yet.

Not the answer you're looking for? Browse other questions tagged or ask your own question.