Flash & SEO, A Home Run for Barefoot, Part 1
Dr. B. | Monday, May 08, 2006
Barefoot recently completed Flash site for Pitch In For Baseball, a non-profit organization dedicated to providing baseball equipment to communities around the world who couldn't afford to purchase it otherwise.
We created a site that targeted Flash 8 so we could take advantage of great new features like high quality font rendering and improved transition effects. The client also wanted the ability to update content about current news, projects, and donor recognition. So, we stored all of the content in a MySQL database using a custom J2EE based content manager deployed on Apache Tomcat.
One of the typical drawbacks developers face when creating an all-Flash site is the issue of Search Engine Optimization, or SEO. Most search engines just ignore .swf files altogether. While Google does index .swf files, the results are very poor because they don't link into a specific navigation point with an all-Flash site.
For example, a Flash site may have a FAQ page with the word "FAQ" on it. Within the Flash, the user clicks the FAQ button and is able to see the FAQ content. However, if a user finds the FAQ content in a search engine that indexed the .swf itself, the link from the search engine to the site will likely take the user to the home page, or directly to the .swf file outside of its HTML container. Either way, the user doesn't see the FAQ content from the search engine, even if that content can be found.
Most solutions to this problem involve creating a completely separate HTML site. The HTML is indexed by search engines, and the content can be found. However, this typically requires developers or clients to maintain completely separate content bases, and prevents users who find the content via search engines from seeing the content in its Flash-enabled glory.
For Pitch In For Baseball, we used a very innovative combination of technology strategies to support search engine links that when clicked, tell the Flash application to go to the page found by the searcher. I'll detail the high-level strategy here, and write upcoming articles to show the details of each phase.
The major components of the strategy are:
More details to come!
by Doug Smith, Senior Developer, Barefoot
We created a site that targeted Flash 8 so we could take advantage of great new features like high quality font rendering and improved transition effects. The client also wanted the ability to update content about current news, projects, and donor recognition. So, we stored all of the content in a MySQL database using a custom J2EE based content manager deployed on Apache Tomcat.
One of the typical drawbacks developers face when creating an all-Flash site is the issue of Search Engine Optimization, or SEO. Most search engines just ignore .swf files altogether. While Google does index .swf files, the results are very poor because they don't link into a specific navigation point with an all-Flash site.
For example, a Flash site may have a FAQ page with the word "FAQ" on it. Within the Flash, the user clicks the FAQ button and is able to see the FAQ content. However, if a user finds the FAQ content in a search engine that indexed the .swf itself, the link from the search engine to the site will likely take the user to the home page, or directly to the .swf file outside of its HTML container. Either way, the user doesn't see the FAQ content from the search engine, even if that content can be found.
Most solutions to this problem involve creating a completely separate HTML site. The HTML is indexed by search engines, and the content can be found. However, this typically requires developers or clients to maintain completely separate content bases, and prevents users who find the content via search engines from seeing the content in its Flash-enabled glory.
For Pitch In For Baseball, we used a very innovative combination of technology strategies to support search engine links that when clicked, tell the Flash application to go to the page found by the searcher. I'll detail the high-level strategy here, and write upcoming articles to show the details of each phase.
The major components of the strategy are:
- Store the content in a database. This provides one place for everyone to update the content, while allowing developers to render that content in multiple ways.
- Read the content dynamically into a Flash HTML field.
- Code the Flash app so that it can read URLs in order to open sub-content areas. Here are a couple example links:
http://www.pitchinforbaseball.org/pifbweb/ui/our_dugout/game_plan/
http://www.pitchinforbaseball.org/pifbweb/ui/where_we_help/faq/ - Use SWFObject to embed the Flash app on the page.
- Populate the SWFObject <div> block with the same dynamic content that is read into each Flash page. If the user doesn't have Flash 6 or higher, or doesn't have Javascript turned on, they will see this content. Since search engines fall into this category, they index this content. Try out the links in the previous point with JavaScript turned off, and you'll see the flat content.
- Dynamically change the links within the content so that they navigate correctly whether inside the Flash, or on Flash HTML.
More details to come!
by Doug Smith, Senior Developer, Barefoot
2 comments
Hmm. Maybe it worked when you posted this, but it sure isn't working now, 15 months later. It also looks like you revised your entire strategy, because now the site has a mirror html version, which is what google finds. :(
Thanks though.
You're right, yes. As sometimes can happen, when the client took over maintenance of the site they decided to add an HTML mirror because a few important (noisy) users didn't have Flash 8 at the time. We still like and use this strategy, but don't always get to call all the shots. :-)
Post a Comment
« Home