Inspecting video and audio files

I've been using a handy little tool called MediaInfo to inspect some of the .flv files we display in the westernaustralia.com banner space and diagnose encoding differences.

The free tool displays all sorts of information about the audio and video streams:

If you found this post helpful, please support my advertisers.

Can’t reinstall Flash after failed v10 update

The silly Flash player failed to update in IE8 the other day; clicking the Get Flash link would take me to the installer page but the “gold bar” would never appear for me tell IE to download and install the player.

Chrome and Firefox are easier to deal with as the Flash plugin is installed through Add/Remove Programs.

Although forum reply suggested resetting IE fixed the problem for him I’m not that kind of guy ;-). For the record, Tools > Internet Options, Advanced tab and click the Reset… button.

In my case I resolved the problem by running the Flash uninstaller from the Flash Player Support Center

http://kb2.adobe.com/cps/141/tn_14157.html

Silverlight Penetration

I’ve posted a few entries on my findings around Silverlight penetration (see Resources, below, for more) but recently received a request for an update from someone called Harder. I’ve actually been meaning to post current stats for some time so thanks for the kick in the pants! I’ll aim to post updates every quarter going forward.

The figures represented are drawn from the Omniture SiteCatalyst web site analytics package, which tells me the number of visitors to our sites with a given plug-in vs the internet average over a given date range. Unfortunately the internet average is always shown as a constant with no further qualification (changing the date range doesn’t change the value and it’s unclear how the average is calculated) and Omniture does not indicate plug-in version. In the first case, I’m reporting the internet average from the point in time where I’ve recorded it—so I don’t have continuous data; in the second case, assume a mix of version 1 and 2. The same goes for Flash.

From the graphs below we can see one very interesting bit of information: Silverlight has been installed by 28.4% of internet users as of today (compare with 17.6 in September 2008). The number of users visiting our sites with Silverlight installed is considerably lower than the internet average, which is interesting because while our sites are graphically intensive and somewhat interactive we do target a wide audience with differing levels of technical ability.

Resources

• Silverlight Penetration (October 2008)
• Silverlight vs Flash Penetration (February 2009)
• Driving Silverlight Update – Playboy Archive (March 2009)

Clear the Flash Cache aka Local Storage

You’re probably used to the idea of session state and cookies and how to clear them using you’re favourite toolbar. Did you know the Flash plug-in also has its own client-side cache called Local Storage? Just like any other cache, stuff will occasionally get stuck in Local Storage and you may need to clear it out.

You can control your local storage settings by right-click->Settings… on any Flash movie but as far as I know you can’t clear cached data using this approach. To comprehensively clear the Local Storage cache I use this web-based tool provided by Adobe:

http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager07.html 

Silverlight vs Flash Penetration

Following on from the previous Silverlight penetration stats I posted last year, the latest (Q4 2008) figures are now in! 

15% of our visitors across all of the Tourism eMarketplace sites have some version of the Silverlight plugin installed (Omniture doesn't say which version). The internet average has increased since October and is now sitting at 21.5%--a reasonable gain. 

The ultimate contest is with Flash, however, and our stats are still telling us all site visitors have a version of the Flash player installed.

---

Custom-Built Microsoft Office SharePoint Server 2007 Branded Sites and Webpart Development - info@mediawole.com

Stacking Windowed Elements and Flash Movies with z-index and wmode in IE

There exists a common misconception z-index will solve all of your DHTML stacking problems. While this is true for DHTML elements, the assumption falls down in the face of Internet Explorer and the way this browser treats "windowed" components like drop down lists based on the select tag. Flash objects aren't immune but for different reasons. Firefox will honour stacking orders for all elements but this is not the case when you're dealing with IE6/7. Windowed elements maintain a different stacking order than DHTML elements (they're added to a different plane than your windows elements) and therein lies the problem.

IE7 is better than IE6 when it comes to the select element but Flash requires some additional finessing, which I'll detail below. If you're still supporting IE6, consider using an IFrame (perhaps dynamically positioned) between your windowed component and your DHTML object to mask the underlying windowed component. The concept is generally referred to as an "IFrame shim". Don't forget, IFrames can be configured with a transparent background; either way, simply point the IFrame URL at nothing. The IFrame is no longer a windowed element as of IE5.5; although some people don't like IFrames for security and because they're frames, in this case the IFrame is your friend because it bridges the gap between windowed elements and windowless elements. The one main gotcha with this approach is how the user interacts with an IFrame: button clicks and mouse actions will be sent to the IFrame and the underlying content won't be interactive while the IFrame is visible.

Flash--being Flash and an ActiveX-wrapped plugin--is a different beast. IE places embedded content in a DHTML layer above all other layers by default and this is not always where you want your Flash content. On the westernaustralia.com home page, a fancy combination of DHTML and Flash elements known as the Tourism Australia overlay sits above the wa.com Flash banner (it's only visible to international site visitors); the DHTML-based navigation likewise has to sit above the central "experience panel" and the global site selector drop down in the right column.

To reign in your Flash objects and their stacking order you need to use an extra parameter named wmode:

<param name="wmode" value="opaque" />

By doing so the Flash object and surrounding DHTML elements will team up to honour z-index styles as you intend. It's also a good idea to add a corresponding wmode="opaque" attribute to your element tag. Opaque and transparent modes may compromise your animations and video--we haven't had any problem on our sites, however, and use both animations (the wipe) and video. 

Here are a few additional tips for dealing with Flash:

• Add Flash elements to a predefined placeholder element using JavaScript to ensure the object is activated automatically (otherwise users will have to click the Flash movie to run it and movies that should play automatically without user interaction may not start when the page loads). SWFObject will do this for you but it's really easy to write the JavaScript into your existing .js files, thereby avoiding the need to weigh down your page with yet another script library.
• Don't rely solely on the embed tag. Use the object tag for IE and nest an embed tag within it for Mozilla and everyone else.
• Always explicitly configure the wmode parameter as a child of the object tag and an attribute of the element tag.
• Avoid the wmode "transparent" setting unless your Flash movie actually has transparent sections. Use "opaque" in most cases to increase rendering performance. The default is "window".
• Consider a Flash alternative like Silverlight ;-)

Microsoft's windowless vs windowed summary:

http://support.microsoft.com/kb/177378

http://blogs.msdn.com/ie/archive/2006/01/17/514076.aspx

Adobe's semi-useful KB article about wmode:

http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_15523

How to create an IFrame shim:

http://www.dotnetjunkies.com/WebLog/jking/archive/2003/07/21/488.aspx

---

Custom-Built Microsoft Office SharePoint Server 2007 Branded Sites and Webpart Development - info@mediawole.com