Are iframes a design smell?

Question

We have some pretty old, clunky .Net 1.1 apps in our business that - rather than be forcably upgraded - just get an iFrame added so that new functions can be dropped in.

It's become such a well-known option that many management staff who don't really have a great deal of technical knowledge or experience suggest just throwing an iframe on a page as if that would be the only way to solve the problem.

I don't have an issue with the iframe element per se if it's absolutely necessary, but it does seem that it's a very convenient tool for something that might be better achieved with a little more thought and consideration for design.

Are iframes the web design equivalent of a code smell?

Answer 1

Yes and no.

Yes they are a smell if your using them to sand box your JavaScript. Yes there a code smell if your sand boxing your CSS. You should go and reduce the damage as much as possible and not use an iframe to cheat here.

However an iframe as mentioned can be used as a poor-man's ajax.

So for the below techniques, No it would not be a smell.

Some valid techniques include posting an <input type="file"> to the server without refreshing the page (just submitting the iframe).

Another use would be using an iframe to do some kind of Comet interaction. It can be used to Stream data.

Basically ask yourself whether an iframe is used for content or functionality.

Content is bad, functionality is good. (Especially if that functionality is legacy browser support. You don't need iframes in modern browsers)

Answer 2

Not really, iFrames are good for when you want to avoid javascript conflicts (opening different applications with different libraries, for example) and that is a really valid use IMHO.

Otherwise I think of iFrames as the poor-man's ajax, and that is where that I don't find iFrames as good practice.

Answer 3

Agree with yes and no - in general it's best to avoid, but it is the only way that certain interface integrations can be done.

(This is particularly tricky, however, if you're wanting to do some interface designs with Java portlets and/or popup dialogs.)

Answer 4

If they are used to get content from the same host as the parent. Then you should probably just use a dynamic language to render the page as a single page a cut down on http requests.

However there are some good uses for them. Like content that is on other hosts, such as embeding social media buttons, charts and payment gateways. For this there is not much better, if you have a wide audience that needs to embed your stuff into their websites then iframes are one of the easiest ways.