Once in a while though, we do it. So Flash Builder 4 is finally available ! The pricing is around the same as the previous version, Flex Builder 3. $250 for the standard version and $700 for the premium.

Among the huge improvements in the Flash workflow, the data-centric, skinning and styling features are just what we needed. Have a look at the grid of features for more details.

Flash Catalyst wasn’t mentioned anywhere but I guess it will be part of the CS5 release. Until then you can still play around with Catalyst beta 2.

Talking about buzz-like news, Adobe made a countdown for the CS5 launch with a wooden font. Now 16 days : 01 hours : 08 minutes : 21 seconds. You got that much time to buy a new 64-bit computer for After Effects CS5. Yes, Adobe asks you to contribute to the rampant consumerism. What will your answer be ?

Say you got a nice shiny Flex project with Locales and internationalization all around. You want to transfer the whole project to another developer’s workspace on another machine. The target has got a fresh Flex Builder install, nothing customized and all. You import your project within the workspace and everything’s fine EXCEPT Flex Builder starts yelling about its inability to open a Locale (in this case a Frog).

A quick google-pet-sniffing tells the poor target that he has to run a script on DOS or on the Terminal to copy a bunch of files (see Adobe labs and Herreman’s article). Fine, he’s got a French locale. So he goes on the Flex Builder again which is still yelling with a deadly cross. First thing you do : close the project and re-open it. Second : close Flex and re-open it. Third : close the computer and re-open it. Fourth : close the office and…(what would you do next ?)

I’ll save you a couple of minutes here. The only solution is to kill the project, delete it (not the files, just the project) and import it anew. And THAT WORKS ! Don’t ask me why.

It happened to us a few times, not only in this case but on some other configurations where Flex Builder shows PTSD symptoms and still wants to display a white on red cross when everything’s fine. Here, the fact that we imported the project after the modification fixed something. But sometimes you haven’t done anything like that and Flex Builder (or I’d rather say Eclipse) is stuck in a state with your project. Just create it again even if it’s a hassle.

By the way, it’s not limited to the Flex Builder. Flash got similar problems sometimes. Like you want to save a class and compile but nothing looks like the changes were applied, except your file IS saved. You’d have to recreate an .fla and it’d work.

The Answer

That’s about the same solution as kicking a device to make it work properly again. I can’t wait to see in the next bad movie a hacker closing the project and importing it again. “Haha look at that !”. He might not look as cool as beating an engine in a spatial module with a wrench (remember Armageddon, that risible movie ?) but given what you can see in blockbusters, I say, why not ?

Toxic snow contaminates the AIR

Or is it the other way around ?

We recently put to use the feature of dynamic pdf loading in AIR and we met a little problem. If you try to open a pdf document within the HTMLLoader on a MacOSX Snow Leopard, your application miserably crashes. I’m surprised I didn’t find much information but a few forum threads about this.

Random fact n°2401 : snow leopards do eat anything you throw at them

You can read about it on google groups but you won’t find any clue to a solution whatsoever. Doing what Hitomi Kudo from the AIR team advises doesn’t change anything.

The problem either comes from Adobe air + pdf or from Snow Leopard. There were many changes under the hood of Snow Leopard. The after effects were quite similar to the release of Vista. A lot of things didn’t work and required new drivers and blabla. So I wouldn’t be surprised Adobe didn’t see this one coming. — Just like Apple’s sly attempts to avoid the Flash Player on the iPhone — (subliminal message).

Still we’re stuck with this problem and there is no way to display a pdf in an air application under snow leopard.

We also tried an advice on this post on the adobe forum without success. It basically says you should add “file://” when you call a file on MacOSX.


Alpha…ville

It is only natural that you would enable the alpha on your application so that your rounded borders or whatever look nice. Well forget that if you intend to use pdf documents ! Enabling the alpha on the application level is cause to so many issues that it reminds me of the “transparent wmode” beast to avoid at all cost on websites. This isn’t the web though. Perhaps if we shout all together at once “we want alpha”, some Adobe developers will hear us wherever they lurk.

WE-WANT-ALPHA ! *pretty please !*

Überlays

To complete the picture, we found yet another annoying bug. In the same configuration, an air application with a pdf within an htmlloader, the htmlloader is masking everything that should be on top of it. So if you have a combobox just over your htmlloader, try and click on the combobox and the panel which expends down will be masked, as if it were in a lesser child index than the htmlloader instance. What a drag.

Integrating the PDF reader into AIR does seem to be a huge task for the amount of bugs we get with each update…

How about AIR 1.5.4 ? or AIR 2.0 ? Let us be patient.

Anyway, I figured I’d use a NetStream to load the m4a song. My google pet told me there were other helpless people asking how to pull a SoundChannel out of a NetStream but it doesn’t seem to be the way to do it.

The answer is rather simple but its implementation is a bit weird :

var ba:ByteArray;
//computeSpectrum(output:ByteArray, FFTMode:Boolean=false, stretchFactor:int=0)
SoundMixer.computeSpectrum(ba);

Basically you’ll need to start the usual NetConnection and NetStream stuff, grab your song and listen on ENTER_FRAME events to analyze the sound spectrum with this method.

Here’s what the doc says about it :

Takes a snapshot of the current sound wave and places it into the specified ByteArray object. The values are formatted as normalized floating-point values, in the range –1.0 to 1.0. The ByteArray object passed to the outputArray parameter is overwritten with the new values. The size of the ByteArray object created is fixed to 512 floating-point values, where the first 256 values represent the left channel, and the second 256 values represent the right channel.

If you want to use this bytearray as a source for a spectrum visualizer, you’ll have to experiment doing some maths and bitwise calculations, all that in some loops. Using ba.readFloat() will give you the next value in the byte array. So your loop will likely perform 512 (or 256 if you only want one channel) iterations to use all the values of the spectrum.

This method of analyzing the sound spectrum on the fly has two major weaknesses :

1. if you got multiple sounds playing, you can’t tell them apart with this method as it gives you a spectrum for all the sounds together.
2. if you intend to use it for serious sound applications, you’ll want to enable FFT (using a Fourier transformation) and the calculation will generate a noticeable lag, making your analyzer appear unsynchronized, late.

Luckily for us and in most applications, the sound spectrum is meant as a visual entertainment, nothing more.

There’s a very good sample on todaycreate.com with insightful comments in case you don’t really know where to start.

Additional and detailed explanations are available on the Flex 3 language reference.

A great thing however, is the way you can get a lot of information on an m4a input. There are three events currently supported :

• onTextData gives you the current text of the playing m4a. It could be anything and in our case it’s the name of the current track.
• onImageData gives you the current image of the podcast. Just like the texts, the image can change if your podcast got chapters.
• onMetaData is important to get the duration of the stream. Additionally, the event object tells you of a lot of things about the stream like the sample rate, the channels, the tags, etc.

Depending on how the m4a is documented by the podcast creator and the software one’s using, you could even chapterize a podcast in order to get something similar to cue points in the chapters property in the metadata. You won’t get everything you want though. I would have appreciated to get a list of all the text data and their seek time but you can’t get them beforehand. You must play the stream in order to get the events one by one so if you really need a list of the “text points” (they aren’t cue points), you’ll have to make one manually…

At that time, Sean Corfield wrote a good summary of Thermo.

Starting with a Photoshop PSD file, Thermo imported this and converted it to MXML. Design elements can then be selected and with a simple right-click they can be converted from artwork to Flex controls. The automatic inference of design-time data sets so you could test UI interactions with “real” data was very impressive.

Mark Anders, vice president of engineering for Adobe, also told this.

Thermo, which is in the early stages of development, is built on the Flex Builder development environment, a tool the company already offers to help bridge the gap between developers and designers. Flex provides workflows developers can recognize to render visual parts of the application so it’s easier for them to add visual elements to an RIA. Designers using Thermo don’t have to write code for their applications, but they can choose to view the source code and see it in a Flex Builder editor that they can work with if they want to, Anders said.

Rejoice (should we ?) for it is called Thermo no more. From now on, it’s Adobe Catalyst. The name isn’t bad considering it will speed up project developments (hopefully !).

Waiting for the release, you can already drool over the video that Adobe published on their Labs website.

As it seems focused on Flex, I wonder what will become of Flash itself as Catalyst will fill the gap between graphic designers and flex developers but not between graphic designers and flash developers.

An early release of Catalyst was available to those attending MAX at San Fransico but it’s still gone public. You can signup on Labs if you want to be noticed of the release.

For more concrete samples, go take a look at the Catalyst team blog.

Adobe, with it’s recent “open mania”, has lifted the SWF (and FLV) format specifications and created the Open Screen project on the fly to help Adobe increase the Flash Player embedding into various devices (anything with a screen basically). Following this, Adobe has been working in cooperation with Google in order to make Flash more indexable by search engines.

Pros

Google was given a special version of the Flash Player so that its indexing robots could retrieve data directly from a SWF. The player just behaves like a standard human user and accesses data, writes it in a comprehensive robot-language and gives it back to the robot. So Googlebot is now able to crawl dynamic data !

Soon Yahoo will follow in the venture and probably other vendors as well.

Here are a few articles you’ll want to read :

• Google Webmaster Central Blog : improved Flash indexing
• Adobe’s article : SWF Searchability FAQ
  
• Adobe press release : enhanced search results for RIA

Google sums it up with this short news :

Now that we’ve launched our Flash indexing algorithm, web designers can expect improved visibility of their published Flash content, and you can expect to see better search results and snippets.

Cons

Ron Adler and Janis Stipins from Google relieve the designers :

Basically, you don’t need to do anything. The improvements that we have made do not require any special action on the part of web designers or webmasters. If you have Flash content on your website, we will automatically begin to index it, up to the limits of our current technical ability.

So they say. Oh wait. Perhaps it’s not that simple. There are two important problems. Ron and Janis said there are still three technical limitations, two of them being the following.

1. Googlebot does not execute some types of JavaScript. So if your web page loads a Flash file via JavaScript, Google may not be aware of that Flash file, in which case it will not be indexed.

If you’re a Flash designer, you’ll immediately think of SWFObject which is actually based on Javascript. Lots of Flash web sites use it. We don’t know whether it is of a type that won’t be executed by Googlebot.

2. We currently do not attach content from external resources that are loaded by your Flash files. If your Flash file loads an HTML file, an XML file, another SWF file, etc., Google will separately index that resource, but it will not yet be considered to be part of the content in your Flash file.

It is a major problem because a lot of ActionScript developers use a light SWF files that loads the rest of the application on demand. Sections are often broken down into several modules, sometimes meant for re-usability (an Object Oriented convenience).

Searchability

Andrea Hill wrote some interesting thoughts on this topic.

Another major challenge in opening applications up to search is being able to direct the searcher to the relevant section within the experience.

I couldn’t agree more with that. There is a huge difference between RIAs and HTML in that the RIAs aren’t accessible automatically, you have to decide what is to be accessible. Adobe’s answer is in the SWF Searchability FAQ (listed above) :

To generate URLs at runtime that reflect the specific state of SWF content or RIA, developers can use Adobe Flex components that will update the location bar of a browser window with the information that is needed to reconstruct the state of the application.

For complex sites that have a finite number of entry points, you can highlight the specific URLs to a search spider using techniques such as site map XML files. Even for sites that use a single SWF, you can create multiple HTML files that provide different variables to the SWF and start your application at the correct subsection. By creating multiple entry points, you can get the benefits of a site that is indexed as a suite of pages but still only need to manage one copy of your application. For more information on deep-linking best practices, visit www.sitemaps.org/faq.php.

With all this in mind, it is not safe yet to think Flash web sites will be indexed easily. Google is already working on the limitations of the Googlebot and I’m looking forward to hearing news of their progresses.

Update on 23 July 2008 : “Reserve your tickets today. Early-bird tickets to Singularity are just $99 USD (inc. VAT) until the end of August.”

A site teaser has been released some days ago on Google app engine. As Aral wrote :

You can sign up for the site, which will go live in July, and register your interest in the conference[…]

Even though it’s a web conference, it does not mean it’ll be free. The attendees will have to buy tickets that will be on sale on July 1, 2008 with the launch of the new site. The pricing is still unknown but Aral said it’s affordable.

Can’t make a certain session? No worries, it’s all recorded. And attendees have exclusive access to the sessions for six months, at which time the recordings for the 2008 conference will be released under a Creative Commons license for the benefit of all and to form a time capsule defining Web ’08 as presented by our amazing line-up of speakers.

If you want to hear some words of him, the Télévision Suisse interviewed Aral while he was attending the LIFT conference some months ago.

The good

Performances

Until the likes of Papervision, dynamic 3D rendering was rarely used in Flash websites. The latest Flash Players brought some consequent changes upon processing speed. Hence it allowed some 3D engines with reasonable performances to peek their nose in the community.

3D engines give an extra dimension to creativity, though they aren’t fit for complex scenes yet. Even the Alternativa engine has its limits, those of the Flash Player. It’s been a few years since the community asked for hardware support so that we can get rid of some slow performances. Well, with the Flash Player 10, you will be able to choose different display modes like normal, direct and GPU. You have to be very careful if you decide to set the GPU mode.

These modes in general should be considered still in beta, there may be a lot of bugs until possibly Flash Player 11 so use caution.

This quote is by Jody Brewster who gives some precious Flash Player 10 GPU acceleration tips on his blog.

Gimme the sources

Most of the 3D engines in Flash are free, both for personal and commercial use. And most of them are open source (except Alternativa, to my knowledge).

The bad

Looks

3D engines also mean an extra dimension of complexity, and increased risks to make bad visual designs. This can lead to an “UGH” factor where the 3D looks either dull or slow or complicated.

It usually holds true that the bigger the scene, the slower and laggier. Same goes for details and the amount of objects on the scene. Your bitmaps may also look very jaggy or aliaised so you will loose the “smooth” graphics factor. You can always try to make up with nice 3D motions.

Do not expect your 3D to look as smooth as a 3D video render from a software like 3DSMax. Depending on the engine, you might as well endure backface culling problems, basically meaning some polygons of your 3D object won’t show up when supposed to do so.

In the image above, you can see a part of msnbc Spectra. You can easily distinguish that the text on the violet panel is weirdly distorted with the Papervision engine. The “wow” effect is here but this visual bug makes it a little less impressive. FIVe3D would have been commandable here as it displays fonts using the vector API of Flash. That “detail” aside, Spectra is still a very nice example of a good 3D user interface.

Update on 23 July 2008 (by Seb) :

The reason for that distortion is that the FlashPlayer can only perform skew transformations on bitmaps; in order to get any kind of 3D stretch we need to resort to using this hack.

Things are however improved with FlashPlayer version 10 — we now have the ability to do proper 3D perspective stretching on bitmaps, and so this horrible distortion should be a thing of the past.

Overkill

You have seen it coming, why not build 3D Flash banners ? A 3D engine (in activity) consumes a lot of CPU power. Think twice before going all out with a super-3d-banner-of-the-death which plays continuously heavy 3D stuff. Who said common sense ?

Hack and slack

In the end, Flash is still not ready for 3D. The Z dimension is now affordable thanks to the devoted work of some flashers but their engines are built on a weak platform, that is the Flash Player. It still cannot handle bitmap processing quickly, which is the biggest barrier to 3D. Alex Cove (author of the 2D physics engine APE), asks “does it always have to be a hack ?” truthfully. Is Adobe waiting for some miracles from the community to move on to 3D ? Flash Player 10 is a beginning to this but it doesn’t even include Z-sorting so you end up doing it manually…You end up taking Away3D and waiting for the Flash Player 11 patiently.

Still, Adobe has been listening a tad bit to the community’s requests (business obliges), as Macromedia did in the past. Changes like that take some time, especially for the Flash Player which wasn’t meant for 3D in the first place.

3D real time engines

Sandy

Sample : Telenor Body Language, Sandy demo

Originally, the project had several members but it is bit of a rundown now, with only one member left, Thomas Pfeiffer.

Sandy is not to be overlooked however. It’s the first open source 3D engine and it has some very powerful features with light rendering.

Papervision

Samples : Audi Rhythm of lines and msnbc Spectra

Papervision rose with a better communication and is backed by some notorious Flash personalities. All that Sandy didn’t have.

It’s by far the most famous of the 3D engines available, and one of the most complete too. It is available at version 1.5 on the blog’s download links. The next Papervision 2, called GreatWhite, is in beta currently and only available on SVN repository.

Away3D

Sample : Fifa Street 3

It is considered as an extension of Papervision, though the two authors had to rewrite a lot of the base classes. The project is hosted on away3d.com.

Away3D still lacks documentation a lot. From what Rob Bateman said, this will be solved soon.

As announced in an article on Papervision’s blog, Away3D is planned to merge with Papervision GreatWhite. Update on 12 July 2008 (thanks Seb) : Papervision has by now integrated a part of Away3D’s features. Both projects are still on going.

WoWEngine

Sample : technical demo

Jerôme Birembaut developped the WoWEngine and nicely made it available to everyone on his blog.

This engine is very interesting because it mixes some bases of Sandy with an extension Jerome wrote of the 2D physics engine APE. The result is a 3D engine with physics features like collisions, cloth and rope simulations to name a few.

It is very likely you’ll use this engine if you want both 3D and physics interactions within your application.

Alternativa

Sample : 3 demos on their website.

This engine is a killer. It is developped by a russian team. They’re invited at the coming Adobe MAX at Milan, in december (2008), one extra reason to attend this huge event.

Alternativa has been publicly released but it is free for personal use only. Licences must be purchased for commercial use. You should take a look at what this engine can do. One word for them : Отлично !

FIVe3D

Samples : FIVe3D homepage itself which includes 5 samples

Mathieu Badimon wrote a small 3D Engine as “an open source code for the conception of interactive vector-based 3D animations”. The FIVe3D homepage is a good implementation of the engine.

This engine relies upon the Flash Player to handle vectors, rather than bitmaps with the aforementionned engines.

One of its strengths, aside from being very light (10KB), comes from the way the engine handles fonts. With FIVe3D, you can use any font you want to any size without barely any aliaising or ugly text artifacts you might see in Papervision. A good choice for titles and headers. The little shortcoming to this is that you have to use additional font data (stored as an AS3 class). It is fortunately generated automatically by the tool Mathieu provided on the FIVe3D web site but it still weighs around 50KB for simple fonts.

Update on 23 July 2008 (thanks Seb, again) : attempting to render a lot of text with FIVe3D will result in a framerate drop due to the heavy calculations that the vectors imply for the Flash Player.

What engine shall I pick for my project ?

You don’t necessarily have to choose only one 3D engine. You can easily use multiple engines, each for a different use. This point was discussed last month at the AUGG (Adobe User Group of Geneva) meeting about real time 3D engines.

So for instance you could make some intro with large titles with FIVe3D, then display some simple textured objects with Papervision and constraint them physically with WoWEngine. Even among the samples listed above, there are certainly some cases where several engines were used together.

Not to mention many projects don’t rely on sole 3D but also blend some videos of 3D renders as you can see in the Fifa Street 3 sample.

Can I import 3D models ?

Yes you can. Sandy, Papervision and Away3D can import Collada files to display complex meshes (read less simple than just a sphere or a few boxes).

Some 3D softwares can’t export do not have a built-in exporter for Collada files yet. If you want to export using this format, you’ll certainly find some free exporters since Collada is an open standard based on XML.

Another possibility is to use the AS3 Geom Class Exporter either for 3DSMax or Blender. It will generate .as files and the advantage is that the engine won’t have to parse the file since it’s ActionScript already.

Isn’t Flash CS4 going to wipe out those engines ?

No it isn’t. If ever Adobe adds a fully fledged 3D platform within the Flash Player, the 3D engines of then will adapt and make use of its new benefits. Some engines like FIVe3D might be in direct challenge with the next Flash CS4 features. However I don’t think Flash CS4 will be released before late 2008 and it’s not even sure if the so-called “3D” features will be as easy to use for coders as what’s available currently through open source projects.

Is it worth it to go 3D finally ?

Without a doubt, yes it is ! Just imagine : you can dynamically render basic 3D. For instance, the amount of CoverFlow components for Flash/Flex has exploded thanks to those 3D engines listed above. A proof that simple and effective UIs are also relevant in 3D sometimes.

And it is not limited to commercial entertainment websites at all. Embedded user interfaces are yet another market you can target. The InteliSea application presented last year at MAX 2007 includes some simple 3D to display the sea state for a boat. Another proof you can make “serious” applications with 3D (and sometimes it might be mandatory).

I will talk in a further article about GIS (Geographic Information System) and 3D with Flex. It’ll be a nice follow-up.

In this article, when I talk about different “views”, I mean different technologies used to display some content, be it Flash, Silverlight, Java FX, etc.

Content crawling

Earlier practises

The idea of presenting a multiple views (or aspects) for some content isn’t new at all. It has been a common practise for a some web agencies to develop two websites for their clients, one in HTML and one in Flash. The very purpose of that is to be (supposedly) accessible to 100% of the web users and also to be search engine optimized.

The Flash view would provide more interactive content to the visitors on broad band whilst the HTML website would be focused on clarity, quick information look up and accessibility. Building a Flash and an HTML website for the same content (more or less) involves duplication of similar work BUT different skills. Such a strategy consumes more time and more people, more resources. In return, you can optimize your HTML view for search engines and page ranking for the benefits of the Flash view.

The huge advantage of this is that your dynamic (and static) HTML content is crawled by search engines and you can propose a redirection to the visitors who may like to browse the Flash view instead.

Recent evolution

Ever since Google and other search engines were able to look into .swf files, some people have thought “fine ! all the content within my Flash website will be indexed !”. They need to know what is static and dynamic content. They also need to know the very basic thing : how an RIA works.

Static content is embedded content, you find it in the resulting file, .swf for Flash or Flex. Dynamic content is loaded from external sources like databases, so data is NOT in the application itself.

Most of the RIAs work dynamically. Search engines CANNOT index dynamic content, meaning directly from the databases. What do search engines see when they look into my Flash web site then ? Almost nothing. They can see the title and description and a few static things in the Flash library. That’s all.

Nowadays

It is often the case currently that Flash web sites remain in Flash alone for the HTML view is a loss of time compared to its development cost. With the rising of RIAs on the web, more people are looking for SEO solutions.

A recent trend among Flash and Flex developers is to talk about some ultimate SEO weapon called XSLT. It’s actually not a big deal. However, we can use it to make what was a huge bother before : a second view of the same data model.

First of all, XSLT works on XML documents and is quite powerful to transform them into any result you need, like HTML. In most cases however, the web site’s data is stored in a relational SQL database so it’s an extra step to retrieve data and transform it into XML to then feed it to XSLT. And logically, you’d use the same XML for your RIA but it’s not mandatory indeed.

Even though XLST transforms data, you still have to write and test the whole thing and XSLT is quite touchy, there’s no room for errors. Depending on the complexity of your output, it may be quite a pain. The point is that it still consumes less time than the former HTML view development I discussed about BECAUSE the raison d’être of the HTML version for RIAs is not the same anymore. The XSLT output is meant for search engine bots and accessibility.

If you look at the HTML view from the current XSLT implementations, it’s very simple, even without layout sometimes. Standard users without the Flash Player wouldn’t want to surf on such plain and boring HTML. So why isn’t it focused on those users ? Because it would be the same as the former solution. The purpose of the XSLT implementation here is to provide an average solution, a first step towards SEO for RIAs on the web.

To my knowledge, there aren’t many websites with such an implementation yet. A “reference” in the matter is the Flex directory. If you display the HTML sources, you’ll see numerous div layers containing the directory data.

Deep linking

Talking about deep linking a few years ago was only a mean to emphasize that Flash websites just couldn’t do it.

The solution has come with Actionscript’s ExternalInterface : anchors handled by Javascript for deep linking.

Currently, this method is more and more used in Flash and Flex web applications for it’s quite easy to implement. As stated above, deep linking is achieved through HTML anchors. Why is that ? Because anchors avoid the browser from reloading the window, thus restarting your whole web application. However, anchors aren’t the perfect answer to the problem.

Consider this deep linking example :

HTML web site : www.yoursite.com/article/roundup-is-lethal

RIA web site : www.yoursite.com/#article/roundup-is-lethal

Obviously, the first URL is better. There’s no workaround at the moment but it’s a little sacrifice considering you can deep link an RIA. How it works ? Javascript listens to changes in the URL and notifies the RIA if something happens. The RIA can also call a Javascript method to update, or rather rewrite the URL when the RIA state changed.

Talking about Flash, there is a nice library called SWFAddress that provides you with those functionalities (for Flex, there is also a built-in library). Be aware that implementing deep linking in an RIA must be planned. It is not a lot of work but you have to decide what will be deep linked or not and architect your application accordingly.

Search engine bots

Detection

The strategy above requires to detect search engine bots. You need to know who’s coming on your web application in order to serve either HTML content or the rich application itself.

There is no absolute mean to detect every single search engine bot because there are thousands of them. So you will probably use a smaller listing of the most important search engines bots on the web.

Fake user agent

Ineluctably, the ways to detect the real user agent of a given visitor aren’t perfect. The motto for security related matters is to minimize most of the critical weaknesses, not to build the perfect defense. It is possible to verify the identity of a user agent to some extent, and that will be sufficient for most of the evil and violent crawlers. You can do it with DNS lookup and MySQL caching for instance.

Search engine optimization

Cloaking

First of all, I saw a lot of talks about cloaking when it comes to provide both Flash and HTML views of a website. It is often used to introduce the killing line “it could get you banned from Google !!”.

I even found a redundant post among several SEO sites that happily emphasize that SWFObject is considered “dangerous”. If that statement is true, many Flash websites have a problem as SWFObject is famous right now. However, those alerting posts you can read are all dated from 2007 and many things change in one year so it might not be dangerous anymore.

Google bot (I don’t know for the other bots) dislikes that we hide content, be it by css or like SWFObject does, by using DIV layers to hide the HTML under the Flash layer.

Nevertheless, if your content in HTML matches what you can find in your Flash view, there shouldn’t be any problem. But you’re still at risk.

Rumors and gossip

As I was looking up the web for insights about Flash and SEO, I read on Google’s forum some comments whose author sometimes doesn’t know what he/she’s talking about, hindering the discussion about how to better designs so that RIAs can be search engine optimized.

It is a fact that human beings dislike changes. It is also a fact that people often do not seek further than what is affirmed. They like an idea or not and if you confront them, they will fight for it. In case of the SEO community, talking about Flash and SEO will never fail to generate a few worthless comments like “consider using gifs instead of Flash”.

To the people who still do not understand and keep thinking about the current situation as a war between HTML and Flash, I’ll write this : given a situation, a context, a full-flash website or RIA is a relevant answer to a problem, as it might not be in another situation. That’s all there is to it.

It’s no use telling “Try to use Flash only where it is needed”. You can find this very “advice” on Google’s website but it’s quite stupid to write that under the “Best use of flash” title. The same statement about “using something only when needed” is valid for everything anyway.

RIA and search engine

With the spread of RIAs, search engines are likely to collaborate with Adobe and Microsoft as Google did with the Adobe Search Engine SDK. It’s merely the beginning of a new era of visual content though. Some day, I believe search engines will provide support and crawl dynamic content, with the collaboration of both the data holders and indexers. On top of this, video contents are spreading on the web. Indexing their content (not only their titles as Dailymotion, Youtube and the likes do) is going to be one of the next challenges for search engines too.

Accessibility

Upsetting matter

Why talk about accessibility now of all times ? It’s not totally off-topic. SEO is a kind of accessibility for search engines after all.

As a part of the talks about ergonomic designs in Flash, accessibility is something everyone knows but vaguely. You can easily find a few people who argue that screen readers can’t read Flash content, the bottom line being “Flash is bad, make your website in HTML because it’s accessible”.

First of all, Flash does have accessibility features. However, they’re often ignored because it’s even less likely designers will care for the blind people when their application is more visually-oriented than HTML websites.

Blind people

We had a meeting one month ago with the president of the Swiss Federation of the Blind and Visually Impaired. He showed us how he, as a blind, “sees” the web. He got a screen reader and it was my first time listening to one such equipment. I was stunned. The voice was fast, so insanely fast that anyone but a trained ear like his could understand.

So he went on and told us many HTML websites aren’t properly accessible to blind people.

Take for instance those ugly HTML web sites that pile texts and news everywhere possible in the layout. Even at an alien-like voice speed, the screen reader seems to talk without cease. Better yet : the menus in Javascript. Let’s assume we have a complex menu with a hundred buttons nested in categories. They are hidden by javascript and show up only on rollover/click on a category in the main bar. On the other hand, the screen reader reads the HTML so it tells the whole hundred buttons’ label. Unbearable.

Then he went onto some Flash websites and although the screen reader had to wait for some animations to end, it enumerated the buttons and the content correctly. It is not an idyll though. HTML is still more supported by screen readers in general.

Conclusion

You can optimize your RIA for search engines with the solution discussed above. It increases accessibility as well because you expose HTML to the crawlers and people who don’t have the RIA plugin. Nevertheless, bear in mind that its primary objective is not to be a replacement of the RIA itself.

Update 1 on 24 June 2008 : If you want to test an example with code, Ahmet wrote a nice article about this concept, based on what he found in the Flex directory. There’s even a schema.

Update 2 on 6 July 2008 : The situation has evolved quite a bit, with Googlebot attempting to crawl dynamic data. You might want to read my article about that.

I took a look at the puremvc’s diagram and wondered if I had missed something essential in my learning of design patterns since I had never thought this far seen such an implementation of MVC. I got the big picture thanks to the documentation and samples on puremvc.org. I really appreciated the noteworthy efforts put in documentation. The best practices document is maybe one of the most useful documents that answered (some of) my many questions as everything was hazy in the beginning. Also, I have come across 10 tips for working with PureMVC which is very useful.

For a time, it was good. Problems appeared later on.

Abstraction

This framework motivates me because it helps (forces) thinking a level above in terms of abstraction. Notwithstanding this, it is still cloudy in my mind. I often have found myself wondering what to do. For example let’s say I have a section of a website, SectionMediator, that wants to populate its view with a list of buttons whose data is loaded into SectionRemotingProxy. Let’s suppose all the classes I talk about below are registered to the ApplicationFacade. My options :

1. Sending a Notification (without body) that the SectionMediator listens to, then retrieves the SectionRemotingProxy and gets the data it needs from the proxy by accessing it directly
2. Sending a Notification, whose body is an Array of ItemDataVO (variable object), that the SectionMediator listens to, then use the array of variable objects to populate its viewComponent
3. Sending a Notification that will trigger a Command which will retrieve both the SectionMediator and SectionRemotingProxy instances so as to get the data of the latter to transmit it to a method of the former. Basically, the command does the job of updating the SectionMediator’s viewComponent.
4. Mixing options 2 and 3 : send a Notification whose body is the VO that will trigger a Command that needs only to retrieve the SectionMediator and feed it the variable object from the Notification’s body.

Option 3 augments loose coupling but is that really the best choice ? I read that Commands should be used as much as possible and a Command should know the least possible the classes it’s using. So Option 4 might as well be my choice. But wait ! It’s actually a complication of Option 2…which in turn is a complication of Option 1. Am I back to the beginning ? It may be so.

I still don’t know what is my choice. I’ll experiment some more and see what happens.