resime link verme | Barış ÖZCAN Web Tasarım | antalya web tasarım | antalya web tasarımı | Sosyal Medya Danışmanlığı https://www.barisozcan.net Fri, 03 Dec 2010 18:40:54 +0000 tr hourly 1 https://wordpress.org/?v=6.9.4 Web Tasarım Dersleri linkler Yazılara ve Resimlere Link Verme https://www.barisozcan.net/web-tasarim-dersleri-linkler-yazilara-ve-resimlere-link-verme https://www.barisozcan.net/web-tasarim-dersleri-linkler-yazilara-ve-resimlere-link-verme#comments Fri, 03 Dec 2010 18:40:54 +0000 http://www.barisozcan.net/?p=736 Metinlere (Yazılara Link Verme)

Yazılara lşnk verebilmek için değerli arkadaşlar ve href parametresini ne tür link olursa olsun kullanmak zorunda olduğumuzu unutmayın iyi ezberleyin bol bol uygulama yapın ilk uygulamamızı buyrun aşağıda yapalım açalım not defterimizi aşağıdaki kodları yazıp metinlerelink.html olarak masaüstüne farklı kaydedin.

The post Web Tasarım Dersleri linkler Yazılara ve Resimlere Link Verme first appeared on Barış ÖZCAN Web Tasarım | antalya web tasarım | antalya web tasarımı | Sosyal Medya Danışmanlığı.

]]>

Selamun aleyküm değerli arkadaşlar artık keyifli ve bilgilerimizin iyice arttığı derslere neyin nasıl yapıldığını dha iyi anladığınız derslere girmiş bulunuyoruz bu dersimizde her sitede mutlaka bulanan bağlantılar (linkler) nasıl yapıldığını yazıya veya resime tıklanınca başka sitelere yada sayfaları açmayı öğrenecez

Metinlere (Yazılara Link Verme)

Yazılara link verebilmek için değerli arkadaşlar <a> ve  href parametresini ne tür link olursa olsun kullanmak zorunda olduğumuzu unutmayın iyi ezberleyin bol bol uygulama yapın ilk uygulamamızı buyrun aşağıda yapalım açalım not defterimizi aşağıdaki kodları yazıp metinlerelink.html olarak masaüstüne farklı kaydedin.

<html>
<head>
<title>Web Tasarım Dersleri Linkler Link Verme Ders 11</title>
</head>
<body>
<a href=”http://www.barisozcan.net”> Web Tasarım Dersleri </a>
</body>
</html>

Yukardaki mantığı anlatıyım arkadaşlar < href =”buraya açılacak sayfa yada site”>   Bu kısıma ise yazı yada resim kodu gelecek </a> link bitişi </a> kapatıyoruz bu kadar linkler zor değildir .

Yazılara Link VermeYazılara Link Verme

Sayfadaki Yazıya Tıklayınca Linkte belirtilen adres açılır başka bir siteye link verirken adresta http:// kulanmayı unutmayın şimdi resimlere link nasıl veriliyor onu görelim resim eklemeyi daha önce anlattım ona girmeyecem takılan eski derslerden inceleyebilir.

Resimlere Link verme

Resimlere link vermekte yazılara verilen linkle aynı mantıkta arkadaşlar resime tıklayınca ister bir sayfaya açılır ister resmin büyük halini açabilir isterseniz örnektede yapacağım gibi başka bir site açılabilir hepsindede mantık aynıdır aşağıdaki uygulamayı sizde yapın not defterinizde farklı kaydet diyerek dosya adı resimlerelink.html olarak kaydedin masaüstüne

<html>
<head>
<title>Web Tasarim Dersleri Resimlere Link Verme Ders 11</title>
</head>

<body>
<a href=”http://www.webmasteryolcu.com”> <img src=”gul.jpg”> </a>
</body>
</html>

yukardaki işlemi özetliyalim arkadaşlar <a href=”ile buraya adres yada sayfa uantısı”> buraya ise ister yazı ister bu örnekte olduğu gibi resim kodu link bitti ilk başta açmış olduğum a etiketini kapatmam gerekir </a>

Resimlere Link vermeResimlere Link verme

Evet arkadaşlarım yukardaki resime link verdim linkte belirttiğim adres açılacak dikkat ettiyseniz resi kenarlarında mavi çizgi oluştu onu önlemek için resimlere link verdiğinizde border 0 yapmalısınız.

Sitemizde Sayfa İçi Link Verme

Düşünün 10 tane sayfanız var sitenize giren ziyaretçi ana sayfaya ulaşır diğer sayfalara ulaşmak için sayfa içi linkler ile bunuda çözmüş olacaz arkadaşlar bunun için masaüstüne linkler isminde klasör açın ve not defterimizle aşağıdaki uygulamayı yapalım 3 sayfamız olsun projemiz için

  1. Ana Sayfa
  2. Ürünler
  3. İletişim

3 Sayfa oluşturacaz arkadaşlar sayfalarımızı masaüstüne açtığımız linkler klasörüne kaydedeceğiz hadi buyrun bakalım kodlar aşağıda yer alan kodlar arasında yer alan dik çizgiyi yapabilmek için Alt Gr ile tire çizgisi butonuna basmalasınız.

Bu kodları linkler klasörüne index.html olarak kaydedin

<html>
<head>
<title>Web Tasarim Dersleri Sayfa Içi Link verme 11</title>
</head>

<body>
<a href=”index.html”>Ana Sayfa</a> | <a href=”urunler.html”>Ürünler</a> | <a href=”iletisim.html”>Iletisim </a>
<br><br><br>
Bu Sayfa Sitemizin Ana Sayfasidir…
</body>
</html>

Bu kodları linkler klasörüne urunler.html olarak kaydedin

<html>
<head>
<title>Web Tasarim Dersleri Sayfa Içi Link verme 11</title>
</head>

<body>
<a href=”index.html”>Ana Sayfa</a> | <a href=”urunler.html”>Ürünler</a> | <a href=”iletisim.html”>Iletisim </a>
<br><br><br>
Bu Sayfa Sitemizin Ürünler Tanitim Sayfasidir…
</body>
</html>

Bu kodları linkler klasörüne iletisim.html olarak kaydedin

<html>
<head>
<title>Web Tasarim Dersleri Sayfa Içi Link verme 11</title>
</head>

<body>
<a href=”index.html”>Ana Sayfa</a> | <a href=”urunler.html”>Ürünler</a> | <a href=”iletisim.html”>Iletisim </a>
<br><br><br>
Bu Sayfa Sitemizin Iletisim Bölümüdür …
</body>
</html>

Evet arkadaşlar masaüstüne açtığımız linkler klasörüne 3 adet sayfa hazırladık index.html urunler.html ve iletisim.html şimdi klasöre girip index.html sayfasını çift tıklayıp açın linklere tıklayın sayfalarda geçişi görün .

Sayfa İçi Link vermeSayfa İçi Link verme

Evet arkadaşlar bunuda anladıkta sonra şimdide linklerin açılış şeklini görelim aynı sayfadamı açılsın yeni sayfadamı üstten açılma şekli falan.

Linklerde Target Parametresi Kullanımı

Linkler standart olarak aynı sayfada açılır arkadaşlar örneğin bir arkadaşınızın sitesine link verdiniz ziyaretçi tıkladı arkadaşınızın sitesi açıldı ziyaretçi sizin sitenizden gitti bunu önlemek için yeni pencerede açılmasını sağlayın target parametresi 4 adet değerden oluşur nedir bunlar görelim .

  • target=”self” : Link Verilen Sayfa yada Site Aynı Pencerede Açılır
  • target=”blank” : Açılacak sayfa yada site yeni pencerede açılır
  • target=”top” : self gibi buda aynı pencerede açar tek farkı sayfa üstten başlayarak açılır

Uygulayıp Görelim arkadaşlar Ne İşe Yarıyorlar açıyoruz not defterimizi ve aşağıdaki kodları yazıp linktarget.html olarak masaüstüne kaydedin.

<html>
<head>
<title>Web Tasarim Dersleri Linklerde Target Parametresi 11</title>
</head>
<body>

<a href=”http://www.barisozcan.net” target=”_self”> Webmasteryolcu.com Aynı Sayfada Açılan link </a> <br>

<a href=”http://www.barisozcan.net” target=”_blank”> Webmasteryolcu.com Yeni Pencerede Açılan link </a> <br>

<a href=”http://www.barisozcan.net” target=”_top”> Webmasteryolcu.com Aynı Sayfada Üstten Başlayarak Açılan link </a>
</body>
</html>

Linklerde Target KullanımıLinklerde Target Kullanımı

evet arkadaşlar ekran görüntümüde yukarda ve linkleri burada şimdilik sonlandırıyoru ilerde projemide yine kullanacaz değinecez bugünkü derste bu kadar bir sonraki ders zorlaşacak biraz tablolara girecez hem zor hem keyifli artık site yapmaya adım adım yaklaştınız çok az kaldı arkadaşlar görüşmek üzere Bizi Yaratan Yüce Mevlaya Emanet olun.

Gelen aramalar :

The post Web Tasarım Dersleri linkler Yazılara ve Resimlere Link Verme first appeared on Barış ÖZCAN Web Tasarım | antalya web tasarım | antalya web tasarımı | Sosyal Medya Danışmanlığı.

]]> https://www.barisozcan.net/web-tasarim-dersleri-linkler-yazilara-ve-resimlere-link-verme/feed 2