Improve Your Search Engine Ranking with AJAX
- Separate Navigation from Content
- Design Your Web Page
- Inline Frames
- Working with XmlHttpRequest
- Summary
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
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.
Outgoing links on web pages affect the page rank of your content. While this might increase the page rank of popular articles because many pages link to them, the content to which all pages link (for example, Privacy policy) usually gets the highest page rank—which isn't always what you've intended. On one of my web sites, the highest-ranking page was the form used to send messages to the web administrator—not something you want the users to find first on Google.
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.
Traditionally, web designers have tried to separate navigation from content with framesets or by building the whole navigational structure with extensive JavaScript code. Both approaches have drawbacks, so it's no wonder that a large number of major web sites avoid framesets.
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 navigational elements are loaded after the web page has loaded through inline frames (IFRAME) or by using the XmlHttpRequest object.
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.
Visitors who have disabled JavaScript in their browsers will have the same view of the page as the search engines. You have to ensure that their limited view will not fatally impair the functionality of your web site.
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.