HTML5 – Bağlantı (Link) Yapısı

HTML5 ile bağlantı (link) yapısı konusunu anlatmak üzere yeni bir yazıya başlarken, hepinize selam ederim.

Bir HTML dosyası içerisinde herhangi bir sayfaya, sayfa içi kısımlara, web sitesine, belirtilen dosyaya (zip, rar, müzik, video vb.) veya mail adresine gitmek ve yönlendirme yapabilmek için kullanılan özelliklerden olan bağlantı yapısını anlamak ve uygulayabilmek gerekmektedir. Bunun için HTML içerisinde  <a></a> etiketi kullanılmaktadır.

Bağlantı (link) verme yapısı:

<a href="Yönlendirme Kaynağı/url">Bağlantı Adı (Görünen Yazı)</a>

Linkler hemen hemen bütün HTML özelliklerine uygulanabilir. Butonlar, resimler, menüler, liste elemanları vs. benzeri birçok element ve etiket buna dahildir.

Şimdi bağlantı çeşitlerini inceleyelim.

Sayfalar Arası Bağlantı

Bağlantıyı yenilenen pencerede açmak olarak da ifade edilebilir. İşlem yapılan mevcut sayfa içerisinden herhangi bir sayfaya geçiş için bu yöntem kullanılır. 4 parametre alabilmektedir.

<a href="Yönlendirme Kaynağı/url" target=”_yönlendirme tipi”>Bağlantı Adı</a>

• _blank: Böyle bir bağlantıya tıklandığında yönlendirilecek olan sayfa yeni bir pencereden, mevcut sayfadan bağımsız olarak açılacaktır.

<a href="Yönlendirme Kaynağı/url" target="_blank">Bağlantı Adı</a>

• _self | _top | _parent : Böyle bir bağlantıya tıklandığında yenilenecek/yönlendirilecek olan sayfa mevcut sayfanın yerine açılacaktır.

<a href="Yönlendirme Kaynağı/url" target="_self | _top | _parent">Bağlantı Adı</a>

Nihayi olarak ele alındığında; _top, _parent ve _self işleyiş bakımından benzer sonuçlar vermektedir. _self yöntemini kullanmanızı tavsiye edebilirim.

Sayfa İçi (Site İçi) Bağlantı Bu yöntemle sayfa içerisinde istenilen bölgeye geçiş için kullanılmaktadır. Örnek vermek gerekirse; sayfanın en altında iken sayfanın en üstüne veya herhangi bir bölgesine geçiş yapabilmek için bu özelliğin kullanımı kolaylık sağlar. Kullanım biçimi ise şöyledir:

<a href="#Gidilecek Bölge">İlgili Bölgeyi Görmek İçin Tıkla</a> ----- <a name="Gidilecek Bölge">İlgili Bölgenin İçeriği</a>

Mail Bağlantısı Site içi iletişim yöntemlerinden biridir. Link tıklandığında Microsoft’un PC’de tanımlı olan mail gönderme aracı aktif olarak, mail göndermek mümkün olacaktır.

Kullanım yöntemi:

<a href="mailto:[email protected]">Mail atmak isterseniz, tıklayınız.</a>

HTML5 ile etiketine gelen özellikler:

• filename (download) özelliği: Filename özelliği ile kaynağını belirterek, download (indirme) edilmesini istediğimiz nesneleri ilgili kullanıcılara sunabiliriz.

<a href="dosya kaynağı(resim, müzik, video vs.)/url" download="Kayıt İsmi">Bağlantı adı</a>

• media özelliği: iPhone vb. özel cihazlar için tasarlanmış olduğunu belirtmek ve medya aygıtlarının ortamı için kullanılır. Kullanım şekli:

<a href="Kaynak/url" media="Ayarlanmış alan">Bağlantı adı</a>

HTML5 ile desteklenmeyen etiketler:

charset, coords, name, rev, shape özellikleri desteklenmemektedir.

4.yazımız da burada nihayete ermiştir. Talep ve desteklerinizi beklerim.

Hayırlı çalışmalar.

HTML 5 Müfredatı

1. HTML5 Nedir ?
2. HTM5 – Temel Etiketler ve Özel Karakterler
3. Metin Biçimlendirme(Text Formatting)
4. Bağlantı (Link) Yapısı
5. Tablo (Table) Kullanımı
6. Liste(Lists) Kullanımı
7. Form Nesneleri ve Kullanımı ~ 1
8. Form Nesneleri ve Kullanımı ~ 2
9. Audio Kullanımı
10. Video Kullanımı