Quick and dirty Flash SEO with PHP and the Apache module mod_rewrite

Although Flash may be the disdain of some, there are instances where it can be used to help communicate the right message to users. Unfortunately, getting Google to index your Flash files is a gamble, and achieving good SEO is difficult. Instead, it is better to architect a solution that does not rely on Flash, but on PHP and Apache’s mod_rewrite capabilities.

If you do not know already, the Apache module mod_rewrite is the most widely utilized method for achieving SEO friendly URLs. Once a difficult blend of regular expressions, the module is now used commonly in conjunction with PHP to ease the pain of development. Remember, this really is a quick and dirty solution that assumes you are using Flash primarily as a show piece. I would recommend a different solution if your Flash was purely data driven through a CMS.

In order for this solution to work properly, the Apache HTTP Server must have the mod_rewrite module enabled, and you must be able to edit an .htaccess file that resides in your server root. This example was tested in PHP 5, but should work with PHP 4 as well. Some FTP clients hide .htaccess files from view, so you may need to adjust the program settings in order to ensure you are not overwriting a file that already exists.

Open up a text editor, paste in the code below, and save the file as .htaccess with no trailing extension. I will not go into detail about mod_rewrite, other than to explain the following code. Whole books have been written on the subject, and there is too much meat to cover in a single tutorial. Just know that Apache reads .htaccess files and processes them in accordance with the directives or conditions that you specify.

.htaccess:

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?uri=$1 [L,QSA]

The first directive turns the mod_rewrite engine on, and only one of these commands is required per .htaccess file. You can have multiples, but it is not recommended, and at least one must appear before any rewrite conditions.

The following two lines are known as sever variables, and are considered “specials” in mod_rewrite. They inform Apache that if a request is made for a real file or a real directory, then process those files and directories without rewriting them according to the new rules that you will be specifying. This is helpful if you have files and directories that belong to other applications that still need to operate without interference.

The final line is a regular expression rule that informs Apache that all requests for virtual files and folders should be re-directed, or re-written to an index.php in the root. The query string parameter uri contains the value of the file or folder that was originally requested. For instance, if a user made a request for http://www.someurl.com/some/folder/path, behind the scenes Apache would actually request http://www.someurl.com/index.php?uri=some/folder/path.

The uppercase letters in brackets are rewrite rule flags. The first flag tells Apache if this rewrite rule and all of its conditions are met, then this should be the last rule processed in the .htaccess file. The second flag forces the rewriting engine to append a query string part in the substitution string to the existing one instead of replacing it.

Now create an index.php if you have not already, and place it in the root of your Web site. This file is known as a handler, and it will handle all incoming requests for virtual directories on your Web site. These virtual directories should map to the structure of your Flash file. For example, if this was your corporate Web site, and the Flash contained links for Data Analysis, Information Architecture, Web Design, About and Contact, then you will need to handle the following URLs:

• http://www.someurl.com/services/data-analysis
• http://www.someurl.com/services/information-architecture
• http://www.someurl.com/services/web-design
• http://www.someurl.com/about
• http://www.someurl.com/contact

The general idea is that these pages need to exist, because each contains unique content, title tags and meta information that coincides with the Flash. Remember, this approach assumes this content does not already exist in a database, and is static. This also assumes you are embedding your Flash file using a JavaScript library like SWFObject. Your users will see the Flash that replaced your content, while search engines (which do not follow JavaScript) see static content. The index.php file should contain the code below.

PHP:

<?php

	define( "ABSPATH", dirname(__FILE__) . "/" );
	
	$hash_db = array(
		"home" => array(
			"File" => ABSPATH . "home.php",
			"Page Title" => "My Corporate Site",
			"Meta Description" => "My Corporate Site meta description for homepage."
		),
		"services/data-analysis" => array(
			"File" => ABSPATH . "services/data-analysis.php",
			"Page Title" => "My Corporate Site : Services : Data Analysis",
			"Meta Description" => "My Corporate Site meta description for data analysis page."
		),
		"services/information-architecture" => array(
			"File" => ABSPATH . "services/information-architecture.php",
			"Page Title" => "My Corporate Site : Services : Information Architecture",
			"Meta Description" => "My Corporate Site meta description for information architecture page."
		),
		"services/web-design" => array(
			"File" => ABSPATH . "services/web-design.php",
			"Page Title" => "My Corporate Site : Services : Web Design",
			"Meta Description" => "My Corporate Site meta description for web design page."
		),
		"contact" => array(
			"File" => ABSPATH . "contact.php",
			"Page Title" => "My Corporate Site : Contact",
			"Meta Description" => "My Corporate Site meta description for contact page."
		),
		"about" => array(
			"File" => ABSPATH . "about.php",
			"Page Title" => "My Corporate Site : About",
			"Meta Description" => "My Corporate Site meta description for about page."
		),
		"404" => array(
			"File" => ABSPATH . "404.php",
			"Page Title" => "My Corporate Site : 404",
			"Meta Description" => "My Corporate Site meta description for 404 page."
		)
	);
	
	$uri = ( isset( $_GET[ "uri" ] ) ) ? rtrim( $_GET[ "uri" ], "/" ) : "home";
	
	if ( array_key_exists( $uri, $hash_db ) ) {
	
		$page_title = $hash_db[ $uri ][ "Page Title" ];
		$meta_description = $hash_db[ $uri ][ "Meta Description" ];
		require( $hash_db[ $uri ][ "File" ] );
	
	} else {
	
		$page_title = $hash_db[ "404" ][ "Page Title" ];
		$meta_description = $hash_db[ "404" ][ "Meta Description" ];
		require( $hash_db[ "404" ][ "File" ] );
	
	}

?>

I will not review the code line-by-line, but I will point out a few important details. The first is that your handler contains a reference to the URL that was requested through the uri query string parameter. This is used as a key to identify what page content should really be served up to the user. Each page also has a page title and meta description. The physical pages themselves will contain the proper navigation and static content, which links all your pages together. Google will index your pages using these links.

The following code is an example of what the home page might look like, should a user type in the primary domain, but no directory. The header include should contain references to $page_title and $meta_description, so that each page is uniquely identified. It should also contain the JavaScript that replaces your content div with your Flash file.

PHP:

<?php require( ABSPATH . "includes/header.php" ); ?>

<div id="content">
	<h1>My Corporate Site</h1>
	<p>My Corporate Site content for the homepage that will be indexed by search engines.</p>
	<ul>
		<li><a href="/">Home</a></li>
		<li><a href="/services/data-analysis">Data Analysis</a></li>
		<li><a href="/services/information-architecture">Information Architecture</a></li>
		<li><a href="/services/web-design">Web Design</a></li>
		<li><a href="/about">About</a></li>
		<li><a href="/contact">Contact</a></li>
	</ul>
</div>

<?php require( ABSPATH . "includes/footer.php" ); ?>

I would do user experience a disservice if I did not mention that although this is SEO friendly, it still does not accomplish a high level of usability. When referred from a search engine to a nested directory, like Web Design in our example, you should pull in the content from Flash that identifies with the URL. Users will be confused by seeing Web Design in the URL, while being presented with the homepage introduction.

• Posted by Brian
• June 22nd, 2008