Optimising Your Framed Site For Search Engines

One method that web designers can use to design and structure a website is to use frames. However, if your web site utilises frames then you could have major problems getting indexed in the search engines. Although site design using frames has become less prominent with the rise in popularity of CSS, there are still sites out there utilising framesets. But there are ways to sidestep the problem. In the past, frames were considered a great way for site designers to quickly and easily display content whilst maintaining a structure throughout the site (e.g. by having a title, or navigation bar). They allow more than one HTML document to be shown on a page by displaying each one within its own "frame", which are defined by the "frameset" HTML tag. This tag defines which pages to show and the size and position of the frame it should appear in. Although this sounds great in theory, it creates problems with both navigation (and therefore search engine indexing) and usability. As web usability expert Jakob Nielsen has documented on his site, http://www.useit.com /alertbox/9612.html, there are several usability issues associated with frames: They can be disorientating to users - if they click within one frame and this affects another frame it can make navigation confusing. The address bar doesn't change as the user navigates between pages, because the pages load inside the frameset. Again, this can confuse and disorient users. The loading time increases because there is more than one page to load. If the site takes too long to load then visitors are going to go elsewhere instead. If a user bookmarks a page within the site, they will be sent to the default frameset when they revisit rather than the bookmarked page. On top of this, there are also issues with search engines finding and indexing all of a framed site's pages. The most fundamental problem is that search engines find and index pages by following HTML links in a document, and because framesets reference a page rather than linking to it, the pages within the framed site cannot be reached. Ultimately, this means that no matter how large a site is there's a possibility that only the frameset page will be indexed. There is a way round this problem. You can place a "noframes" tag in the body of your frameset page to provide alternative content that will be displayed if the browser is not frames compatible. Fortunately, search engines can also read this tag, so if you include normal links within this tag the search engines can spider them like a normal site. Visit http://www.w3 schools.com/tags/tag_noframes.asp for more information on the noframes tag. So now the search engines can find your pages, but what happens when your visitors find them? Because the frameset dictates which pages should be loaded, if an internal page is accessed directly through a search engine then it will be loaded outside the context of the frameset. This means that the page will be viewed on its own without any of the intended accompanying pages specified by the frameset, such as a navigation bar. This type of page is known as an "orphan" page. They are confusing for visitors because once they find the page they may not be able to navigate the site, meaning you may end up losing the visitor, or worse, a customer. Again, there is a way around this issue. You can use JavaScript to force the page into its framed context, and although this causes problems with JavaScript incompatible browsers it does neatly avoid the orphaned page issue. There is a great tutorial available at http:// www.webreference.com/js/column36/forcing.html showing how this is done. There are alternatives to frames that allow for similar functionality, the most popular would be to position elements on a page using Cascading Style Sheets (CSS), or if you are designing a dynamic site then utilising Server Side Includes (SSI) would be a good option. Although the above shows how to avoid the complications caused by frames, for the various stated reasons it would be better to avoid them altogether.