Reklam Bannerı HTML Kodu
Reklam bannerları, web sitelerinde sıklıkla kullanılan bir reklam yöntemidir. Bu bannerlar, web sayfasının üst kısmında veya yan kısımlarında yer alabilirler. Bu bannerların HTML kodu, web geliştiricilerinin bannerların boyutunu, görüntülenme şeklini, hedef URL’yi ve diğer detayları belirlemesine olanak tanır.
Banner Boyutu
Reklam bannerları, genellikle standart boyutlarda gelirler. Bunlar 728×90, 300×250 ve 160×600 piksel boyutlarıdır. Ancak, web sitesinin tasarımına uygun olarak özel boyutlar da kullanılabilir. Banner boyutunu belirlemek için, HTML kodunda genellikle “width” ve “height” özellikleri kullanılır.
Görüntülenme Şekli
Reklam bannerlarının görüntülenme şekli, web sitesi sahibinin tercihine bağlıdır. Bununla birlikte, en yaygın görüntüleme şekilleri statik, animasyonlu veya dönen bannerlardır. Statik bannerlar, sabit bir görüntüye sahiptir. Animasyonlu bannerlar ise hareketli bir resim veya metin içerebilir. Dönen bannerlar ise genellikle üç veya dört farklı görüntüyü döndürerek dikkat çekmeye çalışırlar. Bu görüntülenme şekilleri, HTML kodunda “img” veya “div” etiketleri kullanılarak belirlenebilir.
Hedef URL
Reklam bannerlarının hedef URL’si, bannerın tıklanması durumunda yönlendirilecek web sayfasının adresini belirtir. Bu adres, HTML kodunda “a” etiketi kullanılarak belirlenir. Örneğin, bu bir örnek URL .
Reklam bannerlarının HTML kodu, web geliştiricileri tarafından kolayca özelleştirilebilir. Bu nedenle, birçok web sitesi sahibi ve reklamveren, bannerlarını özelleştirerek markalarını tanıtmak ve trafiklerini artırmak için bu yöntemi kullanmaktadır.
Reklam Bannerları İçin HTML ve CSS Kod Örnekleri
Reklam bannerları, web sitelerinde yaygın bir şekilde kullanılan bir reklam yöntemidir. Bu bannerların HTML ve CSS kodları, web geliştiricilerinin bannerların boyutunu, görüntülenme şeklini, hedef URL’yi ve diğer detayları belirlemesine olanak tanır. Aşağıda, reklam bannerları için HTML ve CSS kod örnekleri yer almaktadır.
Örnek 1: Statik Banner
Bu örnek, statik bir reklam bannerı için HTML ve CSS kodlarını içermektedir. Banner 300×250 piksel boyutunda ve ortalanmıştır. Ayrıca, bannerın “alt” özelliği, bannerın yüklenmediği durumlarda görüntülenecek alternatif bir metin içermektedir.
HTML Kodu:
CSS Kodu:
.banner {
width: 300px;
height: 250px;
margin: auto;
text-align: center;
}
.banner img {
width: 100%;
height: 100%;
}
Örnek 2: Animasyonlu Banner
Bu örnek, animasyonlu bir reklam bannerı için HTML ve CSS kodlarını içermektedir. Banner, hareketli metin ve bir resim içerir. Banner boyutu 728×90 pikseldir ve bannerın “alt” özelliği, bannerın yüklenmediği durumlarda görüntülenecek alternatif bir metin içermektedir.
HTML Kodu:
CSS Kodu:
.banner {
width: 728px;
height: 90px;
margin: auto;
position: relative;
}
.banner img {
width: 100%;
height: 100%;
}
.animasyon {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #ffffff;
color: #000000;
font-size: 24px;
text-align: center;
animation: animasyonlu-banner 2s infinite;
}
@keyframes animasyonlu-banner {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
Bu örnekler, reklam bannerları için HTML ve CSS kodlarının nasıl kullanılabileceğini göstermektedir. Web geliştiricileri, bu kodları özelleştirerek kendi reklam bannerlarını oluşturabilirler.
