I spent some time over the festive season working on some SEO enhancements to the Chakra Jewellery Design website. The first version of the site features heavy use of Adobe Flash, effectively make it a single page website with no actual content, as everything was hidden inside a Flash movie. Whilst this makes for an excellent aesthetic and brand manifestation, there are dire consequences for findability: search engines think there is nothing on the site. (Another issue was that of maintenance, with Flash requiring more time, specialist skills and resources than plain old HTML pages.)
Several options exist for improving the situation, including AdWords and other SEM tactics, but this is potentially costly and to be honest an “easier” and more logical solution exists. So our goal was to try and improve the natural search engine ranking for the site, but exposing the good content that already exists and some other tinkering.
What we did
The improvements fall into three basic categories:
- Extracting content out of Flash
- Improving relevance of ‘microcontent’
- Adding supplementary content
(It’s worth pointing out at this stage that, yes, there are design and usability issues with the site, but one step at a time!)

The obvious first step was to get the existing content out of Flash and into standard HTML mark-up. This was relatively straightforward. The Flash movie was actually made up of separate sub movies for each section of the site, loaded into a framework as needed, so it was trivial to create a physical page for each section and plonk the sub-movie on to it. The copy and images were then extracted from each Flash movie and marked-up using standards compliant XHTML and CSS. Care was taken to tailor the mark-up for maximum SEO effect, including semantically correct use of tags and careful selection of ‘microcontent’ such as title tags, heading tags, alt attributes, image filenames and even CSS class and ID names.

To maintain the look and feel of the original website, all of this mark-up is hidden ‘underneath’ the Flash movie using SWFobject. In terms of the HTML, all the content is there, but using CSS and Javascript this is hidden on page load and replaced with the appropriate Flash movie. If browsers don’t have Flash and Javscript capabilities, the underlying HTML is served instead of the Flash. But most importantly, Google and other search engines will see the HTML and lap it up. The graphic above shows the Flash version of the home page (on the left) and the equivalent HTML version (on the right).
Quite a bit of research was undertaken to ensure this technique was SEO friendly, and whilst nothing is certain on the web, I’m fairly sure this is an appropriate method to use. The main opposition to the use of the SWFobject technique seems to be when it’s used to deceive search engines (and/or users) by spamming the page with certain content in the HTML, then showing something else in Flash. In this case the content in the HTML is functionally equivalent to that found in the Flash. There are some variations, but in essence what users see is what Google sees.
Each of these new pages was put into a sub-folder on the site which was given a name that supported our SEO objectives (eg custom jewellery, chakra stones, jewellery collection). In doing so, some tweaks were needed to the flash movies so they picked up variables from the right spot, but for the most part the Flash movies stayed as they were. As such the look and feel for most users will be the same as the old site, minus some niceties such as fade-in/fade-out transitions between sections of the site.

In terms of the additions to the site, the most obvious is the ‘super footer’ at the bottom of each page. This gives an overview of the site (and the business) on every page, a list of contact details as well as links to legal disclaimer and some credits for those responsible for the site. These not only improve SEO, but also provide users with vital information. Since we now have multiple pages on the site, a search engine may bring a visitor in to something other than the home page. In that case they can easily find out what the site is about, who runs it and where they are located. This last aspect is essential for online retail, it builds credibility and gives a human aspect to the site.
Further adding a human aspect to the site is the addition of some biographical information about the owner of the business on the About us page.
Other additions include:

Lessons learned
I wouldn’t call myself an SEO expert, but I know enough to know the site was in a poor state, and that these enhancements will have a positive impact on driving traffic to the site. It has been interesting putting SEO theory and guidelines into practice, especially when balancing this against UX principles. A key lesson learned is that it is a compromise and a bit of black magic; it’s hard to tell exactly what effect any change will have and thus SEO needs to be a continuous effort rather than a ‘set and forget’ affair. I’ll need to keep an eye on things and keep tweaking the site to find the best results.
On another note, I felt the pain of trying to maintain specific typographic standards on the web. The font used in the Flash movies is “Praxis”, not a font that most people would have on their computer. So for the HTML content (and the main navigation which is HTML sitting ‘on top of’ the Flash) I used CSS to specify that Praxis should be used if available, but then assigned a number of ‘similar’ fonts that are widespread across Windows and Mac computers, to be used when Praxis isn’t available. This maintains the intended look of the site under most circumstances.
(For the record, I’m not a big fan of this approach to web design—trying to enforce a pixel perfect design—but rather I prefer to design for the restrictions imposed by the current technology instead of trying to avoid them. Fonts and layout are the big issues in this regard, because offline designers try to implement designs that aren’t easily implemented online. Doing so requires copious amounts of time to be spent on what ultimately should not be a high priority. And that doesn’t mean the site needs to look bad, there are plenty of great looking websites that are also usable, findable, accessible and practical to build.)
Measuring results
In terms of establishing a baseline for measuring the improvements, the Google ranking for several search phrases were recorded for the old, Flash, version of the website (see table below). I will compare the rankings for these phrases in a few months time and hopefully see a big improvement. At the time of writing this post, Google is still caching the old site and who knows how long it will be before it gets re-indexed, but in the mean time I’ve setup 301 redirects from the old SWF files to the corresponding new pages.
| Keyword(s) |
Google .com |
Google .com.au |
Yahoo .com.au |
Windows Live |
| chakra |
- |
- |
62 |
- |
| jewellery |
- |
- |
- |
- |
| www.chakra.net.au |
1 |
1 |
1 |
- |
| chakra.net.au |
1 |
1 |
1 |
- |
| jewellry |
- |
- |
- |
- |
| chakra jewellry design |
- |
- |
- |
- |
| charkra jewellery |
- |
- |
- |
- |
| chakra jewellery |
129 |
1 |
1 |
- |
| chakra stone |
- |
- |
4 |
- |
| stones |
- |
- |
- |
- |
| crystals |
- |
- |
- |
- |
| necklace |
- |
- |
- |
- |
| chakra necklace |
- |
- |
- |
- |
| custom jewllery |
- |
- |
- |
- |
| meditation artwork |
- |
- |
- |
- |
| chakra artwork |
- |
- |
- |
- |
| katie manekshaw |
- |
- |
- |
- |
| bondi art |
- |
- |
- |
- |
| chakra bondi |
- |
- |
- |
- |
| bondi jewellery |
- |
- |
- |
- |
| chakra australia |
- |
- |
- |
- |
| chakra sydney |
- |
- |
- |
- |
| chakra crystals |
- |
- |
- |
- |
| jewelry |
- |
- |
- |
- |
| chakra jewelry |
- |
- |
- |
- |
Additionally, the Pagerank for the site is 3/10. I’m not sure if my SEO enhancements will do much to improve that, as Pagerank really relies on having good links to your site, but an improvement here may be a welcome side affect of the work we have done.
According to Google Analytics, the keywords leading visitors to the website (recorded at the same time as the above rankings) are as follows:
| Keywords |
Leads |
| chakra jewellery |
28 |
| www.chakra.net.au |
9 |
| chakra.net.au |
4 |
| chakra |
2 |
| chakra jewellery design |
2 |
| chakra jewellry |
2 |
| chakra jewellry design |
2 |
| chakra net |
2 |
| charkra jewellery |
2 |
| “chakra jewellery” |
1 |
Next steps
It will be interesting to see how this changes with the SEO improvements.
Ultimately the site will probably be rebuilt using Flash in a tactical manner (eg animated elements in a page that add interest and novelty factor) rather than as the main technology. Doing this will allow SEO and further extensions to the site that are currently restricted by the use of Flash.
Going hand-in-hand with this should be improvements to design and usability of the site, as well as SEO enhancements to the content itself (ie re-writing) to better target the desired keyword phrases. Investing in more incoming links from related websites would also be on my list of improvements.