Bu makalede HTML’de link eklemenin nasıl yapıldığına dair başlıklar ele alınmaktadır.
Link Etiketi
Link etiketi, HTML’de bir bağlantı oluşturmak için kullanılan çok önemli bir etikettir. Bir bağlantı, kullanıcıyı başka bir web sayfasına veya belgeye yönlendirmek için kullanılır. etiketi, bir bağlantının başlatılmasını ve hedef adresini belirtmek için kullanılır. Genellikle şu şekilde kullanılır:
| Örnek: | Kod: |
|---|---|
| Örnek Web Sitesi | <a href=”https://www.example.com”>Örnek Web Sitesi</a> |
Bağlantı etiketinin içine yazılan metin, kullanıcının tıkladığında görünen metni belirtir. Bu metin, genellikle “tıklanabilir” bir şekilde gösterilen bir bağlantıdır. Bağlantı metnini düzenlemek için etiketinin içine yazılan metni değiştirebilirsiniz.
Ayrıca, açılacak olan sayfanın hedefini belirlemek için etiketine hedef özelliği ekleyebilirsiniz. Hedef özelliğini “_blank” olarak ayarlarsanız, bağlantıyı yeni bir tarayıcı sekmesinde açar. “_self” olarak ayarlarsanız, bağlantıyı aynı tarayıcı sekmesinde açar. Örneğin:
- <a href=”https://www.example.com” target=”_blank”>Örnek Web Sitesi</a> (Yeni sekmede açılır)
- <a href=”https://www.example.com” target=”_self”>Örnek Web Sitesi</a> (Aynı sekmede açılır)
Bağlantı etiketini kullanarak, kullanıcıları bir sayfadan diğerine yönlendirebilir, farklı web sitelerine bağlantılar oluşturabilir ve web sayfanızın gezinilebilirliğini artırabilirsiniz.
URL Yapısı
Bir bağlantıya verilen URL, Uniform Resource Locator’ın kısaltması olan URL’nin yapısı ve kullanımı hakkında bilgi verir. Bir web sayfasına veya bir dosyaya bağlantı oluştururken, URL’nin nasıl oluşturulduğunu ve kullanıldığını anlamak önemlidir.
URL’nin yapısı genellikle “protokol://alanadı/klasör/dosya” formatında olur. Protokol, web sayfasında hangi iletişim protokolünün kullanıldığını belirtir. En yaygın olarak kullanılan protokoller arasında HTTP ve HTTPS bulunur. Alan adı, bağlantı vermek istediğiniz web sitesinin adını temsil eder. Klasör, web sitesindeki belirli bir klasörü hedeflemek istediğinizde kullanılır. Dosya ise hedeflemek istediğiniz belirli bir dosyayı temsil eder.
Örneğin, “http://www.ornekweb.com/anasayfa.html” URL’si, HTTP protokolünü kullanan “www.ornekweb.com” alan adına ve “anasayfa.html” dosyasına bağlantı sağlar. Benzer şekilde, “https://www.ornekweb.com/galeri/foto1.jpg” URL’si, HTTPS protokolünü kullanan “www.ornekweb.com” alan adındaki “galeri” klasöründe yer alan “foto1.jpg” dosyasına bağlantı verir.
Bir URL’deki tüm bileşenler doğru bir şekilde belirlenmeli ve yazılmalıdır. Bunlar arasındaki hatalar, bağlantının doğru bir şekilde çalışmamasına neden olabilir. Ayrıca, ilgili web sitesinin alan adı ve dosya adı doğru bir şekilde yazılmalıdır. Aksi halde, yanlış bir adres veya dosya bağlantısıyla sonuçlanabilir.
URL yapısını anlamak, doğru bağlantılar oluşturmanıza ve web sayfaları arasındaki ilişkileri kurmanıza yardımcı olur. Bu sayede, ziyaretçilere kullanıcı dostu ve etkileşimli bir deneyim sunabilirsiniz.
Absolut URL
Web sitenizden farklı bir web sitesine bağlantı vermek için Absolut URL‘leri kullanabilirsiniz. Absolut URL, tam URL adresini kullanarak bağlantı yapmanıza olanak sağlar. Bu, okuyucularınızı başka bir web sitesine yönlendirebilmeniz için bir fırsat sunar.
Absolut URL, web sitesinin tam yolunu içeren bir bağlantıdır. Örneğin, “https://www.example.com” bir absolut URL’dir. Bu URL’yi kullanarak, bağlantınızın hedefini tam olarak belirtmiş olursunuz. Okuyucularınız tıkladıklarında, belirttiğiniz web sitesine yönlendirilirler.
Bağlantı oluştururken Absolut URL’yi şu şekilde kullanabilirsiniz:
| <a href=”https://www.example.com”>Örnek Bağlantı</a> |
Yukarıdaki örnekte, “Örnek Bağlantı” adlı bir metin belirleyerek <a> etiketi ile bir bağlantı oluşturuyoruz. href özelliğine absolut URL’mizi ekliyoruz. Bu şekilde, okuyucularınız tıkladıklarında doğrudan belirttiğiniz web sitesine yönlendirilecektir.
Absolut URL’leri kullanarak, farklı web siteleriyle kolayca bağlantı kurabilir ve okuyucularınızı farklı kaynaklara yönlendirebilirsiniz.
Http ve Https
HTTP ve HTTPS, internet üzerinde veri alışverişi yapmak için kullanılan iki farklı iletişim protokolüdür. HTTP, “Hypertext Transfer Protocol” anlamına gelir ve web tarayıcıları aracılığıyla sunucudan istemciye bilgi aktarmak için kullanılır. HTTPS ise HTTP’nin güvenli bir sürümüdür, “Hypertext Transfer Protocol Secure” anlamına gelir.
HTTP, web sitelerindeki verileri açık bir şekilde aktarır ve şifreleme kullanmaz. Bu nedenle, HTTP tabanlı bir web sitesinde gerçekleştirilen tüm veri alışverişi açıktır ve kötü niyetli kişiler tarafından kolayca okunabilir. Örneğin, kullanıcı adları, şifreler veya kredi kartı bilgileri gibi hassas veriler HTTP üzerinden iletilirse, bu bilgiler kolayca ele geçirilebilir.
- HTTP, güvenlik gerektirmeyen veya hassas olmayan web sitelerinde tercih edilir.
- HTTPS ise özel bilgilerin aktarıldığı, ödeme yapılan veya gizlilik önemli olan web sitelerinde kullanılır.
HTTPS protokolü, verilerin şifrelenmiş bir şekilde aktarılmasını sağlar. Bu şifreleme süreci, internet trafiğini dinlemeye çalışan kişilerin bilgileri okumasını zorlaştırır veya engeller. Kısacası, HTTPS protokolü, kullanıcıların verilerinin güvende olmasını sağlar ve web sitelerinin daha güvenilir bir şekilde kullanılmasına olanak tanır.
FTP Bağlantısı
=FTP protokolü ile dosya indirme veya yükleme için nasıl bir bağlantı kurulduğu.
FTP (File Transfer Protocol), dosya indirme veya yükleme işlemleri için kullanılan bir iletişim protokolüdür. HTML’de FTP bağlantısı kurmak için etiketi ve href özelliği kullanılır. FTP bağlantısında, kullanıcı adı ve şifre gibi kimlik bilgileri ile birlikte sunucu adı veya IP adresi ve dosya yolu belirtilir.
Bir FTP bağlantısı örneği şu şekilde görünebilir:
Dosya İndir/Yükle
Yukarıdaki örnek, kullanıcı adı “kullaniciadi”, şifre “sifre”, sunucu adı veya IP adresi “ftp.sunucuadi.com” ve dosya yolu “/dosyayolu” olarak belirlenmiş bir FTP bağlantısını göstermektedir. Bu bağlantı üzerinden dosya indirme veya yükleme işlemi gerçekleştirilebilir.
Bu şekilde HTML’de FTP bağlantısı kurarak, dosyaların web sitesine kolayca yüklenmesi veya indirilmesi sağlanabilir. FTP bağlantısı, dosya paylaşımı veya güncelleme gibi amaçlarla sıklıkla kullanılan bir yöntemdir.
Relatif URL
Bir bağlantının mevcut web sitesi içindeki diğer sayfalara verilmesi, relatif URL kullanılarak gerçekleştirilir. Relatif URL, tam URL yerine, bağlantının nerede konumlandığına bağlı olarak oluşturulur. Bu sayede, web sitesi içindeki sayfalara yapılan bağlantılar daha kolay ve esnek bir şekilde oluşturulabilir.
Relatif URL, temel olarak iki farklı şekilde kullanılabilir. Birinci yöntem, bağlantıya göreli bir yol belirtmek için kullanılır. Örneğin, mevcut sayfanın URL’sinden bir hedef sayfaya bağlantı vermek için, “../” gibi bir göreli yol kullanılabilir. Bu, bir üst dizine çıkarak hedef sayfaya erişim sağlar.
İkinci yöntem ise, mevcut sayfadan tam olarak belirtilen bir konuma bağlantı vermek için kullanılır. Örneğin, mevcut sayfadaki bir belirteç veya ID’ye doğrudan bağlantı vermek için “#” simgesi kullanılabilir. Bu, kullanıcının sayfanın belirli bir bölümüne hızlı erişim sağlamasına olanak tanır.
Bağlantı yapısı ve içeriği dikkatlice planlandığında, relatif URL kullanarak web sitesi içindeki diğer sayfalara bağlantı vermek daha kolay ve daha organize bir şekilde gerçekleştirilebilir.
Link Metni
Link Metni
Bir bağlantıda görünen metni belirlemek ve düzenlemek oldukça önemlidir. Bağlantı metni, kullanıcılara ne tür içeriğin bulunduğunu anlatarak ve tıklama isteği uyandırarak web sitenizin etkisini artırabilir. İyi bir bağlantı metni, kullanıcıların ilgisini çekerek, daha fazla tıklama elde etmenizi sağlayabilir.
Bir bağlantının metnini belirlerken dikkate almanız gereken bazı stratejiler vardır:
- Anlaşılır olun: Bağlantı metni, kullanıcılara nereye tıkladıklarını anlatmalıdır. Anlaşılır ve açık bir şekilde ifade edilen metinler, kullanıcıların beklentilerini karşılayarak tatmin edici bir deneyim sunar.
- Kısa ve öz olun: Bağlantı metni kısa ve öz olmalıdır. Uzun ve karmaşık metinler, kullanıcıların dikkatini dağıtabilir ve tıklama oranını düşürebilir. Net bir şekilde ifade edilen kısa metinler, okunması kolaydır ve kullanıcıların ilgisini çekebilir.
- Odaklanın: Bağlantı metni, bağlantıya tıklandığında kullanıcının nelerle karşılaşacağını doğru bir şekilde anlatmalıdır. Kullanıcılar, doğru ve ilgili içeriklere yönlendirildiklerinde daha fazla memnuniyet yaşarlar.
Bağlantı metnini düzenlerken de bazı unsurları göz önünde bulundurmalısınız:
- Renklendirme: Bağlantı metni genellikle farklı bir renkle vurgulanır. Sitenizin tasarımına uygun bir renkle metni belirleyerek, kullanıcıların bağlantıyı daha kolay fark etmelerini sağlayabilirsiniz.
- Biçimlendirme: Bağlantı metni için HTML etiketlerini kullanabilirsiniz. Bold, italik veya altı çizili gibi biçimlendirme seçenekleri, metni vurgulamak için kullanılabilir.
- Teşvik edici olun: Bağlantı metnini ilgi çekici ve teşvik edici hale getirmek, kullanıcıların tıklama isteğini artırabilir. Örneğin, “Hemen satın al!” veya “Daha fazla bilgi edinin!” gibi ifadeler kullanarak kullanıcıların eyleme geçmelerini sağlayabilirsiniz.
Bağlantı metnini doğru bir şekilde belirlemek ve düzenlemek, web sitenizin kullanıcı deneyimini iyileştirebilir ve organik trafik elde etmenize yardımcı olabilir.
Metin Biçimlendirme
Bağlantı metnini biçimlendirmek için HTML etiketleri kullanabilirsiniz. Bu etiketler, bağlantının görünümünü ve stilini düzenlemenize olanak sağlar. İşte bağlantı metnini biçimlendirmek için sık kullanılan HTML etiketleri:
| Etiket | Açıklama |
|---|---|
<b> |
Metni kalın yapar, bir vurgu oluşturur. |
<i> |
Metni eğik yapar, bir vurgu oluşturur. |
<u> |
Metni altı çizili yapar, bir vurgu oluşturur. |
<del> |
Metni üstü çizili yapar, bir vurgu oluşturur. |
<sup> |
Üstsimge ekler, metnin üstünde küçük bir karakter gösterir. |
<sub> |
Altsimge ekler, metnin altında küçük bir karakter gösterir. |
Bu etiketleri bağlantı metni etrafına yerleştirerek istediğiniz biçimlendirmeyi elde edebilirsiniz. Örneğin, kalın bir bağlantı metni için <b>Kalın bağlantı metni</b> etiketlerini kullanabilirsiniz. Metninizi daha görsel hale getirmek veya dikkat çekmek için farklı etiketleri bir arada kullanabilirsiniz.
Ayrıca, bağlantı metnini bir liste içinde kullanabilirsiniz. Aşağıdaki örnekte, bağlantı metni bir sıralı liste içinde gösterilmektedir:
- Başlık 1
- Başlık 2
- Başlık 3
Liste etiketlerini kullanarak bağlantınızı sayılar veya madde işaretleriyle daha organize bir şekilde sunabilirsiniz. Bu şekilde bağlantı metnini daha anlaşılır hale getirerek okuyucuların dikkatini çekebilirsiniz.
Resim Bağlantısı
Resim bağlantısı, bir resme tıklandığında kullanıcıyı belirli bir bağlantıya yönlendirmek için kullanılan bir yöntemdir. HTML’de resim bağlantısı oluşturmak için etiketi kullanılır ve resim etiketi () içine yerleştirilir. Böylece resmi tıkladığınızda ilgili bağlantıya yönlendirilirsiniz.
Bir resim bağlantısı oluştururken etiketi içine etiketi yerleştiririz. Örneğin:
<a href="https://www.example.com"> <img src="resim.jpg" alt="Resim Açıklaması"></a>
Bu örnekte, resmin kaynağı “resim.jpg” olarak belirtilmiştir ve resme bir alternatif açıklama (“alt” özelliği) eklenmiştir. Bu, resim yüklenmediğinde görüntülenecek metni temsil eder. etiketi içindeki “href” özelliği ise bağlantının hedefini belirtir.
Resim bağlantısı oluştururken, resmin boyutunu belirlemek ve hizalamak için CSS’yi kullanabilirsiniz. Ayrıca, bir resmi tıkladığınızda yeni bir pencere veya mevcut pencerede açılmasını sağlamak için “target” özelliğini kullanabilirsiniz. Örneğin:
<a href="https://www.example.com" target="_blank"> <img src="resim.jpg" alt="Resim Açıklaması"></a>
Bu örnekte, “target” özelliğine “_blank” değeri verilmiştir, bu da bağlantının yeni bir sekmede açılacağı anlamına gelir.
Resim bağlantısını kullanarak, kullanıcıları çekici ve ilgili içeriğe yönlendirebilir ve web sitenizin trafiğini artırabilirsiniz.
Hedef Özelliği
Bir bağlantının nerede açılacağını belirlemek için hedef özelliği kullanılır. Hedef özelliği, bir bağlantının yeni bir pencerede veya mevcut pencerede açılmasını sağlar. Bu özellik, kullanıcılara hangi pencerede içeriğin görüntüleneceğini belirleme imkanı sunar.
Bir bağlantının hedef özelliğini belirlemek için “target” özelliği kullanılır. “target” özelliğine atanan değerler, bağlantının nasıl açılacağını belirler. En yaygın kullanılan değerler “_blank” ve “_self” dir.
“_blank” değeri kullanıldığında, bağlantı yeni bir tarayıcı penceresinde açılır. Bu, kullanıcının mevcut sayfada kalmasını sağlar ve bağlantıya tıkladığında farklı bir pencereye yönlendirilir. Örneğin, bir kullanıcı bir web sitesinde dolaşırken, ürün ayrıntılarına gitmek için bir bağlantıya tıklarsa, ürün ayrıntıları yeni bir pencerede açılır ve kullanıcının mevcut sayfada kalmaya devam etmesini sağlar.
“_self” değeri kullanıldığında, bağlantı mevcut pencerede açılır. Bu da yeni bir pencere açılmadan mevcut pencerede navigasyona devam edileceği anlamına gelir. Örneğin, bir web sitesindeki ana menüdeki bir bağlantıya tıkladığınızda, ilgili sayfa mevcut pencerede yüklenecektir.
_blank ve _self
Hedef özelliği, bir bağlantının nerede açılacağını belirlemek için kullanılan bir özelliktir. HTML’de hedef özelliği için yaygın olarak kullanılan değerlerden ikisi, “_blank” ve “_self”dir. Bu iki değer arasında bazı farklılıklar vardır ve her birinin farklı kullanım örnekleri bulunmaktadır.
“_blank” değeri kullanıldığında, bağlantının yeni bir tarayıcı penceresinde açılmasını sağlar. Yani, kullanıcı mevcut web sayfasından ayrılmadan bağlantıya tıklayabilir ve yeni pencerede hedef web sitesini görüntüleyebilir. Bu özellik özellikle dış bağlantılar için tercih edilir, çünkü kullanıcıları mevcut web sitesinden hemen çıkarmaz.
Öte yandan, “_self” değeri kullanıldığında bağlantı, mevcut tarayıcı penceresinde açılır. Yani, kullanıcı tıkladığında mevcut web sayfasının yerine hedef web sitesi görüntülenir. Bu özellik genellikle iç bağlantılar veya bağlantılar arasında gezinme için kullanılır.
Özetlemek gerekirse, “_blank” ve “_self” değerleri arasındaki fark, bağlantının yeni bir pencerede mi yoksa mevcut pencerede mi açılacağını belirlemektir. “_blank” dış bağlantılar veya bağlantılardan ayrılmadan yeni bir pencerede gezinmek için kullanılırken, “_self” iç bağlantılar veya gezinme için mevcut pencerede açmak için kullanılır.
