Many well-designed web sites contain significant amounts of navigational information together with the actual content. The HTML markup used for navigation can impact your search engine ranking as well as increase the page download time experienced by your visitors. In this article, you'll see how you can use AJAX to create more focused, faster-loading web pages.
Separate Navigation from Content
Let's start with an example. Consider the article you're reading right now—it has the following items:
A header with predefined links to various parts of Informit.
A line below the header positioning this article within the content structure of Informit. (This is the only navigational element actually related to the content.)
A sidebar on the right with links to similar or popular articles and promotions.
A footer, yet again with predefined links that never change.
This mixture can affect the way search engines index your data:
Because search engines can't distinguish content from navigation text, they index everything they find on your page. Since the keywords from the content are mixed with unrelated navigational keywords, the relevancy of the content is reduced. Some search engines claim that they can discover repetitive text on crawled pages (for example, fixed headers and footers) and remove them. Don't depend on that possibility, though; even if they do it, it's not always reliable.
The navigational elements added to a web page can also impact users with low-speed Internet access, more so if the web page doesn't use positioned DIV elements (which are used by Informit) but rather uses tables. In this case, the whole table has to be loaded in some web browsers before it's displayed to the user.
Techniques used within the AJAX framework give you an alternate solution to this problem:
Each web page contains only the placeholders for the navigational elements and the actual content.
The content of the navigational elements is then merged with the web page content, resulting in a clean page with no embedded frames.
Before redesigning your web pages with this approach, you need to consider the following issues:
Search engines will see only the initial web page. You have to make sure that the page contains links to related pages or to a sitemap. The navigation line above the article header (breadcrumbs) and the links within the Article information section of the page on Informit serve this purpose very nicely.
You might want to retain some static content on your page. For example, the Informit logo and the copyright information would have to be shown to all visitors at all times.
When you've decided which parts of your navigational structure should be attached with the page and which parts should be separated from it, you're ready for the next step.