About Object-Oriented Programming and accessibility for Flash…

New Flash scripting language ActionScript 3.0 has native classes for accessibility:

public class AccessibilityProperties

However, there’s already some people complaining about them.

Accessibility in focus

Here’s a website that I’ll need to check out at the end of this month: http://www.accessibilityinfocus.co.uk/.

Accessibility in Focus is actually a contest aiming to prove that accessibility doesn’t have to be dull, that you can have a good-looking AND accessible website. I hope to see loads of Flash websites and maybe get some inspiration about what is achievable in accessible design.

“Accessible Flash: Oxymoron?”

A very interesting article about accessibility for Flash: “Accessible Flash: Oxymoron?”

Ideas for the structure of an application to be accessible…

Object-Oriented Programming is just so much fun!

I was thinking, in a Flash animation, some elements have to be accessible (text and images) and some others don’t really have to (background color, ornaments…). Since almost everything is considered as almost the same in Flash (most elements in a Flash animation are movieclips), OOP can help me making a distinction between accessible elements and secondary elements.

Maybe I should have a class called “Element”, with methods such as “init”, “display” or “hide” and properties such as “x”, “y” or “transparency”. And I would have a class extending it that would be called “AccessibleElement” with properties such as “text” (this property could be considered as alternate text for images) or “rank” (if you have to render a simple layout for the content, you have to know what is the previous element and what is the next one).

The tricky thing is that some elements actually contain other elements. For example, an image gallery displays an image and at least two buttons to browse images (“previous” & “next”). I’m wondering, should I have a class called “image gallery” with an image element, a previous element and a next element or should I have the image element on one side and the buttons on the other side? These two buttons use a mechanism that could be reused for long lists of content for example.

I also thought of an abstract class called “Status” that would treat content just like web pages. This class is going to be very helpful for features such as deeplinking, bookmarking and even simple browsing, but maybe it could be included in a bigger class such as “Application” or something…

I’m wondering how I could work with Flash for so long without using OOP.

Accessibility & Usability?

What is the difference between accessibility and usability? These two notions seem to have nothing in common, however, everyone seems to mix them.

• Wikipedia: Accessibility
• Wikipedia: Usability

I’m thinking more and more of having one part of my work centered on accessibility issues for Flash, and another one on usability issues. Accessibility issues seem obvious for Flash (because the data is compiled, you can’t access it through usual screen readers, etc.) but usability issues exist as well and can be categorized in a different category. Loading animations are an example of a usability subject, it has nothing to do with accessibility.

I’ve just bought a book about Flash usability problems and solutions. We’ll see what they say!

Interoperability issues: Deeplinking 3!!!

I know, after two articles about deeplinking, you were not expecting a third one. Well, me neither!

Thanks to the wonderful effects of research, I happened to find an article of the Blitz Agency Labs website, talking about the “ultimate” deeplinking functionality for Flash: a JavaScript enabling deeplinking, bookmarking AND the use of the ‘back’ button in your browser!

Asual Interactive Solutions, a small Bulgarian agency, provides the script on their website. Blitz used it for the GE Imagination Theater website and the result is just amazing! I noticed it’s not very smooth but I think it’s mainly because some animations between two pages are pretty long.

Now the question is, what about people who don’t have JavaScript enabled? I’m thinking of creating some kind of “alternative browser toolbar” that would reproduce the address bar, the back & forward buttons and that would appear only when you have disabled JavaScript. Or it could be only a couple of buttons that would be called “back”, “forward” and “permalink”. I need to work it out.

Interoperability issues: Deeplinking 2!

In my latest post, I talked about the deeplinking functionality and how to implement it. Basically, you just have to add a query variable at the end of the URL. Now the thing is, how can your users add a page to their bookmarks or just copy and paste the URL of the page without clicking the “send to a friend” button?

Well, there is a way. The idea is still the same: change the URL. But this time, don’t use query variables, use named anchors. The idea is that you want the address bar of your browser to display a URL going to the very page you’re viewing now. It is possible to modify a URL thanks to JavaScript (window.location.href = ‘http://www.jujupiter.com/index.php?page=home’;) but if you modify your URL by adding query variables, the browser will reload the page, and thus, reload your Flash animation and interrupt animations, which is the last thing that you want.

You have another way of modifying a URL, thanks to named anchors (http://www.jujupiter.com/index.php#page=home). The advantage with them is that they don’t reload the page when you add them through JavaScript. Now the only thing you have to do when you load a page with this URL, is to analyse the URL, see if there is a ‘#’ symbol, and add everything that is behind it at the end of the URL of your Flash movie when you call it in your HTML code:
<param name=movie value="flash_website.swf?page=home" />

And now your user can bookmark every page of your website, or copy and paste them to a friend, add it to a del.icio.us feed…

Here is an article with beautiful examples:

Deep/Stateful Linking in Flash MX 2004 Applications

Interoperability issues: Deeplinking

Another issue of Flash is that you can’t access directly one page of the website through a link. For example, if you may want to show something to some of your friends, you send them the link to the website and you have to tell them to click here and here and here. If I am your friend, I won’t even click on the first link, because I will think “too complicated, don’t have time for that”. But let’s stay I click. I go to the Flash website, I have to wait for it to load and now there is an intro animation and now I have to find the link, the second link, etc. This is very annoying. But there is a way to fix that, that is called “deeplinking”.

Flash accept parameters. When you define it in a tag in your HTML page, you can pass it a few parameters. Thus, you can pass a variable that would indicate the page to display. Usually, the code is:
<param name=movie value=”flash_website.swf”>

If you pass it a few parameters, you have:
<param name=movie value=”flash_website.swf?page=contact”>

In the example above, you’re defining a variable called “page” and assign it the value “contact”. In your Flash movie, you’ll have a piece of code testing the value of “page” and that will go directly to the section indicated by the value of this variable.

Now, you have to define it in your URL: just add the page parameter to the end of your URL, just like for your Flash movie., and you’ll get: http://www.test.com/index.php?page=contact. The “index.php” will, thanks to PHP, pass this parameter to the Flash file and that’s it!

You can now have a feature on the website saying “send to a friend” and giving this url to send to your friend. And now, I’m willing to click on it!

More about deeplinking:

• Deeplinking in Flash applications
• Deep Linking in Flash and AJAX Applications

The next post will be about a more enhanced form of deeplinking.

Interoperability issues: Flash & statistics

Another issue with Flash is that you can’t track what your user checked on your website.

For example, if your user goes to your website, he will click on several links in the navigation. The thing is, these links don’t match with files and, as a result, each new page visualised is not added to your website’s logs and then don’t appear in your statistics.

This issue is not a problem to the user, it’s actually a problem to you because you don’t know what is the most attracting part of your website, the least attracting part of it or whether an article has been read a lot, etc.

Let’s think of some ways to fix this issue:

1. Split your Flash file
You can, if you like, split your Flash file into several Flash files. You could have one main Flash file that loads other Flash file, one for each page and then each file will be notified in your logs. However, according to the statistics tools you use, it’s pretty sure than these Flash files won’t appear in your statistics as the Flash format is not recognized a proper page. Besides, according to the size of the content of your pages, it could be very painful for the user to wait for the page to load and display each time they click on a link.

2. Use Google analytics
Another solution is to use Google analytics. Google analytics is a statistics tool developed by google that enable you to track every page of your website, as well as Flash pages. How does it work? It’s pretty simple. Google analytics provide you with some Javascript code that you have to insert in every HTML page of your website, as well as the one containing your Flash object. Inside your Flash object, you just have to call the JavaScript function they gave you, and pass it the name you want for your Flash page (“about”, “about/people”, etc.). It works very well. The only problem is that some people turn off JavaScript, therefore, you can’t track them. Google analytics also require images and cookies to be enabled. It’s a shame Google analytics doesn’t provide code that doesn’t need these features.

3. Develop your own statistics tool
You can write a function in your Flash file that will call a PHP file that will write in a file or in your database that the user with such IP viewed such page at such time. Then, you can create a page that will compute visits, pageviews, etc. This way, you are sure you will get what you want. But it is quite time consuming and intricate: How do you compute a visit? How do you know where your user come from? How do you know what keyword brought your user to this specific page? The subject is very broad and it will take a lot of time to develop a tool that can answer all your questions.

So?

Well, personally, I would run for the Google analytics solution. Because, first of all, it’s Google, and these guys know what they do. Second, because everything is already done and it’s very simple to implement and very efficient. Then, because someone who has Flash Player probably has JavaScript, images and cookies enabled, don’t you reckon?

No.

I think I’m just too lazy.

Flash interoperability issues

The following links are articles about Flash and search engines:

• http://www.jehochman.com/articles/seo-friendly-flash.shtml
• http://www.marketposition.com/blog/archives/2006/07/flash.html
• http://www.beedigital.net/blog/?p=878

This whole thing between Flash and search engines is actually very interesting because it emphasizes the issues Flash is having to interact with other programs that usually make it easier for the user to browse the net: search engines, bookmarks, text magnifiers… Flash interoperability needs to be an important part of my work.