- The “Back” button does not work.
- In general, Flash integrates poorly with search.
BLITZ has already addressed the first issue in our Flash Framework. The Framework implements an elegant and user-friendly solution that not only fixes the browser back button navigation issue, but also adds additional accessibility and usability functionality by adding support for:
- updating the browsers title bar with each unique page view
- deep-linking into sub-pages of a Flash website
- user bookmarking of sub-pages within a Flash website
- pretty URLs for all pages within a Flash website
With all of those problems solved, I decided to tackle the problem of how to optimize a Flash website for search engines. Since we are dealing with high end websites with large marketing budgets behind them, the end result had to be white hat compliant SEO. We couldn’t afford to get our clients websites blacklisted by the search engines. With search accounting for upwards of 40% of a websites total traffic volume (depending on the type of site) we needed to come up with a solution to offer to our clients that would give them more bang for their buck. The end result of our Flash SEO efforts looks a little something like this:
This application looks pretty simple on the surface, but the real power behind the tool lies underneath the covers.
The first thing we do with this app is load up a projects config.xml file. Our config.xml file is like mission control for a website and contains all the relevant data about a particular website. The application parses the configuration XML document and returns a list of all the page nodes for the site. Each page node in the XML file represents a page in the Flash site. Each page also contains (among other things) a title attribute, name attribute and a reference to a copydeck.xml file. The copydeck.xml files contain all the text that displays on each corresponding page of the site. Armed with all of this textual data, we can now generate all the necessary files to optimize our Flash site for search engines. Once you click the Optimize Website button, the tool will spit out search engine optimized pages for each of the page nodes it discovered in the configuration file. The files it generates include:
- One HTML page per page node
- Each HTML page will include site-navigation links to all other pages on the site
- A sitemap.xml file so search engine spiders can easily discover all of the pages in a site
- Each static HTML will by default deep-link to the corresponding page node
- The HTML files all support back/forward navigation, plus pretty URLs, page title updates, etc. as outlined above
- Each HTML page uses semantic HTML markup to optimize the page for search engine indexing
- Each page also includes Flash version detection to deliver the best version of the website that the users browser supports
- All HTML pages are fully compatible with any hand-held or mobile device, even if they don’t have Flash Light installed
- All pages fully support any web-metrics scripts for visitor stats tracking
And what would a website tool be if we didn’t eat our own dog food? Check out the end results on a few pages on the BLITZ website:
Be sure to view the pages HTML source, and compare the source text in the HTML document with the text in the Flash version of the site. It’s the same! And the HTML version is fully navigable, fully readable, and fully searchable – not to mention that the markup used is semantically correct for the type of content.
And for proof on just how effective our search engine optimization for Flash websites really is, check out the top natural search results for those same three pages on the top 3 search engines: Google, Yahoo, and Microsoft’s Live Search!
So even though Mr. Nielsen had some some valid points, that doesn’t mean we should just throw in the towel and give up on a technology because it’s not ‘perfect’. That’s where we the development community come into play, developing solutions to perfect the imperfect.