# Replacement for an iFrame



## Dustin Cook (Dec 26, 2003)

Hello all.

I want to use this thread as a test bed for a revamp of a web site design I currently have.

Currently, the site uses an iFrame to display the main content on the pages, with a selection of links around the frame (linking inside) and a forum.

I was wondering, what newer methods are available now to attain something similar? The site has a couple hundred pages.

I also would like the site to work in FireFox, IE, Opera, Crome, etc.

I open the floor to suggestions.


----------



## JimmySeal (Sep 25, 2007)

I would say the range of options available to you depends on your programming ability. Could you tell us a bit about that? Also if you could tell us _why_ you want an alternative to an iframe, it would be easier to suggest an alternative.

Just a comment on your site: I've noticed that your iframe doesn't show up on the version of Firefox that I have (3.0.5), because you have two empty tables that are pushing the iframe down by 446 pixels and out of sight:


```
<table height="100%" cellspacing="1" cellpadding="0" width="100%" bgcolor="#000000" border="0">

                      <tbody>
                      </tbody>
                    </table>
                    <table height="100%" cellspacing="1" cellpadding="0" width="100%" bgcolor="#000000" border="0">
                      <tbody>
                      </tbody>
                    </table>
```
Is there any reason those are there? The page seems to display correctly if they are removed.


----------



## ronald27 (Sep 27, 2005)

Couldn't see any content because I use Firefox too! However I guess your website's content should appear in that big black area. If you want to keep the same design I wouldn't change the iframe, and Google is able to crawl your content, so I don't see any problem.


----------



## caraewilton (Nov 7, 2007)

Hi Dustin

Unlike Jimmy and Ronald I would defiantly recommend getting rid of the Iframes. As to your options, there are many. If it was me, I would go for a basic xhtml site and use css for layout and styling.

Another option would be to used CMS like word press.

What software are you using to edit pages with? Depending on what you use, this may influence your decision.


----------



## bid2me (Jan 3, 2009)

I would Recomend useing something like Divisions.

This as the html/php/xhtml page information.

```
<div id="masthead">
<div id="logo">
</div>
<div id="header">
</div>
</div>
<div id="container">
<div id="left_col">
</div>
<div id="right_col">
</div>
<div id="page_content">
</div>
</div>
<div id="footer">
</div>
```
And this as the Css information.


```
body {
margin: 0;
padding: 0;
}
#masthead {
min-width: 600px;
}
#logo {
float: left;
width: 200px;
}
#header {
margin-left:200px;
}
#container {
clear: both;
min-width: 600px;
}
#left_col {
float: left;
width: 200px;
}
#right_col {
float: right;
width: 200px;
}
#page_content {
margin-left: 200px;
margin-right: 200px;
}
#footer {
clear: both;
}
```
This will make something like this


----------



## Dustin Cook (Dec 26, 2003)

Thanks for all the replies. I have responded below, sorry for the short essay length of the reply.

I use Dreamweaver for most of my editing of HTML. I have experience in most types of design though, and I am willing to learn more, as I don't plan to have this online until the summer, when I plan to take the site off for a week or so and completly replace it with a new design.


*Firefox *- Yes, the black box region is where it should display the content. And no, I actually have not idea why they are there (been a while since I looked so closely at the design) but it _may be_ an IE design issue?
*xhtml/css* - i have developed sites using xhtml / css in the past and it is extremely powerful. My only problem would be the static links on the site, how can I manage them easily without the need to change every single page? Also, Dreamweaver doesn't display CSS pages right for me - do you know why? All the content is on top of each other.
*cms* - I would really like to use a cms and integrated forum, but from my previous exterience (with my star trek fan site) any cms I tried to use just ended up more complicated than how I would update a HTML page, and I could never get a look which I was happy with.
Also in relation to the iFrame, is it now not considered bad coding practice to use one?


----------



## caraewilton (Nov 7, 2007)

Hi Dustin

I will give you my opinion on this matter, starting with your last question.

I think using Iframes is like using tables for layout. You can do it, it does work, but it is an outdated method and consequently as time goes by, web browsers will support these methods less and less.

Seeing as you do have a background understanding of xhtml and css then I would think this is the best way to go, with a slight difference.

Basically, code your pages as normal using an xhtml strict doc type. Instead of saving the pages as .htm or .html save them as .php

Then you can use php include to include your menus. The code for these menus are saved on separate pages and can be included into multiple pages. The result is when you make menu changes, you need only change one page. Basically a modern way of using Iframes.

The code for a php include would look something like this:
<?php include('www.static.com/menus/popular-articles.php'); ?>
and you simple place this where you want the menu to appear.

The only snag is, if your website has multiple levels you need use absolute referencing (links) as the page is called from the current page not the menu page.

Further to this, you could also use dynamic web page templates. Basically you set up the basic layout you want to use for all your pages. You assign the areas which will change for each page as editable. Then you create your pages from the dynamic template. The cool thing is, if you want to change something in a noneditable section, all pages which were created from this template will be updated and changes.

The combination of php and dynamic web page templates makes maintaining large web sites a breeze.

I personally use Expression Web, however it is my understanding that dream weaver also supports php and has it's own form of dynamic web page templates.

One project I am working on, CHouseLive, was created using this method. At present there are 70 odd pages and about 10 different menus. To-date maintenance has been painless.


----------



## JimmySeal (Sep 25, 2007)

Iframes and frames are not outdated and browsers are not going to stop supporting them. If frames are good enough for one of the most powerful presences on the web, they're good enough for us.
Using php to include entire pages in your html is not a "modern version" of iframes, will slow down your site, and doesn't even make sense in this situation.

If you want to continue with this type of site layout (having pages from other sites dynamically shown within your page) then an iframe is really the most sensible way to go.


----------



## caraewilton (Nov 7, 2007)

Actually I am not suggesting he include the entire page, *only the menu or menus*.

If you really want to use frames then read this WC3 note on frames.

I find it interesting that WC3 feel it is necessary to provide an alternative to frames that uses HTML 4.01 and CSS and addresses many of the limitations of today's frame implementations.

Another note, if you care to create xhtml which validates, iframes are not supported.


----------



## JimmySeal (Sep 25, 2007)

caraewilton said:


> Another note, if you care to create xhtml which validates, iframes are not supported.


iframes are perfectly valid under XHTML 1.0 transitional, and that's nothing to sneeze at.

And the iframe functionality hasn't been removed from 1.0 strict and XHTML 1.1. It has simply been absorbed by the element. But since is more or less broken in IE all the way up to version 7, it's much safer to stick with iframe for now.


----------



## MMJ (Oct 15, 2006)

iframes, while they have their uses (really they do), is not the way to go for a web template, especially since we are in 2009.

lots of reasons, from really bad seo to the user not being able to copy a direct link to a page as address bar stays the same (there are workarounds obviously).

if you want it so that the page doesn't reload each time you click a link then unless you are interested in using ajax to call the pages (not the best solution either) you might as well use them.

http://www.google.com/search?q=frames+sucks

@OP: your page really looks messed up in Fx 3.1 (b2)


----------



## Dustin Cook (Dec 26, 2003)

One of the main reasons why I would like to get rid of the iframe is due to the linking fact. I had done a static welcome page which made the recently updates items and new items easier to read, but unfortunately I could not get the linking correct and so scrapped the whole idea.

What I want to do to the design of the web site, is freshen the design. Make the main content section bigger, pushing the banner to the top of the page, maybe moving the grey links to abover the banner, and maybe placing a search function inside.

Is there anyway using CSS & xhtml to create the static area?

I am very interested in all this feedback on the design at the moment too. Another major problem with using the iframe is that is does not display in Fire Fox!


----------



## JimmySeal (Sep 25, 2007)

Dustin Cook said:


> I am very interested in all this feedback on the design at the moment too. Another major problem with using the iframe is that is does not display in Fire Fox!


I already told you why the iframe wasn't showing up in FireFox and how you could fix it. That shouldn't be an issue here.

I'm not sure what you mean by this question:



> Is there anyway using CSS & xhtml to create the static area?


For embedding pages from other sites within your page, there really is no alternative to iframes, if that's what you're asking.


----------



## Eriksrocks (Aug 7, 2005)

JimmySeal said:


> For embedding pages from other sites within your page, there really is no alternative to iframes, if that's what you're asking.


Use PHP includes to include common items like the header and footer on every page, and then have your content just be separate pages, as caraewilton already mentioned. 

Iframes are not a good option for layout.


----------



## JimmySeal (Sep 25, 2007)

Have you seen the page? He's not using the iframe for layout. He's using the iframe to dynamically display various pages in a frame on his site when the user clicks an item from the menu. And some of the pages are not even from his site (there's http://www.veritas.ie and http://www.saintjoe.com, to name just two), so "include a header and footer and have separate pages for different content" does not work in this situation because it's not his content and he cannot control it.


----------



## caraewilton (Nov 7, 2007)

Jimmy I hear what you are saying but . . . if you click on those links, they are opening in a new page anyway.
If you wanted to embed those in the actual site, then yes an iframe would be the answer.
But the way the site is set up, i.e. the way iframes are being used on that site would not be considered optimal by many modern web developers.
Using php or asp for what Dustin wants is the preferred method.


----------



## Eriksrocks (Aug 7, 2005)

JimmySeal said:


> Have you seen the page? He's not using the iframe for layout. He's using the iframe to dynamically display various pages in a frame on his site when the user clicks an item from the menu.


That is layout. He's using it to add the header and footer around those dynamic-ly clicked pages. 

What caraewilton said:


caraewilton said:


> Jimmy I hear what you are saying but . . . if you click on those links, they are opening in a new page anyway.
> If you wanted to embed those in the actual site, then yes an iframe would be the answer.
> But the way the site is set up, i.e. the way iframes are being used on that site would not be considered optimal by many modern web developers.
> Using php or asp for what Dustin wants is the preferred method.


Yes, they will be supported by browsers in the future, but it's really not a good approach to this type of layout. And JimmySeal, you're in the minority:
http://forums.digitalpoint.com/showthread.php?p=2974047

*EDIT:* If you continue with this method, it's not the end of the world. But there are better ways to do it.


----------



## MMJ (Oct 15, 2006)

Iframes are used for ads to "sandbox" them. So that the same document.cookie isn't used (and other reasons).


----------



## bid2me (Jan 3, 2009)

it sounds to me like he almost should use a flash website for some of it... 
but thats my dumb oppinion.
i have to relize everybody dosn't have the 500+ dollors to get Flash, but then tons of people pay for Dreamwever! Go Figure...


----------



## Eriksrocks (Aug 7, 2005)

Flash websites are just as bad as using iframes.


----------

