Siteniz veya blogunuz varsa yayımladığınız yazılarınızda sayfa rengi, yazı rengi, sütunlar, vesaire gibi pekçok biçimlendirmelerin nasıl yapıldığını merak edersiniz. Öğrenmek kolaydır. Yeter ki dikkatlice okuyun.
Okuyup öğrenmekten çekinmeyin hiçbir şeyi gözünüzde büyütmeyin. Hiç bilgisiz bir insan bile benim gibi kodları kurcalaya kurcalaya öğreniyorsa, bilenlerin tariflerini okuyarak öğrenmeyi daha kolay becerebilirsiniz. Size sunulan bilgileri okuyun. Okuyup öğrenmekten korkmayın..
Sadece HTML sayfası içindeki uygulamayla yazı renklendirme nasıl yapılır
Renklendireceğiniz şey tek bir harf, bir kelime, ya da bir paragraf olabilir. Önce renk kodlarına ihtiyacımız var. Meselâ beyaz renk kodu: #FFFFFF kırmızı renk kodu: #FF0000 Renk kodları harflerden, rakamlardan veya harflerin ve rakamların karışık sıralanmasından olur. “o” harfi kullanılmaz ki 0 (sıfır) rakamı ile karıştırılmasın. Renk kodları için şu yazıma bakabilirsiniz: » Renk Kodları
Renk kodu ile yazı renklendirme kodu yapılır. Renklendirilecek harfin, kelimenin veya paragrafın en başına bu kod, sonuna ise ilgili kapatma kodu konur. böylece renklendirilecek yer sınırlanır, renklendirme sadece orası için geçerli olur.
İnternet ve bilgisayar kelimelerini kırmızı yapalım. Aşağıda HTML sayfasındaki görüntüsünün örneği var. Baştaki ve sondaki kodlara dikkat edin:
<font color="#FF0000">İnternet ve bilgisayar</font>
Bu da normal sayfadaki görüntüsü: İnternet ve bilgisayar
Bu bilgi düz yazıların renklendirilmesi hakkındaydı. Linkler bu şekilde renklendirilemez. Nasıl yapılır? Okumaya devam edin.
Sadece HTML sayfası ayarıyla link renklendirme:
Link renklendirme biraz karmaşık. Bu sitemin linkini örnek alarak göstereyim. Önce link nedir üstünde duralım:
http://devletli.com/ sitemin URL’sidir. Bu URL’nin link olması ve siteme gelenlerin URL’yi değil sadece uygun bulduğum kelimeleri meselâ “Benim Site” yazısını görmeleri aşağıdaki gibi kod içinde bulunmasıyla oluyor:
<a href="http://devletli.com/">Benim Site</a>
Gördüğünüz gibi link adlandırmasını “benim site” diye yapmışım. Adlandırmadayı istediğiniz gibi yapmakta özgürsünüz. Değişik kelimeler linki bozmaz. Hatta o kısma isim değil paragraf ya da resim bile koyabilirsiniz. Resim koymak nasıl yapılır başka bir yazımda anlatırım.
Gelelim linki renklendirmeye. Linki nasıl isimlendirmişseniz o isim renkli olacaktır. HTML sayfasındaki link kodunun içine style ayarları koymak gerekiyor.
style="color:#FF0000;" bunu link kodunun içine aşağıdaki gibi koyarsınız:
<a style="color:#FF0000;" href="http://devletli.com/">Benim Site</a>
Ve normal sayfadaki renklendirilmiş görünümü:
Benim Site
Kıyaslayın
Sade kod:
<a href="http://devletli.com/">Benim Site</a>
Sadece HTML sayfası ayarıyla renklendirilmiş kod:
<a style="color:#FF0000;" href="http://devletli.com/">Benim Site</a>
CSS usulüyle yazı renklendirme
Düz yazı ve link renklendirmeleri bu usülde karışık gibi görünüyor. CSS style sayfasında bütün ayar kodlamaları bulunur. HTML sayfasında ise renklendirilecek yer için çok kısa kodlar kullanılır. Birçok şekli vardır ama en çok kullanılanı div class ile yapılanıdır.
Div konularına değindiğim yazılarımda bunları açıklamıştım. Yazı renklendirmesinde düz yazı için ayrı, linkli yazı için ayrı yazı renklendirmeleri nasıl yapılır bunları o yazılarımdan bilhassa » div class ile ilgili yazımdan okuyabilirsiniz
Dikkat: Sadece HTML sayfasında kullanabileceğiniz biçimlendirme kodlarıyla her şeyi yapabilirsiniz. Yalnız şunu bilin ki en sağlıklı biçimlendirme yolu CSS tarzı ile olanıdır. Her açıdan yararlıdır ve SEO için de önemlidir.
Bu yüzden CSS öğrenmenizde yarar var. Hiç zor değildir. Div yazılarıma baksanız onları öğrenseniz var ya neredeyse bütün CSS meselelerinin yüzde doksanını öğrenmiş gibi olursunuz. “gibi” dedim. aynen öyledir demedim. Yani hiç gözünüzde büyütmeyin, elbette yüzde doksanı değil ama onları öğrenseniz gerisi çorap söküğü gibi gelir.