Web Tasarım ve Programlama Eğitimler-2 / Siteye Link Ekleme ve Hedef Kullanımı

  Merhaba arkadaşlar. Web tasarım ve programlama eğitimlerimize ikinci yazımız ile devam ediyoruz. Bu yazımızda link ekleme ve hedef kullanım konularını işleyeceğiz.          Eğer ilk yazıyı okumadıysanız “buradan” ulaşabilirsiniz. Faydalısı olması dileğiyle keyifli okumalar…

1)Siteye Link Ekleme

Tasarlayacağımız siteye link eklerken “<a href “ kodunu kullanacağız. Bu kodun nasıl çalıştığını aşağıda ki resimde görebilirsiniz. Dosyalarınızı ilk yazımda bahsettiğim gibi ilk başta “html” olarak kaydetmeyi unutmayın.

 

Bu kodu yazıp kaydettikten sonra sitenizde aşağıda ki gibi bir link gözükecek. Linke tıkladığınızda sizi Industryolog Akademi sayfasına götürecektir.

 

Eğer eklemiş olduğunuz site linkini farklı bir sekmede açmak istiyorsanız aşağıda resimde görüldüğü gibi “target=_blank” kodu eklemeniz yeterli olacaktır.

 

2) Site İçinde Bölümler Arası Geçiş

Site tasarımında; sitenizin içinde kodlar artıkça daha karmaşık hale gelecektir. Ziyaretçiler trafaından  daha anlaşılır ve site içinde daha rahat bölümler arası geçiş sağlamak için kodlara “<id>” kodunu aşağıda ki resimde görüldüğü gibi ekleyeceğiz. Resimde ben <br>” kodunu kullanarak site içinde büyük boşluk bıraktım. 

 

 

Kodu bu şekilde yazarsanız siteniz aşağıdaki resimde ki gibi görünecektir. “Bolum 2 ye gitmek icin tiklayin” yazısına tıklarsanız sizi direk Bolum 2 ye atacaktır. Bunu bir nevi kitap içinde içindekiler kısmına direk geçiş olarak düşünebiliriz.

 

3)Hedef Tanıtım Kullanımı

Aşağıda ki resimde de görüldüğü üzere “&” yazdığınızda birden fazla seçenek önümüze geliyor. Bunlar hedef tanıtım kodlarıdır. Örneğin:

&nbsp; boşluk bırakmak için kullanılır.

&lt; küçüktür işareti için kullanılır

&gt; büyüktür işareti için kullanılır 

 

Normade “<p>” kodu ile yazdığım yazılar sola dayalı bir şekilde sitede gözüküyordu ama aşağıda ki resimde de  gördüğünüz gibi  “&nbsp” kodu ile yazımı solunda istediğim kadar boşluk bırakabildim. 

 

 

 

Şimdi bu kodun site içinde nasıl göründüğüne bakalım:

 

 Web Tasarım ve Programlama eğitimlerimizden bu haftalık bu kadar.Umarım faydalı olmuştur. Bir sonraki eğitimimizde görüşmek üzere esen kalın…