HTML Link Verme

00:30 Yazılara Link Verme

01:15 Linki Yeni Sekmede Açtırma

02:00 Resimlere Link Verme

Selamlar,
HTML için, hem yazıya, hem de resimlere nasıl link verebilirsiniz, bu linkleri yeni bir sekmede nasıl açtırırsınız bunu anlatıyor olucam. Sayfanın en altına da, meraklısı için yazıya tıklandığında e-posta açmayı, telefon numarasına link vermek gibi detayları bıraktım.

İlk aşamada HTML link verme için sayfamızın çalışması için gerekli olan kodları yazdığımızı varsayıyorum.

HTML Yazıya Link Verme:

Yazıya, resime veya herhangi bir objeye link vermek için, HTML’de bulunan <a> etiketini kullanmamız gerekiyor.
Kullanıcıyı bir sayfaya yönlendirmek için, <a> etiketinin alması gereken şart olan bir özellik var. Bu özellik href özelliğidir.

<a href="https://emrenogay.com">Emre Nogay</a>

Sayfayı açtırma işlemi tamam ama, bu sayfayı yeni bir sekmede açmak için ne yapmalıyız? Bunun için <a> etiketine 1 özellik daha eklememiz gerekiyor. Bu özelliğimizin adı target. Örnek bir yeni sayfada açma kodu:

<a href="https://emrenogay.com" target="_blank">Emre Nogay</a>

Target özelliğinin alabildiği değerler;

• _blank (Yeni sekmede açar.)
• _self (Varsayılandır aynı sekmede açar.)
• _parent (iFrame kullanırken belgeyi ana frame’de açar.)
• _top (Frame kullanırken sayfayı gövdede açar.)
• frameismi (Adı verilen frame’de açar.)

HTML Resime Link Verme:

Yazıya link verme işlemi ile neredeyse aynı. <a> etiketlerinin arasına <img> etiketini ekleyerek resime link vermiş olacağız. Ben örnek bir resme link verme kodu yazdım:

<a href="https://emrenogay.com"> 
     <img src="tebrikler.jpeg" /> 
</a>

Ben .jpeg uzantılı bir resim belirledim ancak uzantısı fark etmez.

HTML Link Verme Hakkında Tüm Detaylar

<a> etiketinin temel kullanımı yukarıdaki gibidir. Şimdi işin meraklılarına, HTML link verme başka nasıl ve nerelerde kullanılıyor anlatayım.

Eklenebilen diğer nitelikler (attributes):

Özellik Adı	Aldığı değer	Açıklaması
hreflang		Bulunan sayfanın farklı dildeki versiyonu için kullanılır.
download		Tıklandığında içeriği indirmeye zorlar.
target	_blank _parent _self _top frame ismi	Sayfayı farklı türlerde açmanızı sağlar.
title	yazı (string)	Üzerine gelindiğinde ipucu şeklinde kullanıcıya gösterilir.
href	url	Tıklanıldığında yazılan içeriğe yönlendirir.

HREF için Farklı URL Formatları:

Protokol	Değer
Tam Nitelikli	https://siteadi.com veya http://siteadi.com
Esnek	//siteadi.com
Tarayıcı Özel	chrome://settings/
Direkt Giriş	/wp-content/uploads/foo.jpg
JavaScript	javascript:fonksiyon();

HTML Telefon ve Mail Kodu

Yazıya tıklandığında telefon numarasını aratmak için bu kodu kullanın.

<a href="tel:05357418569">Tıkla Ara</a>

Yazıya tıklandığında mail uygulamasını açtırmak için bu kodu kullanın.

<a href="mailto:[email protected]">Tıkla Mail Gönder</a>

<a> etiketi popüler tüm tarayıcılar tarafından desteklenmektedir. Bu bilgiler size yeterli gelmediyse, mozilla blogundan fazla bilgi edinebilirsiniz. Hatalarınızı kontrol etmek maksadıyla, kendi yazmış olduğum HTML hata bulucuyu deneyin. Efenim HTML link verme, kullanıcıyı yönlendirme konumuzun sonuna geldik. Herhangi bir probleminiz olursa yorum kısmından bana sorabilirsiniz. Size yardımcı olmaktan mutluluk duyarım.

Ben Emre Nogay,
Sevgiler.