Accessibility and full screen flash site

[the_lar]

Hi all,

Just finished our new site which is full screen Flash effort (link in my signature if you're interested), now I would really like to implement some accessibility features, bookmarking, history etc.

The whole site has a central navController function through which nav requests pass which I've developed with this in mind, and I've got a vague idea of how to do this using invisible frames and passing variables through FlashVars but is there any consensus on what is the absolute best way of doing this?

The new Attik site is a good example of what I want to achieve - http://www.attik.com

Are there any good tutorials on this subject out there?

Cheers
Kevin

[kounoupi]

Bookmarking (deep linking) and history (browser front and back buttons) can be accomplished using SWFAddress (http://www.asual.com/swfaddress/). I had experimented with different other technologies before, but I found this the best tool around for the job.

Let me give you a quick breakdown of how it works.



package{

import flash.display.Sprite;
import SWFAddress;
import SWFAddressEvent;

public class DeepLinker extends Sprite{
public function DeepLinker(){
// setting event listeners for deep liking and navigation
SWFAddress.addEventListener(SWFAddressEvent.CHANGE , onSWFAddressChange);
}

private function onSWFAddressChange(e:SWFAddressEvent){
var section:String = e.value;
if (section == "profile"){
showProfile();
} else if (section == "contact"){
showContact();
} else .....
}

public function setSection(newSection:String){
SWFAddress.setValue(newSection);
}
}

}

That would be the bare-bones code of your site.

Whenever your user navigates to another section of your site, you call setSection. This updates the URL in the browser's window, and dispatches a change event. Change events are also dispatched when the user uses the browser's buttons, and also when the user directly accesses a URL "within" your site.

If your flash content resides in index.html of www.mysite.com, calling setSection("home") would show the "new" url of www.mysite.com/#/home, and the value of the change event would be "home". When a user directly navigates to somewhere within your site (say, from a bookmark) and goes to www.mysite.com/#/products/43, the change event would also be dispatched with the value "products/43".

I remember reading that there are workarounds to removing the # from the URLs if you are so inclined, but it does not interfere with search engines or bookmarks, so it is quite harmless.

Hope this helps.

[the_lar]

Awesome info, many thanks for that. From the address bar on the Attik site, I'd guess that that's exactly what they've used as well.

As I said, I've already got a navController which accepts strings in this format "menu+trends" or "article+aboutUs" and then decides what to do based on that string. I guess it would be easy enough to tie SWFAddress into that based on the code you gave. I'll investigate anyway.

[the_lar]

Hi,

I've got this working (almost) now and it's pretty cool!

I do have one small issue though, when linking to the site from Windows Mail it Strips off everything from the hash onwards. E.g. the link http://www.cabstudios.co.uk/new/#/article+theRules becomes http://www.cabstudios.co.uk/new/

This is definately a Windows Mail problem because testing on Mac OSX mail works perfectly. Also, accessing the address directly through the browser works perfectly as you'll see by clicking the link in this post. Anyone got any ideas?

Cheers
Kevin

[the_lar]

Update - after a bit of digging it seems that this is a well known bug in Windows Mail - something that Microsoft have known about since the earliest Beta releases of Vista, and yet still have done nothing to fix!

Unbelievably no links containing named anchors work in Windows Mail - it simply strips off the hash and everything after. Great eh!

Well done Microsoft, take a feature which has been working quite nicely in mail clients for oh I don't know... 12 or 15 years, and completely break it! Then, don't bother fixing it - awesome. I would be fired very quickly if I had such a sloppy approach!