SEO
From Gaia Framework Wiki
Contents |
SEO Scaffolding
The Search Engine Optimization Scaffolding engine in Gaia creates an XHTML file for every page you specify in the site.xml, as well as a sitemap.xml file that follows sitemaps.org protocols.
The purpose of SEO Scaffolding is to provide search engines and non-Flash users with easy access to the content on your site, as well a convenient single data source for the copy on your site, organized by page.
This technique is white hat compliant, and is discussed on the Gaia forums.
How To Use Gaia's SEO Scaffolding
The easiest way to turn on Gaia's SEO Scaffolding is to set seo="true" on each page node in the site.xml you want to have an XHTML page generated for. By setting seo="true", it will use the page's id for the name of the XHTML page.
<page id="home" title="Home" src="home.swf" seo="true" />
An XHTML file with the name home.html will be generated for this Gaia page.
Page nodes with an seo attribute value must have a title attribute, as well. If you do not set a title attribute, it will not generate an XHTML file for the page.
You can also set seo to a custom value if you want a different file name. This is useful if you have multiple pages with the same id in different branches and you want each of them to have an SEO scaffolded page. This can also be used if you want to use a different extension such as .htm, or .php.
<page id="about" title="About us" src="about.swf" seo="about_us.php" />
An XHTML file with the name about_us.php will be generated for this Gaia page.
When using this feature, an SEOAsset for the page will be automatically created at runtime and put into the first position in the asset array.
Alternate Content Div
Gaia Generates a div containing alternate content for when Flash is not available. SWFObject automatically overwrites this div with the FlashContent.
Here is an example of what the alternateContent div looks like
<div id="alternateContent">
<h1>Site Title</h1>
<h2>Page Title</h2>
<ul id="sitenav">
<li><a href="index.html">Index</a></li>
<li><a href="home.html">Home</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
</ul>
<div id="copy">
<p id="sample">Sample</p>
<p id="hello">Hello world</p>
<p id="foo">This is some example text</p>
</div>
</div>
From the site.xml, the following tags are populated:
- An h1 tag with the site title
- An h2 tag with each page title
- A list menu with HTML links that connect to the other SEO pages
- A div with an id of "copy" contains p tags. These p tags each have a unique id. The contents of these p tags are available to the page via the page property copy.
Automatic branch FlashVar
For each SEO Scaffolded XHTML page, Gaia injects a branch FlashVar to direct the Gaia site to go to the specific branch associated with the XHTML page.
SWFObject 2
var flashvars = {
branch: "index/nav/about"
};
SWFObject 1.5
so.addVariable("branch", "index/nav/about");
Copy Page Property
The copy property of each SEO enabled page in Gaia contains name-value pairs that match the id-value pairs in the p tags inside the copy div in the XHTML.
trace(copy.hello); -- Hello world
copy.innerHTML
copy has a property called innerHTML which allows you to put complex HTML inside of your copy div and get the whole thing as one string.
Gaia SEO Panel
To enable Gaia SEO Scaffolding, simply check the box under the Scaffold panel options and input the domain to be used in the site.xml file. This needs to be the root domain of your website, and must have a trailing slash.
SEO scaffolding will only update what is currently in the h1, h2, and menu list. It will not overwrite any of your custom p tag content.
SEO Byte Accurate Preloading
When you are using SEO for your site and you use the Project Panel to calculate the bytes in your site.xml, Gaia automatically includes the seoBytes property for the XHTML file size.
SEO Resizing
When you use the Project Panel to resize your project, Gaia will modify all the XHTML SEO pages to reflect the new dimensions, including 100% and centering.
FlashVar branch
You can force Gaia to load a specific branch when it first launches by adding a FlashVar called "branch" with the full branch you want Gaia to load.
SWFObject 2.x
var flashvars = {
branch: "index/nav/castcrew/john-doe"
};
This enables you to have multiple HTML pages that all host the same Gaia swf, and each page goes to a specific branch without a deep link in the address bar. This is leveraged by the Gaia SEO engine.
Routing
Gaia comes with Routing, which simulates mod-rewrite in that it generates a custom URL in the address bar. This means Gaia maps "pretty URLs" to pages in your site using the title attribute of terminal page nodes (page nodes with no children). Routing only works with terminal page nodes (pages that have no children).
By default, Gaia uses the title attribute of terminal page nodes for the pretty url, lowercase and with hyphens for spaces. This means every terminal page title in the tree must be unique! If you want to get around this, or you want to use something other than the title, add the attribute "route" to your page nodes with the pretty url you want to use.
Routes and page titles with non-alphanumeric characters in them (other than forward slash and hyphen) will have those characters converted to hyphens or removed altogether. As a rule, you should avoid using non-alphanumeric characters (other than forward slash and hyphen) in your routes.
Routing allows you to create search engine friendly URLs and provides maximum flexibility for deeplinking into your site. Again, page routes (titles by default) must be unique! Sample routes:
"summer-of-2007-photos" "2007/07/04/july-4th-bbq-photos" "schedules-and-showtimes"
If you want to turn routing off and use the branch paths as your deeplinks, add the attribute routing="false" to your Site node in the site.xml. The address bar branches will then reflect the ids of the pages of the tree branch, e.g. "index/nav/photos/summer"
