Download the agency overview...
View our Agency Overview
Agency Overview

Expert Resources

4 SEO Solutions For Flash

4 Solutions to SEO problems of using Flash

Many of us has seen a website with Adobe® Flash®. It has attracted many website surfers every since flash-icon-785327Macromedia came out first with Shockwave® and then create a more lightweight version for the web, Flash. It’s main strength is the animation capabilities along with a strong scripting language that seems no one else on the market has matched . With the lack of competition and a superb product, it is supported by almost every browser and operating system with many third-party add-on tools made by several companies. It’s no surprise to see many sites using Flash these days.

But the problem is, Flash, just like images and videos, these are not made in a plain text language embedded within the HTML code using tags. A browser plug-in is used here that needs to be installed at least once in order for the web browsers to display Flash websites properly. With current day bandwidth standards this just takes a few minutes or even seconds.

Flash is in a binary file format, not in plain text which makes it more difficult to consistently or not possible at all for some search engines to extract the content found within a Flash file.

Do SEO professionals hate Flash?

Depends on who you are asking, I have heard many people in the SEO industry that just hate Flash period! Just because they claim these sites cannot be search engine optimized. The feeling can be mutual from some of the web design and development community that loves Flash and AJAX and just hates SEO (watch related funny videos).

Flash and AJAX are two technologies that enhance the user experience on a website and these technologies are going to stay here for a long time. Thus should be embraced by the SEO community and learn all the workarounds on how to implement a successful SEO campaign running AJAX or Flash. If your SEO analyst simply tells you do not use Flash, they just might not really know what to do with it.

SEO Solutions in using Flash

Below I will mention 4 solutions on how to optimize your website well even if they are running Adobe Flash. Since Flash cannot be interpreted perfectly and consistently by search engines, you run into 2 main problems. First is [1] the important text content rendered in Flash cannot be read well by the search engines and second is [2] navigational elements within Flash cannot be crawled by search engine spiders. Having this in mind, here are four tips on how to implement SEO successfully on a Flash website.

  1. The Non-Flash Site Version for Sites Completely Made in Flash
    Content: If your website is made all in Flash and has no other HTML elements except the code that embeds the Flash file(s), making another website with the exact look and feel (for branding purposes) but does not have all the bells and whistles of Flash will make the content readable by search engine. Since this is like totally having a separate website, you would really expect the non-Flash website generating the search engine traffic, which will then funnel visitors through the navigation leading them into the Flash website.
    Navigation: Since there is a separate website with different pages targeted for different keywords, search engine crawlers will have the opportunity to see the links and follow them in the non-Flash plain HTML website and getting all pages included in the search engine index. With the nature of Flash, similar to AJAX, where each page view may not necessarily load a new HTML page with a new URL, it would still be best to create a unique URL for each “Flash view” that will be the entry point page from the non-flash pages. And once they arrive at the page, it can load the same Flash file and no need to reload a new page.

non-flash-version-779788

  1. In the image above, users aware of the website already will normally enter the page through the flash version of the website. And once on the homepage, the URL will no longer change although the “Flash Views” that serve like pages in the perspective of the user will change.

    On the other side of the story, Search engines will crawl the plain HTML version of the site. Which can generate traffic going to the HTML pages once these pages are ranking with proper SEO practices. And each page will have the option for the user to see the flash version that lies on it’s own unique URL and loading the same Flash file but going straight to the appropriate Flash view.

    Advantage: You can design your Flash as intricate you want. No limitations since the SEO’d pages are on the non-Flash website.
    Disadvantage: You need to spend more time and resources making the website. Having a Flash and non-Flash website is having two websites to maintain. More time, more resources, more money spent.
    Quick Tip: Flash can input data from XML documents relatively easy. Server-side scripting languages such as PHP, JSP, ASP, etc. can also import data from XML documents. Creating a unified CMS should make life easier in the long run, but may take more time to set up.

  2. Alternative Content and Navigation
    Content: On the same page where Flash is displayed, somewhere else on your screen real estate some equivalent content of what was found within the flash file is also presented outside of Flash as plain text within the HTML code.
    Navigation If a navigational element was made in Flash, similar to the content, adding another alternative navigation on the site will help get all other pages crawled and index in the search engines. A common implementation of this is having footer text links at the bottom of every page.
    Advantage: Unlike the technique above, you do not need to make another website. Just make sure whatever text content you have on your flash file. Have it available elsewhere on the page outside of Flash.
    Disadvantage: Cannot be done on a full Flash website, but generally any website implementing SEO should not have a full Flash website.
    Quick Tip: Flash should be used best here for areas where you want to attract attention. Perfect for your unique selling statement, current product or service promotions. Whatever content was found here should also found elsewhere in a plain text format for the search engines to read. The animation is mainly used to draw the attention (not to annoy) of a user to read and pay attention to the Flash and hopefully draw in the user to read and explore further.
  3. sIFR for Flash Designed Text
    Content: Text font designs used on websites are declared either in the non-standard HTML font > tagsifr2-736383 or in the declared font styles using CSS. Either way, these layout commands are telling the web browser to load the font file available on the viewer’s local computer. In the absence of these font files, the browser will load it’s default browser fonts that is often Times New Roman. This limited web designers to use commonly installed fonts such as Arial, Helvetica, Verdana, Geneva, Courier, Times New Roman, and other common fonts decreasing the creative freedom of many web designers. So in order to design beautiful typefaces, you can either use an image or Flash but search engines had trouble reading these. Scalable Inman Flash Replacement or simply sIFR (many pronounce this is as sifer) is an effective use of Flash text replacement. This is similar to how CSS image text replacement is done, just done in Flash. What makes this even better than CSS image text replacement is sIFR can be used more effectively in CMS applications since both can be easily generated dynamically. Although an image with text written on the image can be done dynamically also with tools such as PHP’s GD library, it is not as easy nor resource friendly as sIFR.
  1. Navigation: The text on any anchor link is important in SEO for this is what gives meaning to what the destination page is all about. The important keywords within the <a> tags are your targeted keywords. But if the link is applied on a image or a Flash file, you have to make sure the targeted keywords are still read by search engines. In images you use the alt attributes. Since sIFR is used to ‘stylize‘ text and not for any other animated effect, sIFR is idea to add beautiful looking text links not sacrificing the crawlability of the links.
    Advantage: Ability to create styled text font faces that are completely viewable as plain text in the “eyes” of the search engines. sIFR is very lightweight and scalable. Relatively easy to implement and Google has expressed their acceptance of this method. sIFR also downgrades gracefully if Flash is disabled or not installed on a web browser.
    Trivia: Inman is the last name of Shaun Inman that first to experiment with Javascript code used in sIFR. This was then modified and improved by Mike Davidson and Mark Wubben so that is can be used to replace HTML text elements.
  2. Use SWFObject
    Content: Probably something you have heard quite often if you have been keeping up-to-date with the latest SEO techniques and those who were not able to fully catch up may think this technology is so confusing. To explain this further, let’s explain how Flash is added to a webpage. Normally, Flash will have HTML <object> and <embed> tags. Within these tags is the source of the Flash file with the .swf file name extension along with several parameters how this .swf file is displayed such as the height, width and more. The SWFObject is a Javascript function that detects if Flash is available. As mentioned on Geoff Stearns website:

    SWFObject is a small Javascript file used for embedding Adobe Flash content. The script can detect the Flash plug-in in all major web browsers (on Mac and PC) and is designed to make embedding Flash movies as easy as possible. It is also very search engine friendly, degrades gracefully, can be used in valid HTML and XHTML 1.0 documents*, and is forward compatible, so it should work for years to come.

    Since this is mainly a Flash detection script and it replaces HTML blocks such as a typical <div> tag, plain text HTML content can be placed within the div tag. And only if Flash is enabled will it display the Flash over the <div> tag. A simple code implementation would look like this:

    In the section, the SWFObject is called.

    <script type=”text/javascript” src=”swfobject.js”></script>

    Also in the <head> or optionally in the <bodyyou have the SWFObject call stating the .swf file to load.

    <script type=”text/javascript”>
    var so = new SWFObject(“flashfile.swf”, “flashheader”, “400″, “200″, “8″, “#ffffff”);
    so.write(“flashcontent”);
    </script>

    This will then look for the element with the ID flashcontent and replace it with the .swf file flashfile.swf. And anywhere within the webpage’s content, you can have:

    <div id=”flashcontent”>
    Text here, placed within these tags are search engine friendly. And can be read by search engines.
    </div>

    This script mainly checks the browser’s Flash capability, since search engine spiders are not Flash enabled, thus Flash does not run. Aside from that, JavaScript is used to invoke Flash and search engines are not JavaScript enabled either. But since the content of the Flash file is displayed as plain text beneath the Flash in a <div> tag, search engines are able to read the content you gave of that Flash file.
    Navigation: In the same way how the content is replaced with Flash, navigational elements work exactly the same way. Having plain text HTML links within the Flash-replaced <div> tag.
    Advantage: Can work with full Flash sites and websites that have only portions of it in Flash. Full Flash sites can degrade normally into non-Flash sites without having the need for a visitor to choose which site version to view. Flash page URLs and non-Flash page URLs are unified into a single URL.
    Disadvantage: Very easy to implement shady to dark blackhat techniques with keyword stuffing behind the flash that can get you banned in the search engine. Although this is easily avoidable by simply not putting any content on the plain text HTML code that is not visible on the Flash file. As long as you keep it clean, you are safe. In Goggle’s Adam Lasnik’s own words in an interview by Eric Enge, he states:

    I haven’t happened to catch any of the SWFObject based flash sites, so, I can’t give a definite answer on that one, but the key thing here is that if the text that is essentially gracefully rendered outside of the flash for those who don’t have it, is identical to what folks that do have flash capabilities in their browser are seeing, then generally there is not going to be a problem.

    Trivia: SWFObject used to be called FlashObject. The name was changed due to legal/trademark reasons.

Do I block my Flash files?

Google has been showing their advancements in reading .swf files. Google can actually go into a .swf file and extract the text it can find within this file. Although it may not be a wise decision to let Google index your Flash files.

indexed-swf-772730

Above is a sample .swf file indexed by Google on a popular website. The title is totally meaning less and so is the description. And if ever someone does visit this Flash file, it won’t lead the visitor to the rest of the site. Google is indeed doing good in reading Flash files but in my opinion it is still not the right time to let Google index your Flash files as you cannot optimize them as well as you can with HTML pages. If visitors check the Flash file, you have a smaller chance into making them visit the rest of the site. And so far I believe it is only Google that has this capability and it is nice to still be search engine friendly to all major search engines. To solve this issue, you can simply place all .swf files in one folder and block them off in robots.txt.

Disallow: /swf/

In a nutshell, Flash is ideal for certain areas where you want to attract attention. Possibly highlighting some promo or doing a call to action. Blinking and jerky movements have been proven not effective and is more annoying. With Flash elements on a page, make sure you have alternative content and navigation for search engines to read.

  • If you have a full Flash website, you can either has a complete non-Flash version or degrade gracefully using SWFObject./li>
  • If you are just using Flash for small banner type purposes, you can simply serve alternative plain text content and navigation elsewhere on the page, or use SWFObject.
  • For style font headings, with total font design freedom, sIFR would be the best way to do it.

If you are unsure how to implement all of these, leave a comment and ask us questions to clarify your thoughts.

Adobe®, Flash® and Shockwave® are tradenames of Adobe Corporation.