Alex Hardy

A new article on A List Apart by Bobby van der Sluis, called “Flash Embedding Cage Match”, offers a rundown of the options available for including Flash content in a webpage.

It refers to Geoff Stearns’ SWFObject script (my tool of choice), and compares it to Unobtrusive Flash Objects (UFO), which is by the author himself.

Now obviously the implicit message is “my technique is the best, use it”, but he does seem to have a point. UFO’s main advantage is that you can insert your JavaScript before the element that you want to replace with Flash content. SWFObject requires you write the code after it on the page, so you can’t squirrel away your Flash enhancements in a linked JS file. I always thought that was a bit nasty.

I’ll explore UFO more thoroughly before I choose a method for Refresh.

I thought I’d start posting little tips and tricks that I’ve found or come up with in the course of my web monkey activities. The aim is to share ideas and who knows, maybe improve on my own humble efforts through discussion

I’ll start with something that I cooked up and used on John Bishop Online and John Smith's Bitter. Not so much something new as a combination of a couple of techniques, this is how I currently include Flash content on web pages.

This technique uses the SWFObject script. This script has advantages over typical object embed techniques because it is more concise and doesn’t present the”click to activate control” message in Internet Explorer 7.

I’ve uploaded an example page.

The technique

To use the “progressive enhancement” approach that Yahoo! promote, we start with a H1:

<h1 id="swapme"><span>This header will be replaced</span></h1>

With CSS and JavaScript turned off (or the specified version of Flash unavailable), this header text will be shown.

CSS is used to swap the header text for an image. The contents of the span are made invisible, and the H1 is set to a size and background:

h1 span {
	display: none;
	visibility: hidden;
}

#swapme {
	width: 300px;
	height: 300px;
	background: #ff0000 url(image.gif) no-repeat;
}

After that, the SWFObject script is used to replace the contents of the H1 with the Flash object.

Room for improvement

• I’m going to remove the JavaScript to an external file.
• #swapme isn’t ideal semantically speaking… you’d have to give it an appropriate id for your site.

(see article)

Most websites are ostracising disabled people by failing to adhere to the most basic accessibility standards, according to a United Nations (UN) commissioned survey…

It makes you wonder if there shouldn’t be some sort of universally recognised accreditation for web designers and developers - to separate the wheat from the chaff, as it were.

I’d expect better than this from the BBC.

The W3C is “the web’s regulatory body”, is it?

Thank you, website designer Leonie Watson, for your insightful remarks.

[CSS is] … quite a new technology, it’s only been around a couple of years.

Oh really?