Creating a Framed Site Without The Drawbacks to SEO

Jul 19, 2005 • 12:43 pm | comments (3) by twitter Google+ | Filed Under SEO - Search Engine Optimization
 

In the last several years, sites with frames have been slowly burned at the stake by SEO's. Redesigned, converted, noframed, and removed in order to accomodate a better design that will do well in the search engine. For the most part many of the techniques used to fix frames in the past are as not much more effective than the frames themselves. Adding links and content in the noframe section is not often a good solution and only a temporary patch at best. In most cases the best advice is to just not use frames period. I wanted to highlight a good advanced search engine optimization technique for fixing frames on websites. This technique is actually more a way to preserve the layout using frames while redoing all the code work. I came across a good example of it yesterday as I was examining some excellent CSS resources from a post on Cre8asite Forums. If you have clients or yourself want to keep the benefits of frames but not have the negative side effects there is a very good solution.

Fix Frames with a CSS Layout

Some brilliant people have taken the time to do a few examples of this (below). Basically the trick is to work with the z-index and the images in the CSS. You tell it to have the content layer scroll over the shadows but under the main image. The benefits are: You get a fixed navigation and top header and scrolling main body. The code is super clean as all styles are in the CSS. Its works in IE6 and all other browsers (except IE5.x).

Here are two examples: http://www.stunicholls.myby.co.uk/layouts/frame.html - you can grab the CSS here by doing a view source.

http://jfy.homeunix.net/misc/example.html - another good and clean example of it in use in the backend of an administration section. See the source.

http://www.webreference.com/html/tutorial24/ - very thorough resource for creating this type of layout

This technique can be adapted in many ways for the use with a redesign. Its especially wonderful SEO benefits are paralleled with the benefits it can have conversions and design. Check it out.

Previous story: Lower Case -- uPPER cASE: It's All the Same
 

Comments:

Doug

07/19/2005 08:01 pm

Well, they aren't frames if they are CSS, are they? That only addresses the visual aspect of frames, not why they suck, so of course if you can create fixed headers and/or nav and/or footers, it is nice to have the option without frames and usually the old browsers degrade well so that the whole page scrolls normally.

Ben Pfeiffer

07/20/2005 01:11 am

Well actually the best way to describe this is to use the word frames as to the effect garnered. But your right its just CSS. The negatives of frames are known to people who work with SEO, this technique was for them, and if they didn't know the negatives then this CSS technique would probably not interest them. As for older browsers is not a large issue unless you make it. one.

Craig

03/16/2007 07:53 am

It is possible to create an iFramed site with no SEO drawbacks although it relies a bit on Javascript but then only to make sure that any page requested outside of the iFrame would then load itself into the iFrame and also used, similarly to AJAX, to support proper browser behavior. Add a site map with the urls of each of the pages that would normally be loaded into the iFrame and then search engines see what they need to see and humans see what they need to see, which are essentially the same thing. This obviously is not a preferred method to build a site but in some cases, one has no choice.

blog comments powered by Disqus