4 - Linkler

-4-
HTML Etiketleri
ve
Parametreleri
Öğr. Gör. Aslan BALAN
Harran Üniversitesi,
Viranşehir MYO
KONU BAŞLIKLARI
 Link Etiketleri
 Başka Web Sitesine Yönlendirme
 Aynı Sitede Sayfalar Arası Yönlendirme
 Aynı Sitede Sayfa İçi Başlığa Yönlendirme
 Mail’e Yönlendirme
 Dosya, Resim Vb.. Link Vererek Yönlendirme
Link Etiketleri
 Bağlantı anlamına gelen link kelimesi sayfalar

arası ilişkilendirme yapmak için kullanılır.
 Link Etiketlerinin farklı kullanımları vardır.
Bunlar, başka web sayfasına yönlendirme
linki,sayfalar arası link, Sayfa içi link, mail linki
gibi 4 temel link çeşidi vardır.
 Fakat istenildiğinde bir resme veya tek bir
harfe bile link verilebilinir.
Link Etiketleri
Başka Web Sitesine Yönlendirme Linki
 Tasarımı yapılan bir site için,

farklı bir sitedeki sayfaya ulaşmak için link etiketine
başvururuz.
 Bu etiketi kullanabilmek için <a>……..<a> etiketini
kullanırız.
 Temel Kullanımı Şu şekildedir:
<a href=“protokol:adres”>Gözükecek Metin</a>
Link Etiketleri
Başka Web Sitesine Yönlendirme Linki
 Örnek:
<a href=“www.harran.edu.tr” > Harran Ana Sayfası </a>
 Örnek:
<html>
<head>
<title>Web Tasarım Dersleri Linkler Link Verme Ders 11</title>
</head>
<body>
<a href=”http://www.harran.edu.tr”> Harran Ünv
Anasayfası</a>
</body>
</html>
Link Etiketleri
Başka Web Sitesine Yönlendirme Link Parametreleri
 Bazen Linklerimizi, ayrı bir pencerede veya bir

Frameset içerisinde bir Frame'de açmak
isteyebiliriz... İşte o zaman TARGET yani hedef
çerçeve parametresini kullanabiliriz. Örnek ile
göstermek gerekirse;
 Örnek:
<a href="http://www.harran.edu.tr"
TARGET="_blank">Harran Ünv Ana Sayfası</a>
Bu örnek de şuan ki sayfamız açık kalacaktır ve
Harran Ünv Ana Sayfası Yeni pencerede açılacaktır.
Link Etiketleri
Başka Web Sitesine Yönlendirme Link Parametreleri
 TARGET parametresinin aldığı özellikler şunlardır;

_blank = Bu özellik hedef linkimizi yeni boş bir sayfada
açar.
_self = Bu özellik hedef linkimizi aynı pencerede veya
Frame'de açmamızı sağlar.
_parent = Bu özellik, hedef linkimizi eğer bi Frameset
kullanmışsak o frameset içerisinde açar. Eğer frame
kullanmamışsak _self'le aynı sonucu verir. Yani kendisinde
açar...
_top = Bu özelliğimiz ise, Self ve Parent'a benzer. Eğer bir
Frameset içeren sayfada kullanılırsa, bu Frameset'i yok
sayar ve aynı sayfada açar. Eğer Frameset
kullanılmamışsa, Self'le aynı neticeyi verir. Yani kendisinde
açar.
Link Etiketleri
Aynı Sitede Sayfalar Arası Link Etiketi
 Sayfalarımızda menülerimiz aracılığıyla diğer

sayfalarımızda gezinebiliriz.
 Veya sayfa içinde herhangi bir yazı, resim, harfe
link vererek sayfalarımız arasında bağlantı
kurabiliriz.
 Bunu yapabilmek için ilk başlıkta olduğu gibi temel
link verme etiketini kullanırız.Yani;
<a href=”index.html”>Ana Sayfa</a>
yada
<a href=”urunler.html”>Ürünler</a>
Link Etiketleri
Aynı Sitede Sayfalar Arası Link Etiketi
 Örnek:
<html>
<head>
<title>Web Tasarim Dersleri Sayfa Içi Link verme
</title>
</head>
<body>
<a href=”index.html”>Ana Sayfa</a> |
<a href=”urunler.html”>Ürünler</a> |
<a href=”iletisim.html”>Iletisim </a>
 
Bu Sayfa Sitemizin Ana Sayfasidir…
</body>
</html>
Link Etiketleri
Aynı Sitede Sayfa İçi Başlığa Yönlendirme Link Etiketi
 Bazen başka bir sayfaya gitmek yerine aynı sayfa

içinde linklerle gezinmekte gerekebilir. Buna Sayfa
İçi Başlığa Link Verme denilir.
 Örneğin sayfanızın sonunda adres bilgisi var.
Sayfanızın başından tıklandığında bu adresin
bulunduğu yere gelinmesini istiyorsunuz. Şunu
yapmalısınız. Adres'in yazıldığı yere bir isim
vermelisiniz. Sonra sayfanın başında o isme
bağlanan bir link yapacaksınız.
Link Etiketleri
Sayfa İçi Başlığa Link Etiketi
 Sayfa içi link 2 aşamadan oluşur.
 Bunlardan biri sayfanın bir yerine (gidilecek yer) isim

vermek.
 İkincisi ise oraya gitmek için bir link yazmak (nereye

tıklayınca gidilecek)
Link Etiketleri
Sayfa İçi Başlığa Link Etiketi
 AŞAMA 1.
 Sayfanın bölgelerime İSİM VERMEK.
uzun bir sayfanız olsun. İçinde de konu başlıkları. Bu
başlıklara isim verebilrsiniz
 Örnek:
<a name=”baslik1”>
..
..
..
..
..
..
gördüğünüz gibi istediğiniz yere isim verebiliyorsunuz.
Link Etiketleri
Sayfa İçi Link Etiketi
o AŞAMA 2.
 Şimdi ise verdiğimiz isimlere/yerlere gidecek LİNK
YAZMAK
o Örnek:
<a href=”#baslik1”> Başlık 1 e Gitmek için tıklayınız </a>
böylece eğer 1 tıklarsak sayfımızda baslik1 olarak

isimlendirdiğimiz yere gidecek. 2ye tıklarsak baslik2
ye gidecek.
Dilediğiniz gibi sayfanızı düzenleyebilirsiniz.

Link Etiketleri
Sayfa İçi Link Etiketi
o AŞAMA 1 ve AŞAMA 2 birlikte Örnek Gösterimi:
<html>
<head>
<title>Web Tasarım Dersleri Linkler Link Verme Ders 11</title>
</head>
<body>
<a href="#baslik1"> Başlık 1 e Gitmek için tıklayınız </a> 
<a href="#baslik2"> Başlık 2 e Gitmek için tıklayınız </a> AŞAMA 2
<a href="#baslik3"> Başlık 3 e Gitmek için tıklayınız </a> 
<a name="baslik1">
………….
………….
<a name="baslik2"> AŞAMA 1
………….
………….
<a name="baslik3">
…………..
…………..
</body>
</html>
Link Etiketleri
Mail Link Etiketi
o Bazen Sitelerimize mail adresi eklemek isteyebiliriz.

Ve bu mail adresini veya adreslerini eklerken
ziyaretçiye kolaylık olsun diye mail adreslerine link
verebiliriz.
o Ziyaretçimiz mail adresinin üstünü tıkladığında; o
bilgisayardaki aktif olarak kullanılan ve
yapılandırılmış olan e-mail programı açılır ve kime
bölümünde etiket içerisinde yazılan adres gözükür.
o Mail etiketinin kullanım şekli şu şekildedir:
<a href=“mailto:e-mail adresi”> Görüntülenmesi istenen metin </a>
Örnek:
<a href=“mailto:aslan.balan@hotmail.com”>Aslan BALAN (mail) </a>
Link Etiketleri
Dosya, Resim vb. Link Verme Etiketleri
o Sitelerimize resim, mp3, dosya vb. gibi harici

multimedia ve kaynaklara link verme ihtiyacı
duyduğumuzda, bunun için dikkat etmemiz
gereken çok ufak detaylar vardır. Bunları örnekler
üzerinde açıklamak istersek;
o Örnek
 <a href =”deneme. doc”> dosyayı indir </a>
Html sayfasının bulunduğu dizinde kayıtlı bir Word dokümanına link
vermiş olduk. Tıkladığımızda bu dokümanı açmak ya da indirmek
üzere bir pencere çıkar
 <a href=”ftp://ftp.harran.edu.tr\deneme.doc”>Dosyaları ftp ile
indir.</a>
Bu şekilde link verirsek indirmek istediğimiz dosyayı ftp kullanarak
indirebiliriz.Tıkladığımızda bilgisayarımızda yüklü olan ve varsayılan ftp
programı açılacaktır.ve bu programdan ilgili dosyayı
indirebiliriz.
Link Etiketleri
Dosya, Resim vb. Link Verme Etiketleri
o Örnek (Devam)
 <a href="Sarki.MP3">Şarkıyı Download Etmke İçin Tıklayınız...</a>
Ya da
 <a href="Dosya.zip">Programı Download Etmek İçin Tıklayınız...</a>
Burda linkler tıklandığında .mp3 uzantılı veya .zip uzantılı dosyaları
indirilecektir.
 <a href=”deneme. htm”> <img src=”kedi. jpg”> </a>

Bu örnekte kedi resmine tıkladığımızda deneme.htm sayfasını
açacaktır.
Peki resme tıklayıp başka bir resim açmak istiyorsak ne yapmalıyız?
<a href=”aslan. jpg”> <img src=”kedi. jpg”> </a>

Bu örnekte sayfada gösterilen kedi resmine tıkladığımızda bir aslan
resmi açılacaktır.

4 - Linkler

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

4 - Linkler

Uploaded by

Copyright:

Available Formats

-4-

 Bağlantı anlamına gelen link kelimesi sayfalar

 Tasarımı yapılan bir site için,

 Bazen Linklerimizi, ayrı bir pencerede veya bir

 TARGET parametresinin aldığı özellikler şunlardır;

 Sayfalarımızda menülerimiz aracılığıyla diğer

 Bazen başka bir sayfaya gitmek yerine aynı sayfa

 Sayfa içi link 2 aşamadan oluşur.

 Bunlardan biri sayfanın bir yerine (gidilecek yer) isim

 İkincisi ise oraya gitmek için bir link yazmak (nereye

böylece eğer 1 tıklarsak sayfımızda baslik1 olarak

Dilediğiniz gibi sayfanızı düzenleyebilirsiniz.

o Bazen Sitelerimize mail adresi eklemek isteyebiliriz.

o Sitelerimize resim, mp3, dosya vb. gibi harici

 <a href=”deneme. htm”> <img src=”kedi. jpg”> </a>

Peki resme tıklayıp başka bir resim açmak istiyorsak ne yapmalıyız?

<a href=”aslan. jpg”> <img src=”kedi. jpg”> </a>

You might also like