a HTML
Çalışkanlığınız için sizi tebrik ederim. Hemen derse geçmek istiyorum.Geçen hafta başladığımız gazetelere linklerin olduğu websitesinin (www.gazeteler-e.gen.tr) yapımına devam edelim.
Renkler, web tasarımı yapan bizler için vazgeçilmezdir.
Gördüğümüz rengin kodunun ne olduğunu bilmek için çok kullanışlı olan bir program kullanacağız.
Programı yapıp ücretsiz kullanıma sundukları için www.nattyware.com sitesinin sahiplerine teşekkür ederim.
Download Pixie Yandaki linke tıklayıp indiriniz;
Yukarıdaki download linke tıkladıktan sonra gelen ekrandan kaydete tıklayın.
Aşağıdakine benzer bir ekran gelir.
Gelen ekrandan dosyayı kendi makinanıza kaydedeceğiniz yeri seçiniz.
Masaüstünden (Desktop) başka bir yere kaydettiyseniz lütfen kaydettiğiniz yeri unutmayın!
Kaydeti seçince seçtiğiniz ilgili yere gidip; pixie.zip dosyasını bulunuz.
Paketin içinde pixiesetup.exe yi çalıştırın
Bilgisayarınızdaki sıkıştırılmış dosyaları açamıyorsanız (program kurulu değilse) www.winzip.com 'dan indirebilirsiniz.
Gelecek olan ekranda size kurulumun yapılacağı yer otomatik olarak belirlenmiş olarak gelir.
Farklı bir yere kurulum yapmayacaksanız (gerek olmadıkça başka bir yere kurmayınız!) Install butonuna tıklayabilirsiniz.
Kurmakta olduğumuz program bize beğendiğimiz renklerin renk kodlarını verecek.
Sevdiğimiz renklerin yanında renk uyumunu sağlamayabilmek için resimlerin renk kodlarını elde etmek için de pixie yi kullanacağız.
Kurulum sonrasında ufak ve kullanışlı pixie programımızı çalıştıralım (Run Pixie ye tıklayınız)
Gazeteler-e linkler sitemizin logosunda kullanılan sarı rengin kodunu elde edeceğiz.
Ekrandan renk alma programını (pixie) çalıştırdığınızda aşağıdaki gibi bir ekran gelir.
www.gazeteler-e.gen.tr nin 16 Temmuz 2006 22:21 deki görüntüsü
yukarıdaki görüntüyü veren html kodları aşağıdaki gibidir:
<html>
<head>
<title>Türkçe gazeteler, yerel ve ulusal gazeteler</title>
</head>
<body>
<img src="gazetelere-link-logo.jpg" border=0>
<u> <h4> Ulusal Gazeteler : </h4> </u>
Akşam | Bugün | Cumhuriyet | Dünya | Evet | Evrensel | Fanatik | Fotomaç | Güneş | Tercüman | Hürriyet | Kurultay | Milli Gazete | Milliyet | Ortadoğu | Radikal | Sabah | Star | Takvim | Türkiye | Vakit | Vatan | Yeni Asya | Yeniçağ | Yeni mesaj | Yeni Şafak | Zaman
<h4> <u> Yerel Gazeteler : </u> </h4>
</body>
</head>
Html kodlarına dikkat ettiyseniz birinde u etiketi h4 etiketinden önce açılıp kapatılmış diğerinde ise tersi sözkonusu.
İki şekilde doğru kodlamadır. Önce açılan etiket kapatılmadan sonraki açılan etiket kapatılsaydı YANLIŞ OLURDU.
Örenğin şu şekilde olsaydı yanlış olurdu:
<u> <h4> Ulusal Gazeteler </u> </h4> Burada iki etiket birbirini kestiği için hatalı bir html sözkonusudur.
Yukarıdaki görüntüyü oluşturabilmeniz için html dosyanızla aynı yere logoyu kaydetmeniz gerekiyor.
Kaydetmek için www.gazetler-e.gen.tr yi açtığınızda logonun üzerine sağ tıklayın ve gelen menüden resmi farklı kaydeti seçin.
Kaydedilecek yeri seçin ve dosyanın adını belirtip kaydetme işlemini tamamlayın.
Unutmayın çalışma yaptığınız dosya ile aynı yerde olmassa şu şekilde bir görüntünüz olur:
pixie ile aldığımız sarı rengin kodunu (F7F79D) body tagının bgcolor özelliğinde kullanacağız.
<body bgcolor="#F7F79D">
Şimdi a etiketine geçip sitedeki gazetelere link vereceğiz.
Anchor = Gemilerin demirlemek için attıkları çapa anlamına geliyor. Yani bağlantı sağlamak.
href : A html etiketinin href özelliği bağlantı sağlanacak URL 'in (adres) yada bağlantı sağlanacak noktanın belirtilmesi içindir.
Bağlantı verilecek web sayfası kendi sitemiz dışında ise http://www.siteninadi.com/ ile başlamalıdır. daha sonra da sayfa adı olmalı.
kendi web sitemizdeki bir sayfaya link vermek için <a href="sayfaninadi.html"> 2. HTML Dersi </a> şeklinde kullanmalıyız.
Bir başka siteye link verirken bir web sayfasının adı belirtilmemişse o sitenin anasayfasına bağlantı (link) verilmiş olur.
örneğin href="http://www.websiteleri.gen.tr"
eğer www.websiteleri.gen.tr deki bir sayfaya link vereceksek o durumda da
href="http://www.websiteleri.gen.tr/bilgisayar/web-yazilim.php" şeklinde verebiliriz.
Burada web-yazilim.php dosyası bir klasörün içinde (bilgisayar klasörünün içinde)
eğer bilgisayar klasörünün içinde olmasaydı ....gen.tr/web-yazilim.php şeklinde olacaktı.
Özet olarak şunları söyleme çalıştım:
href 'in alabileceği değer bir dosya adı olabilir (ikinciders.html)
href 'in alabileceği değer bir sitenin adresi olabilir (http://www.websiteleri.gen.tr)
href 'in alabileceiği değer bir sitedeki herhangi bir dosya olabilir (http://www.websiteleri.gen.tr/htmldersleri.html)
href 'in alabileceği bir diğer değeri sonraki dersimize bırakıyorum.
Şu anda www.gazeteler-e.gen.tr deki gazete isimlerine linkler (bağlantılar) verilmiş şekilde
www.gazeteler-e.gen.tr nin şu anki (19 temmuz 2006 01:14) durumunu görmek için buraya tıklayınız;
Daha sonra açılan sayfadaki boş bir yere sağ tıklayın.
Gelen menüden kaynağı görüntüle seçeneğini seçip sayfanınhtml kodlarını inceleyin.
HTML dersine katıldığınız için teşekkür ederim.
Sizin ödeveniz şu olsun internette sörf yaparken bazı sitelerde kaynağı görüntüle (view source) yaparak gelen kodu şöyle bir gözden geçirmeniz.
