Cross-browser Development with SuperPreview

Notice: This is a discussion thread for comments about the SitePoint article, Cross-browser Development with SuperPreview.


Today we conclude our Microsoft Expression Web series with, Cross-browser Development with SuperPreview, an article that focuses on SuperPreview, the browser-testing tool that has been integrated into the Expression Web package.

SitePoint’s very own front end development and design maven, Alex Walker, begins the tutorial by retelling the painful past of multiple browser testing. Using different computers, installing virtual machines, or subscribing to online browser shot tools were as good as it got, with each option having it’s own limitations. By taking SuperPreview for a spin, Alex shows us how easy it is to conduct testing in Expression Web across a myriad of browsers – even Safari 4.0.4 on OSX!

You’ll learn how to conduct a basic side-by-side browser comparison, and how to add more browser versions to your test. Alex will also introduce you to the SuperPreview toolbar, which has all sorts of cool buttons to make your life easier.

As you work your way through the article you’ll get a feel for SuperPreview’s local and cloud-based capabilities, and it’s unique capacity to compare and inspect DOM elements.

There is a short quiz, sponsored by Microsoft, for you to complete once you’ve read the [URL=“http://articles.sitepoint.com/article/browser-superpreview”]tutorial, so make sure you jog your memory and take a stab at it.

There are many sites I can’t actually open with Super Preview. I can open them in Firefox, Chrome and even IE but they just time out in Super Preview. That’s a bummer.

The question remains… does it work with interaction? Previous versions didn’t so it was useless to me.

So far I think superpreview is cool but I wish more browsers were supported. Local browsers are limited to IE6-IE8 and FF3.6, even though I have chrome, opera and safari installed as well. The online browser is only safari on mac osx (though that option really rocks!). Currently there don’t seem to be other options. Mind you, I love what is there right now, but it could still improve.

Can’t say too much about the rest. Haven’t tried any of the other programs yet, except for web expression and only really worked with the code view so far. But it’s been a very pleasant experience. After tweaking a few settings it really helps to speed up and smoothen up things. For me it’s a HUGE improvement over notepad++.

I’m sure to work through the other articles soon and check out sketchflow. Sounds interesting.

nice app. If I could click links, and see mouse rollovers inside the preview doc, I’d probably use this instead of IETester

Of course, I believe it will improve over time. When it first came out there wasn’t even an option for Firefox. I’m sure adding more browsers isn’t an easy task if you are trying to get more then just an image. For example the remote browser also has the DOM and positioning information.

You can pay $79, the upgrade price if…

Licensed users of the following products are eligible to upgrade:

  • Any Microsoft® Expression product
  • Any Adobe Creative Suite product
  • Any Microsoft Office product

http://store.microsoft.com/microsoft/Expression-Studio-4-Web-Professional-Upgrade/product/A4FEA7C5?WT.mc_id=expressionsite_WebPro4Upgrade

two things bother me:

  • why this testing tool is not made free by Microsoft. it only makes sense when the main reason for testing are it’s non-compliant browsers.
  • why didn’t safari do a better job. they where the first doing it.

but i expect everybody will start making tools like this one, for free, and this will be forgotten soon.

Contrid I’m no expert in the Expression suite but I can vouch for SketchFlow which comes with Expression Web as being an excellent prototyping tool, whether you are creating Silverlight apps or web sites or any other application. My only criticism is that it’s a bit slow, but that could be due to me running it in a Windows VM on a Mac!

There’s an excellent article on SitePoint by Shane Morris on getting started with SketchFlow that I found to be a great starting point.

I installed Superpreview but it seems like you can only use IE6, IE8 (compatibility with IE7) and IE8 in it. To use other browsers, you have to buy the Expression Web for $149.99

Do you think it is worth paying that? I haven’t looked at Expression Encoder and Expression Design included and I’m not sure what their purpose is but I can definitely use Expression Web’s superpreview.

Any comments about the price and the other tools included?

thank you for the information

If all browsers were standarts compatible (IE especially), there were no need for any “SuperPreview”'s. Right Micro$oft ?

nice application. If I could click links, and see mouse rollovers inside the preview doc, I’d probably use this instead of IETester