Os IFrames (HTML) são obsoletos? [fechadas]


87

Recebendo mensagens contraditórias sobre isso, espero que não. Não posso imaginar que o suporte para isso pare, já que um zilhão de sites os usam.

Algumas perguntas adicionais sobre isso:

  1. Por que eles deveriam eliminar essa tag?
  2. Alguma alternativa para isso?

Respostas:


51

Na minha opinião, o W3C pulou na frente ao despejar iframes dos doctypes Strict HTML e XHTML. Em teoria, você usaria o <object>elemento para adicionar objetos estranhos ao seu documento, mas as diferenças e limitações do navegador tornaram isso um obstáculo para muitos desenvolvedores. Com o muito mais pragmático HTML 5 (que ainda é um rascunho), os iframes estão de volta e têm até dois novos atributos: seamlesse o intrigante sandbox.


Incrível, só espero que os navegadores comecem a suportar uploads de arquivos AJAX para que não precisemos usar iframes ou flash para isso.
Xeoncross


2
Atualização: o atributo semless foi removido do html5. Veja: caniuse.com/#feat=iframe-seamless
Gabe

75

O suporte para <iframe>ainda está lá no HTML 5, então não acho que isso vá mudar no futuro próximo.

Para responder às suas outras perguntas:

  1. <iframe>s (como frames em geral) são na maioria das vezes não amigáveis:
    • Eles não permitem acesso fácil ao conteúdo do quadro por meio de uma URL (sem perder o conteúdo fora do quadro, pelo menos).
    • A maioria dos usuários "tecnófobos" se irrita com os frames.
    • Pelo que eu sei, eles são mais lentos para renderizar para navegadores
  2. As alternativas incluem geração de página dinâmica (SSI, PHP, Rails e assim por diante) e uso de JavaScript / AJAX para alterar o conteúdo de, por exemplo, um <div>

Para ser claro: estou falando de <iframe>um elemento de interface. Não é um elemento oculto para carregar outras coisas como, por exemplo, o Google Mail.


29
+1 para o ponto de que o Google está usando iframes para fins altamente especializados.
cgp

24

Iframes são obsoletos para layout de página. Nunca os use em vez de um bom layout CSS, mesmo o layout baseado em tabela é melhor.

Boas razões para usar iframes são:

  • ads : adwords por exemplo usa esta técnica, é bom para encapsular - ad css não destruirá sua página.
  • iframe oculto : pode ser usado para centenas de coisas utilizáveis, como rastreamento, alternativa ajax, etc.

35
*** NÃO use iframes para adwords, é uma violação dos TOS. *** scribd.com/doc/97655/...
CGP

37
altCognito: AdWords usa iframes, não eu :) Eu não quis dizer colocar adword iframe em outro iframe.
Thinker de

7
Sei que é um erro comum por aí (daí todos os artigos), então queria sinalizá-lo para ter certeza de que as pessoas entenderam o que você estava dizendo.
cgp

5
Iframes são obrigatórios ao incluir conteúdo complicado que deve ser servido de outro domínio e não deve ser manipulado com o código CSS ou JS da página atual.
vsync

4
O que você está falando não tem nada a ver com iframes. O ponto é - você usa um iframe para trazer um contexto de navegação externo aninhado. Você não o usa para 'layout de página'. Se eu precisar de um contexto de navegação aninhado - como no mundo eu usaria "bom layout CSS" em vez disso? Não faz sentido.
Chris B de

23

Os IFrames não são obsoletos, mas os motivos para usá-los são raros.

Razões para usar iframes:

  • É ótimo para isolar as coisas de outras pessoas de outros domínios, mas não se integra perfeitamente. (folhas de estilo, javascript etc ...)
  • Às vezes, a integração de multimídia pode ser mais fácil por meio de um iframe em vez de usar a tag embed.
  • Casos realmente especializados, como o caso do gmail, em que eles o usam para sons e gerenciamento de histórico.

Eu também responderia que não há necessidade de remoção de iframes, é uma tag necessária e estará por aí por um tempo.


12

Já vi muitos fóruns que sugerem a tag Object como um substituto para o IFrame, o que provavelmente funciona na maioria dos casos.

Por exemplo, eu tinha um PDF sendo exibido em um IFrame (porque havia outras coisas que precisávamos mostrar na página além de apenas o PDF) e consegui exibi-lo corretamente usando Object.

O que era:

<iframe id="confirmed_pdf" class="current_pdf" src="/prescriptions/show_pdf?id=123" height="570" width="480"></iframe>

Passou a ser:

<object id="confirmed_pdf" class="current_pdf" data="/prescriptions/show_pdf?id=123" type="application/pdf" height="570" width="480">
  <p>[Show this message if displaying the PDF did not work]</p>
</object>

Mas Object não era um substituto adequado para preencher o requisito de imprimir APENAS a parte PDF da página.

Um IFrame é como sua própria janela dentro da página (uma janela dentro de uma janela, basicamente), e depois de obter o objeto de janela, você pode chamar .print () nele, como:

jQuery("#confirmed_pdf").contentWindow.print();

O IFrame tem uma propriedade contentWindow, que torna a impressão apenas dessa parte possível. O objeto não tem uma propriedade contentWindow, portanto, não há como imprimir apenas a seção da página.

Então, parece que se você estiver apenas usando IFrame para exibir algo, há outras tags como Object que podem ser usadas no lugar. Mas se você precisar interagir com o conteúdo do IFrame de determinadas maneiras, o IFrame pode ser necessário.


7

IFrames são muito usados ​​com AJAX. O GMail, por exemplo, usa nove IFrames ocultos, acredito.


5
Eu conto cinco iframes. Um não está escondido e, na verdade, um deles que é quase toda a vista. IFrames não são usados ​​com Ajax normalmente (pelo menos não em qualquer um dos principais frameworks). O Gmail está usando iframes para coisas como: rastreamento de histórico, som (estranho) e algum tipo de desenho de tela.
cgp

Eu estava lendo um artigo que li alguns anos atrás.
John Topley,

7

IFrames não estão mortos, mas Frameset / Frames estão morrendo.

Nas últimas 2 versões do IE (IE7 / IE8), o zoom em Frames (não em IFrames) criou resultados desastrosos.

Use IFrames, mas IMHO fique longe de Framesets / Frames.


5

Na minha empresa anterior, fornecemos um aplicativo hospedado que os clientes integrariam em seus próprios sites. Às vezes, eles usariam um IFrame para fazer isso, encaixando nossa página hospedada em seus designs existentes. Às vezes, isso era feito perfeitamente (ou seja, o IFrame não tinha bordas ou barras de rolagem, apenas parecia parte da página). Eu considerei isso um bom uso da tag.


Iframes são essenciais para lidar com coisas que você precisa para colocar em sites de clientes com seu próprio estilo e Javascript, para que o código do usuário não quebre. CSS pode ser substituído facilmente e JS pode causar conflitos às vezes (em casos raros), então é melhor para uma abordagem de "Sistema Fechado".
vsync

5

Eles podem ser extremamente úteis em algumas circunstâncias, mas são limitadas. Em particular, a incorporação de funcionalidades comuns em vários sites.

Por exemplo, tenho um cliente que administra vários sites de comércio eletrônico de produtos escoceses. Como parte disso, desenvolvemos alguns aplicativos simples para localizar possíveis nomes de clãs a partir de seu sobrenome ou de sua escolha de tartans (ria se quiser, mas tartans valem $ 700 milhões por ano para nossa economia). O banco de dados por trás disso é surpreendentemente grande (quase dez mil linhas nos nomes principais e tabelas tartans) e atualizado com bastante regularidade.

Portanto, temos os aplicativos configurados para serem executados em um site e, em seguida, incorporados em nossos outros sites usando um iframe, permitindo a passagem de parâmetros javascript simples para que possamos integrar a seleção de um tartan ou clã com a funcionalidade no site de incorporação. O iframe é definido como noborder para que pareça completamente transparente para o usuário final.

Claro que haveria outras maneiras de fazer isso, mas o uso de um iframe é simples e robusto. E certamente não está obsoleto.


5

Cavalos para cursos ... <iframe> s são como qualquer outra coisa ... para o propósito certo, eles são a ferramenta certa; para o propósito errado, eles são um hack feio, ou pior.

No Ajax, <div> s geralmente são o contêiner mais apropriado. Em alguns lugares, a atividade de passar conteúdo externo como parte de seu próprio site, conforme suportado por <iframe> s, é inadequada.

Minha equipe usou um <iframe> outro dia como uma maneira ideal de dar aos usuários acesso ao seu histórico de e-mail em HTML - os e-mails eram páginas <html> completas que queríamos inserir facilmente em nosso modelo da web. <iframe> s eram absolutamente perfeitos para apresentar esses dados] '.

Por outro lado, os <iframe> s quase sempre devem ser removidos ou desabilitados em qualquer conteúdo enviado pelo usuário que é enviado de volta ao site, porque nesse contexto eles são um grande problema de segurança.


4

A especificação do gadget do Google atualmente depende de iframes: http://code.google.com/apis/gadgets/docs/spec.html

Atualmente, eles são a única maneira simples de fornecer isolamento para aplicativos javascript que são extraídos de vários domínios / provedores.

Além disso, muitos dos widgets que as pessoas incorporam em seus sites de terceiros usam iframes.

Embora tenham suas desvantagens, os iframes fornecem uma solução pragmática para problemas comuns na web. Eu teria que adivinhar que eles ainda existirão por algum tempo.


2

Acabei de alterar um site de um Frameset normal para Iframes, pois os frames normais não podiam fazer o que eu precisava. Não causou problemas com o resto da base de código.


2

Problemas de conformidade e segurança também podem levá-lo a usar Iframes; Carrinhos de compras são implementações baseadas em IFrame populares quando você deseja incorporar visualmente um carrinho de compras como parte de algumas páginas da web sem assumir total responsabilidade pelo lado do processamento de pagamentos.

Normalmente entregamos um Iframe para integrar nosso material de comércio eletrônico e clientes como o quão chave na mão pode ser.


0

Eu trabalho para uma empresa que usava frames para tudo, desde menus suspensos, listas, blocos de conteúdo, etc. apenas para cobrir as complexidades dos formulários da web .net. O aplicativo é muito lento e só funciona no IE. Não faça isso.

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.