Flash, Silverlight, Javascript are some of these tools allowing you to built a rich interface nowadays.
Let's look at some data driven Flash website implementations and see why their use of XML should rethink for a better SEO approch.
Flash and XML
For whatever reasons, you want cool clunky animations within your main left navigation bar.You have choosen to put this into a beautiful Flash applications that fulfills all your dreams.
Where is the trap ?
This animation use an XML file that allows you to update your links and all in all, it was a breathe to have this in place :
- good bye cross-browsers hacks - good bye sad navigation...
- good bye users!
As you may no it's very hard for search engines to index the contents of a flash animation.
If your contents is created on the fly and not hardcoded in the Flash animation, you cannot use the accessibility feature.
Even if you could, this will give you some raw data:
- good bye semantics,
- good bye google rank.
we don't even think of the people who does not have Flash (There are so few, it's not that big deal)
But you are loosing users and all the pages lost within Flash will ever hardly hits.
There is something really simple to do in that case:
Get a semantic XML File!
Why sometimes reinventing the wheel is not a good idea
Let's see an example of an xml file, it is I guess from a tutorial that you can find on the web:
<root>
<menu name="nav">
<menu name="TOP" view="horizontal">
<item name="Top1" action="gotoURL" variables="/top/index.html"/>
<item name="Top2" action="gotoURL" variables="/top/top2.html"/>
</menu>
<menu name="TUTORIALS" view="horizontal">
<menu name="Javascript" action="gotoURL" variables="/javascipt/index.html">
<item name="Beginners" action="gotoURL" variables="/javascript/b/index.html"/>
<item name="Seniors" action="gotoURL" variables="/javascript/s/index.html"/>
</menu>
<item name="PHP" action="gotoURL" variables="/php/index.html"/>
</menu>
</menu>
</root>
Alright, here is nice, well-formated XML!
What people says about XML ?
- it's portable
- it's easy
- it does cook late at night
These were the main arguments using XML with Flash and also the fact that the only you can manipulate data in Flash is thru an XML document.
That's true that this XML is very portable: you will be able to use it with THIS flash animation and nothing else.
It's true that it's easy, you just read the documents and figure out in 30 minutes how you should update this document.
There must be an even easier way...
XML : Somebody forgot the HT!
There's something even more portable, even easier than THIS XML file, it is called XHTML!
Alright, we are dealing with the Internet, links, websites, we are not interchanging data for something else than a browser!
If you look the XML document, you will see that it is just reinventing the XHTML:
- The navigation could be a list of ul and li!
- The action='goToUrl' is a link, a
- The variable is the href property of this link
- The name could be the title or the id, or the class
Let's change this XML into XHTML:
<div id="main_nav">
<ul class="nav">
<li>
<h2>TOP</h2>
<ul>
<li><a title="Top1" href="/top/index.html">Top1</a></li>
<li><a title="Top2" href="/top/top2.html">Top2</a><li>
</ul>
</li>
<li>
<h2>TUTORIALS</h2>
<ul>
<li><a title="Javascript" href="/javascipt/index.html">Javascript</a>
<ul>
<li><a title="Beginners" href="/javascript/b/index.html">Beginners</a></li>
<li><a title="Seniors" href="/javascript/s/index.html">Seniors</a></li>
</ul>
</li>
<li><a title="PHP" href="/php/index.html">PHP</a></li>
</ul>
</li>
</ul>
</div>
The good thing about this document is that it is both XML compliant and XHTML compliant.
Obviously we are missing the tag at the beginning and we do not have any doctype specified.
You should see this file as an include file (like when Flash is actually calling the xml file)
You could use it as an html document and as the xml for the Flash animation.
The good point are:
- The chance that somebody knows html is bigger than the chance of knowing mr Johns XML specification.
- You can have a semantic website browsable by the search engines!
- You can add css to it (no need of xml+xslt...)
iF you call this xhtml as an xml document in Flash, even with the xml tags off, Flash will read it as long as it is a well-forment xml!
Mixing the 2 worlds
How can you have both the Flash and the XHTML together in the same page?
First of all, you should load your flash animation thru swfObject, that is thru Javascript.
If javascript is off or Flash is not going to be installed then the XHTML will be displayed.
If flash is installed, users will see the flash version while search engines will get the XHTML version!
From there, you can add the xhtml by using a noscript tag or by changing the display:block to none thru javascript/
If the users has javascript on, the content will be hidden, it javascript is off, the xhtml will be displayed normally.
Conclusion
I have seen some websites and companies saying that THEY HAVE THE TOOL TO MAKE FLASH SE FRIENDLY.
Well, all their tools is crap...
I took the example of a menu but this is likely to be true for many different texts that you will have in a Flash animation.
ALWAYS TRY TO CREATE AN XHTML STRUCTURE FIRST!
And your website should be a search-engine friendly website.
But before using Flash, try to see if a Javascript solution could be better.
In this entry, I didn't talk about the XML that were setting some styles to the Flash!
Here it is the same thing!
Don't reinvent CSS...
Obviously, this might be harder to deal with css thru Flash as it has a very poor implementation of it(less than javascript)
I was thinking about a CSS parser in PHP or Perl that will change it into a javActionScript object.
Then, actionscript could just get the element they are interested in...
But perhaps there is already such a parser?
No comments:
Post a Comment