Aktif reklam sistemleri çerçevesi veya iframe. iFrame nedir? Web Analizi ve Çerçeveli Sayfa
12/15/16 7K
Öğe
Çerçeveler
Bu ne işe yarıyor
HTML sayfasına sayfa nasıl eklenir? Bunu yapmak için kullanmanız gerekir
Görüntülemek
Ekran bloğu.
Örnek kod
Güçlü ama kullanımı kolay
Eski kötü günlerde çok fazla web tasarımı vardı her geliştiricinin hayatını bozan unsurlar. Neredeyse her zaman kötü bir tasarım yaklaşımıydılar. Neyse ki eleman HTML5'te kullanımdan kaldırıldı. Ancak
Benzerlikler ve farklılıklar
Bu öğelerin her ikisi de ayrı bir HTML belgesi oluşturmanıza olanak tanır. Geçerli web sayfasının referans verdiği belgenin içeriğine bir bağlantı, src özelliğinde belirtilir.
Aradaki temel fark
Video açıkça HTML sayfasındadır ve ayrı bir panelde değildir. öğesi bu paradigmayı kırdı ve belgenin, her biri ayrı bir belge görüntüleyen birkaç küçük panele (çerçeveye) bölerek tarayıcı penceresi üzerinde kontrol kullanmasına izin verdi. Aradaki tüm diğer farklar bu temel farktan kaynaklanır.
Çerçeve tabanlı mizanpajları iframe'lerle yeniden yapmayın
Bir gün çerçeveler kullanılarak oluşturulmuş eski bir web sitesini güncelleme göreviyle karşı karşıya kalabilirsiniz. Kullanmak isteyebilirsiniz ve aynı bağımsız panel ve eşik kabusunu yeniden yaratmak için sabit yerleşim genişliği. Ancak bir bağlantıyı ayrı bir çerçevede açmak için target özelliğini kullanamazsınız. JavaScript çözümleri aramaya başlayabilirsiniz. Lütfen, bunu yapma.
İyi (ve korkunç) kullanımlar
Birkaç geçerli kullanım durumu vardır bir HTML sayfası oluşturmak için:
üçüncü taraf medya içeriğinin yerleştirilmesi;
kendi medya içeriğinizi platformlar arası bir belgeye yerleştirme;
kod örneklerinin yerleştirilmesi;
ödeme şekli olarak üçüncü taraf “applet”lerin yerleştirilmesi.
İşte bazı korkunç kullanım durumları: :
Fotoğraf Galerisi;
forum veya sohbet.
Bağımsız, önceden var olan HTML belgelerini mevcut belgeye yerleştirmeniz gerekiyorsa şunu kullanın: . Her şeyi sıfırdan oluşturuyorsanız sayfa tasarımını birden fazla ayrı belgeye bölmenin bir anlamı yoktur. Özellikle de aslında bağımsız içerik parçaları değillerse.
iframe nitelikleri
Özellik adı
Anlam
Tanım
kum havuzu
Aynı kökene izin ver Üstte gezinmeye izin ver İzin verilen formlar İzin verilen komut dosyaları
Çerçeveye yüklenen içerikle ilgili bir dizi kısıtlama ayarlar. Daha önce ayarla HTML sayfası nasıl oluşturulur.
kaydırma
evet hayır otomatik
Çerçevede kaydırmaların gösterilip gösterilmeyeceğini belirler. HTML5'te kullanımdan kaldırıldı. Bunun yerine CSS kullanın.
İsim
İsim
Çerçevenin adını belirtir.
Hizala
sol sağ üst orta alt
Çerçevenin çevredeki öğelere göre hizalamasını belirler. Modası geçmiş. Bunun yerine CSS kullanın.
Çerçeve sınırı
evet (veya 1) HAYIR
Çerçeve çevresinde kenarlığın görüntülenmesini etkinleştirmek için kullanılır. HTML5'te kullanımdan kaldırıldı. Bunun yerine CSS kullanın.
uzun tanım
URL'si
Çerçeve içeriğinin uzun bir açıklamasını içeren bir sayfanın URL'sini belirtmek için kullanılır. Modası geçmiş. Bunun yerine CSS kullanın.
kenar boşluğu genişliği
piksel
İçerikten çerçeve kenarına kadar olan dolgunun genişliğini kontrol etmek için kullanılır. Modası geçmiş. Bunun yerine CSS kullanın.
kaynak
URL'si
IFRAME'de görüntülenecek belge URL'sini belirtir.
vspace
piksel
Çerçeveden çevredeki içeriğe kadar dikey kenar boşluklarını ayarlar. Modası geçmiş. Bunun yerine CSS kullanın.
Genişlik
piksel %
Bir HTML sayfasındaki çerçevenin genişliğini tanımlar.
Bu yayın “ ", dost canlısı proje ekibi tarafından hazırlandı
Affiliate Iframe, sitenizin görünümünü hiçbir şekilde etkilemeyen bir reklam türüdür. Yani hiçbir banner, pop-up veya diğer rahatsız edici pencere ziyaretçileri olmayacak. Sitenize gelen ziyaretçiler için size tam olarak ödeme yapılacaktır. Buna göre katılımın yüksek olması arzu edilir. Kazanç aynı zamanda ziyaretçinin size geldiği yere de bağlıdır (arama motorları, yer imleri vb.). Elbette en iyi ücreti hedeflenen ziyaretçiler, yani arama motorlarından gelenler ödüyor. Ayrıca ziyaretçinin hangi ülkeden geldiği de rol oynar.
Bu tür reklamların artılarına ve eksilerine bakalım:
Artıları:
Kurulumu kolay. Ortaklık kodunu sitenin tüm (veya hepsine değil) sayfalarına yüklemeniz yeterlidir.
Pasif gelir. Yani sitenizi ziyaret eden her kullanıcı için para aktarılacak ve sizin hiçbir şey yapmanıza gerek kalmayacak.
Rahatsız edici pankartlar veya .
Çoğu zaman herhangi bir site kabul edilir.
ATS'den, otomatik sörften, aks kutularından vb. gelen trafiği kabul ederler.
Tavsiye programı.
Eksileri:
Virüsler. Bazı bağlı kuruluş iframe'leri (özellikle reklamveren siteleri) virüs içerir, ancak çoğu zaman viral bir siteyi bağlı kuruluş hesabınızdan yasaklayabilirsiniz.
Yönlendirmeler. Bazen porno sitelerine yönlendirmeler meydana gelir.
iframe bağlı kuruluşlarının listesi:
— türünün en eski ortaklık programı ve en iyisi. Virüs içeren siteleri yasaklayabilirsiniz. Ayrıca yeni bir site eklerken “Sitemde moderatörler tarafından doğrulanmamış kaynaklar yayınla” kutusunu işaretlememenizi tavsiye ederim. Gelir daha az olacak, ancak virüs olmayacak, ancak siteniz yalnızca para kazanmak için oluşturulmuşsa, geliri artırmak daha iyidir. Trafik maliyeti 1000 tekil ziyaret başına 0,50 - 0,70 $'dır. Her türlü site kabul edilir. Diğer benzer ortaklık programlarına göre temel avantajının talep üzerine anında ödeme yapılması olduğunu düşünüyorum, yani sadece bir ödeme emri vermeniz yeterli (asgari ücret yok) ve ödeme bir dakika içinde gerçekleşecek.
— iframe reklamcılığına ek olarak popunder gibi başka formatlar da vardır. Ödeme: clickunder - 1000 benzersiz geçiş için 1wmz (Çin hariç tüm ülkeler), popunder - Rusya'dan 1000 benzersiz geçiş için 3wmz ve diğer ülkeler için 0,8wmz, gizli geçişler - 1wmz (Çin hariç tümü) ve iframe - 1000 başına 0,5-1,5wmz Ziyaretçiler (fiyat ayarlanabilir). 48 saat içinde talep edilmesi halinde minimum para çekme tutarı 3wmz'dir. Otomatik ödemeler aynı şekilde çalışır. Tavsiye programı - %5. Sistemde size istatistikleriniz, geçişleriniz vb. hakkında bilgi verecek bir ICQ robotu (88-25-28) bulunmaktadır.
- eski iframe ortaklık programı. Trafiğin kalitesini ve web yöneticilerinin faaliyetlerini çok ciddiye alıyorlar. Aktif değilseniz hesabınız silinebilir. Sitenizin kabul edilebilmesi için trafiğin günde en az 100 ziyaretçi olması gerekmektedir. Minimum ödeme tutarı 1$'dır. 1000 benzersiz ödeme - Rusya'dan 0,7$, Ukrayna'dan 0,3$, Beyaz Rusya'dan 0,25$, diğer 0,05$.
Şahsen ben iframe ortaklık programlarıyla işbirliği yapmıyorum, ancak bu yeni başlayanlar için doğru.
Merhaba, blog sitesinin sevgili okuyucuları. Bugün HTML'deki çerçevelerden bahsedeceğiz. En baştan başlayacağımız açık, yani bunun nasıl bir hayvan olduğuyla. Ayrıca hiper metin işaretleme dilinin güncel sürümünde ve yeni Html 5 standardında bu öğelerin bugünü (Frame) ve geleceği (Iframe) hakkında da konuşacağız.
Makalenin sonunda, yerleşik çerçeveler oluşturma sürecinin ve bunların Html kodunda (zaten nadiren kullanılan) klasik yapısının ayrıntılı bir açıklamasından sonra, üzerlerinde bir site oluşturmanın önemine değineceğiz ve ayrıca olası tartışacağız. Blogumun örneğini kullanarak bunları mevcut dönemde kullanmanın yollarını.
Nedir ve Iframe'in Frame'den farkı nedir?
Nedir? Yalnızca web sitelerinde değil, aynı zamanda herhangi bir program uygulamasında da kullanılabilecekleri ortaya çıktı, ancak bir web sayfasının veya uygulamanın penceresinin her biri ayrı bir belgenin yüklendiği birkaç alana bölünmesi bakımından farklılık gösteriyorlar . Üstelik bu çerçeve alanları birbirinden bağımsız davranır.
Muhtemelen bunların kullanımının en bariz örneği, neredeyse hepinizin karşılaştığı, bilgisayarınızda yüklü olan birçok programın sahip olduğu sözde yardım dosyalarıdır.
Yardım menüsünü içeren dosya sol pencereye yüklenir ve seçilen menü öğesine karşılık gelen belge sağ pencerede görüntülenir. Bu yapının, sağdaki yeni bir belgeyi açarken menüyü içeren dosyayı sol pencereye yeniden yüklemekten kaçınmanıza olanak sağlaması dikkat çekicidir. Tam olarak bundan oluşuyor Çerçeve kullanmanın temel avantajı HTML'de.
Aslında bu elemanların adının kendisi bağımsız bir pencere olarak yorumlanmalıdır. Çerçevelerin yardımıyla, büyük bir pencereyi birkaç parçaya bölme olanağına sahibiz; bu parçalar, birbirinden bağımsız ayrı belgeler (sayfalar, metinler, resimler, videolar vb.) için alıcı görevi görebilir.
Köprü metni biçimlendirme dilinde çerçeve yapısı nasıl oluşturulur? Şu anda ana standart olan Html 4.01 standardından (sınıflandırmaya göre) bahsedersek, bunun için üç öğe kullanılır - Çerçeve, Çerçeve Kümesi ve Noframes.
Iframe - Html 5 standardında yerleşik çerçeve
Html 5 standardından bahsedersek (bazı unsurları halihazırda birçok tarayıcı tarafından desteklenen geleceğimiz), o zaman klasik çerçeve yapısının yanı sıra Frame, Frameset ve Noframes etiketleri olmayacak; bunun yerine bir tane olacak Başlangıçta bahsedeceğimiz tek Iframe etiketi (gömülü çerçeve) ve ardından dikkatimizi şu anda kullanımda olan 4.01 sürümündeki klasik şemaya çevireceğiz.
Aşağıda tartışılan klasiklerden farklı olarak Iframe, Body etiketinin Frameset etiketleriyle değiştirilmesini gerektirmez. Onlar. bu etiket normal sayfalara, örneğin bir paragrafın içine veya başka herhangi bir yere eklenebilir. Özünde bu öğe, daha önce ele aldığımız Img etiketine çok benzer.
Bu, değiştirilebilir içeriğe sahip bir satır içi öğedir çünkü tam olarak bir satır içi öğe gibi davranır, ancak şunu görüntüler: yabancı dış içerik. HTML dilinde bu tür yalnızca dört öğe vardır - Img, Iframe, Object ve Embed. Dolayısıyla kahramanımız, bu etiketin nitelikleri kullanılarak boyutu ayarlanan bir alana yüklenecek harici bir dosyanın varlığını ima ediyor.
O. Iframe, içine harici bir nesnenin (video gibi) yüklendiği bir havuz öğesidir. Sayfaya yüklenmesi gereken bu dosyanın yolunu belirtmek için özel Src niteliğini kullanın. Ancak Img'den farklı olarak Iframe öğesi eşleştirilmiştir, yani. ayrıca bir kapanış etiketi var:
Bu örnek, Iframe kullanan bir Youtube video sayfasındaki çıktıyı gösterir. Harici dosyanın yükleneceği çerçevenin (pencerenin) alanını sınırlamak için nitelikler sağlanmıştır Genişlik ve yükseklik değerleri piksel cinsinden belirtilen:
Onlar. bu etiket, bazı harici nesnelerin yüklendiği bir alan oluşturur (sitenizden veya başka bir kaynaktan olması fark etmez). Alanın genişliği ve yüksekliği Genişlik ve Yükseklik kullanılarak belirtilir ve Src özelliği bu nesnenin yolunu belirtir.
Iframe öğesi, tüm bu nitelikleri, değiştirilen içeriğe sahip benzer satır içi etiketlerden (yukarıda bahsedilen Img gibi) devralmıştır. Ayrıca resimlerden nitelikler de aldı Hspace ve Vspace Bu, çerçevenin kenarlıklarından etrafını saran metne kadar girintiler ayarlamanıza olanak tanır.
Yerleşik çerçevenin hizalanmasının, Html - . Hepsi aynı Hizala ancak Alt, Üst, Orta, Sol ve Sağ olası değerlerine sahip Iframe etiketi için.
Ancak bu öğe aynı zamanda metinde aşağıda detaylı olarak bahsedeceğimiz klasik çerçeve yapısından Çerçeve etiketinden de birçok özellik almıştır. Bu nitelikler, bir bağlantıya tıkladığınızda ihtiyaç duyduğunuz belgenin bu çerçevenin penceresinde açılmasını sağlayacak şekilde değeri bir değer olarak kullanılabilen Ad'ı içerir (daha fazlasını aşağıda okuyun).
Ayrıca Iframe'de, Frameborder özelliği yalnızca iki değere sahip olan Frame etiketinden taşınmıştır: 0 (çerçevenin etrafındaki çerçeve görüntülenmez) veya 1 (çerçeve görünür). Varsayılan değer Frameborder=1'dir, dolayısıyla onu kaldırmak için Frameborder='0' girmeniz gerekecektir:
Kaydırma özelliği de Çerçeve'den bu öğeye aktarılmıştır; bu öğenin varsayılan değeri Otomatik'tir - içerik, onu görüntülemesi amaçlanan pencerenin boyutundan daha büyük olduğunda çerçevedeki kaydırma çubukları gerektiği gibi görünecektir.
Marginwidth ve Marginheight nitelikleri de Çerçeve öğesinden taşındı. Aşağıda metinde ayrıntılı olarak tartışılacaklar, ancak kısaca - çerçevenin kenarlarından içine yerleştirilen içeriğe kadar genişlik ve yükseklikteki girintiyi ayarlamanıza olanak tanır.
Daha önce de belirttiğim gibi, Iframe kullanmanın açık bir örneği:
Bir web sayfasına doğrudan bir Iframe ekleyerek YouTube'dan bir videonun çıktısını alırsınız. Bu öğenin, değiştirilen içeriğe sahip satır içi öğeler ile aslında şimdi tartışacağımız klasik çerçeveler arasında bir geçiş olduğu sonucuna vardık.
Çerçeve ve Çerçeve Kümesi etiketlerini temel alan çerçeveler - yapıları
Yani klasik bir çerçeve yapısı oluşturmak, genellikle herhangi bir belgede bulunması gereken açılış ve kapanış Body etiketi yerine, onu öğe tabanlı bir kapsayıcıyla değiştirerek Html koduna yazmanızla başlar. Çerçeve kümesi.
Temel nokta, bu durumda Gövde öğesinin kullanılamamasıdır - Gövde (normal bir belge için) veya Çerçeve Kümesi (bir belge çerçeve yapısı oluştururken):
Ana çerçevenin içinde oluşturduğumuz her çerçeve ayrı bir öğe kullanılarak oluşturulur Çerçeve. Bu etiket tektir ve içinde bu pencereye yüklenecek belgenin yolunu belirleriz.
Henüz değinmediğimiz üçüncü unsur ise Çerçeve yok. Eşleştirilir ve içine, tarayıcı tarafından işlenecek ve yalnızca aynı tarayıcının (veya başka bir görüntüleme cihazının) çerçeveleri desteklememesi durumunda bir web sayfasında görüntülenecek bir metin yazmanıza olanak tanır. Bu, örneğin mobil cihazlar için bir tarayıcı kullanıyorsanız meydana gelebilir.
Genellikle Noframes'de yalnızca çerçeve yapısının işlenmesinin imkansız olduğu mevcut durum hakkında bilgi eklemekle kalmaz, aynı zamanda bunları kullanmadan çalışmaya devam edebileceğiniz diğer sayfalara gitme yeteneğini de eklerler. Onun hakkında başka bir şey söylemek zor, o yüzden devam edelim.
Body etiketi yerine kullanılan Frameset öğesinin görüntüleme alanı için ayrılan tüm alanı kapladığı ve bu alan içinde ayrı ayrı Frame öğeleri kullanılarak çerçevelerin oluşturulacağı ortaya çıktı. Bu bağlamda, görüntüleme alanının ayrı pencereler arasında nasıl bölüneceği veya başka bir deyişle her birinin boyutunun nasıl ayarlanacağı sorusu ortaya çıkıyor.
Bu, Frameset öğesine uygun niteliklerin eklenmesiyle yapılır. İki tane var - Sütunlar ve Satırlar. Cols, büyük bir pencerenin bölünmesini dikey çerçevelere veya sütunlara ayarlar ve Rows, onu yatay pencerelere veya satırlara bölmenize olanak tanır.
Çerçeve Kümesi ve Sütunlar ve Satırlar niteliklerine dayalı bir yapı oluşturma
Html Frameset etiketinin Cols ve Rows değerleri virgülle ayrılmış (boşluksuz) sayılardır. Bu sayılar sonuç olarak elde etmek istediğimiz pencerelerin oranlarını belirler. Bu nedenle Sütun veya Satırlarda ne kadar virgülle ayrılmış sayı yazılırsa yazılsın, elimizdeki çerçeve sayısı sonuç olacaktır.
Örneğin, bu gösterimi kullanarak genişliği 2:5:3 oranlarına karşılık gelecek üç dikey sütun elde edeceğiz.