HTML iframe Kullanımı

<iframe> HTML Etiketi ne işe yarar?​

<iframe>, bağımsız bir HTML belgesini geçerli belgeye yerleştiren bir satır içi çerçeve oluşturur.


Örnek Kod:

Güçlü, ancak kötüye kullanımı kolaydır​

Web sitesi tasarımının eski günlerinde, etrafta sarkan ve herkesin gününü mahvedecek birçok <frame> öğesi vardı. Neredeyse her zaman tasarıma kötü bir yaklaşımdı. Neyse ki, <frame> öğesi HTML5’te kullanımdan kaldırıldı, ancak <iframe> veya “satır içi çerçeve” hala kullanılabilir durumda. Aynı zamanda itiraz edilmeli miydi? Sadece bundan kaçınmak en iyisi midir? Bu elemanın bizim için bazı geçerli kullanım alanları var olması mı kaldırılmasını engelledi bilmiyorum, ancak yaygın olan bazı tuzaklardan kaçınmak için ne olduğunu ve nasıl çalıştığını gerçekten anlamalısınız.

<iframe> ve <frame> birbirine benzerlikleri ve farklılıkları​

Her iki öğe de bağımsız bir HTML belgesini temsil eder. Belgenin içeriği, her bir öğenin src niteliğinde referanslıdır, bu nedenle aslında geçerli belgeden referans alınan tamamen bağımsız bir kaynaktır.

<iframe> ve <frame> arasındaki temel fark, <iframe> içeriği, geçerli belgenin bir parçası olan bir öğenin içinde görüntülenir. Örneğin, bu gömülü YouTube videosunu göz önünde bulundurun:




Video, başka bir yerdeki ayrı bir panelde değil, sayfada açıkça görüntüleniyor. <frame> öğesi bu paradigmayı bozar ve belgenin tarayıcı penceresi üzerinde kontrolü ele geçirmesini sağlar ve her biri farklı bir belge görüntüleyen birkaç küçük panele (çerçeve) ayırır. (Çok kötüydü.) <frames> ve <iframe>> arasındaki diğer tüm farklar bu temel farktan kaynaklanıyor.

<frame> kullanımını burada gösteremiyorum fakat özetle bir sayfa içinde bir birinden bağımsız (kısmen) sayfalar topluluğu olarak düşünebilirsiniz.

<iframe> için iyi (ve korkunç) kullanımlar​

<iframe> için bazı meşru kullanımlar vardır ve 1990’lardaki korkunç tasarım modellerini taklit etmek bunlardan biri değildir.

Doğru kullanım şekillerinden bazıları:

• Üçüncü taraf medyayı yerleştirme
• Kendi medyanızı bir belgeye özgü şekilde gömme
• Gömme kod örnekleri (bunu sitede yapıyoruz)
• Üçüncü taraf “uygulamaları” ödeme şekilleri gibi yerleştirmek

Ve <iframe> için bazı korkunç kullanımlar:

• Fotoğraf Galerisi
• Forum

Temel olarak​

Bağımsız bir HTML belgesini mevcut belgeye gömmeniz gerekirse, bir <iframe> kullanın. Hepsini sıfırdan oluşturuyorsanız, özellikle aslında bağımsız içerik parçaları değilse, sayfa tasarımını birkaç bağımsız belgeye bölmek için hiçbir neden yoktur.



<IFRAME> içinde kullanılan nitelikler(Attributes)