Site Trafiğini Arttırmak ve SEO (Search Engine Optimization)

Web sitesi hazırlamak göründüğünden daha zor, oldukça zahmetli bir iştir. Etkileyici, kullanışlı ve güzel bir görünümü elde etmek bir yana, hazırlanan içeriğin siteye yüklenmesi ve kullanıcılara sunulması ayrıntılı ve yoğun bir çalışmayı gerektirir. Buna ek olarak hazırladığınız sayfa her web tarayıcı için farklı yorumlanacağından(yaptığınız tasarımlar tüm web tarayıcılarda aynı görünmeyebilir) tarayıcı uyumunu sağlamak, web sitesini ziyaretçiler tarafından kullanılması muhtemel web tarayıcı model ve sürümlerinde en doğru biçimde görüntülenmesini sağlamak, site tasarımının zor taraflarıdır. Tüm bu zahmetlere karşılık web sitesi istatistiklerinin yerlerde sürünmesi, ziyaretçi sayısının düşüklüğü, tüm bu çalışmaları yapan; işin külfetini çeken kişi ya da kişiler için büyük bir hayal kırıklığı ve üzüntü kaynağıdır. Emeklerinizin boşa gitmemesi ve sitenizin amacına yani ziyaretçilerine ulaşabilmesi için yapmanız gereken çok önemli üç şey var.

1-Sitenizi google, yahoo ve bing gibi arama motorlarına kaydedin, indeksleyin.

2-Sitenizin bilinirliğini arttırın; mümkünse reklam yapın.

-Çeşitli forum ve sosyal paylaşım sitelerine(Donanım Haber, Facebook. Twitter gibi) üye olun reklamınızı yapın.

-Bloxoo, Bumerang gibi blogların listelendiği, paylaşıldığı sitelere üye olun ve bloğunuzu tanıtın.

-Google AdWords ile ücret karşılığı web sitenizin reklamını yapabilirsiniz.

3- Site tasarımınız arama motorlarına uygun hale getirin.

-Title, meta tag ve etiketler kullanın.

Title: Buraya yazdığınız yazı web tarayıcının başlık kısmında görüntülenecektir. Site ana başlıklarını buraya yazabilirsiniz. Title içinde sitenizde olmayan içeriklerle ilgili kelimeler kullanmayın. Arama motorları buna kızar.

Meta Tagı: Burada keyword ve description olarak anahtar sözcükler kullanılır. Arama motorları burada yazan kelimeleri sitenizi tanımlamakta kullanırlar. Şunu unutmayın buraya yazdığınız anahtar sözcükler site içeriği ile uyumlu olmalıdır.

Etiketler: Eklediğiniz içeriği anahtar sözcüklerle etiketleyin. Kullandığınız etiket sözcüklerini site içeriğinden seçerseniz arama motorları sitenizi o içerik ile ilgili aramalarda daha üst sıraya koyarlar. Aynı şekilde burada da konu ile alakasız etiket sözcükleri kullanmamaya dikkat edin.

-Eklediğiniz resimlere konu ile ilgili alternatif metinler yazın.

Mesela ben bu sayfaya seo.jpg isimli bir resim ekledim. Bunun için yaptığım kodlama şu şekilde oldu;

< img src=”seo.jpg” alt=”seo”/>

Siz de kodlamayı bu şeklinde yaparsanız sitenize koyduğunuz resim arama motorları tarafından verdiğiniz isim altında indekslenir. Eğer resme verdiğiniz alt metin konu metnindeki önemli sözcüklerden biri olursa internette o konu ile ilgili görselleri arayan bir kullanıcı rahatlıkla resim dosyanıza ulaşır. Arama motoru resim dosyanızı konu ile ilgili diğer resimlerin arasında gösterir. Böylelikle resimler aracılığıyla sitenize ulaşmış olurlar.

Web Sitesi İçin Translater (Javascript Translater)

Web sitenizi dünyaya açmak yabancı kullanıcıların da site içeriğinizden faydalanmasını sağlamak istiyorsanız web sayfanıza dil seçenekleri koymak zorundasınız. Bunu sağlamak için elinizde üç seçenek bulunmakta (ya da en azından benim bildiğim bu kadar)

1. Sitenin her sayfası için farklı dillerde HTML dosyaları oluşturmak
2. İnternetten bulacağınız ASP ya da PHP tabanlı yazılmış bir çeviri programını kendi sunucunuza entegre etmek
3. Google Translate kullanmak

İlk seçenek ufak çaplı siteler için uygulanabilir. Ama pek de verimli olmaz.

İkinci seçeneği tercih etmek daha mantıklı. Ancak bu tip programların ücretsiz olanlarından bulmak kolay mı? Ücretsiz yazılımlar ne kadar verimli? denemeden bilemeyiz. Bunun haricinde ücretli programlardan/servislerden de faydalanılabilir. Ayrıca Joomla, Moodle, gibi web portalları kullanıyorsanız bu portalların dil paketlerini sunucuya yükleyerek de kullanıcılar için farklı dil seçenekleri oluşturabilirsiniz. Ancak bu sadece sayfa şablonuun ve bu şablona bağlı üyelerin görünümünü etkiler, içeriğiniz yine aynı kalır. Burda amacım şablonu da dahil olarak tüm siteyi istenen dile çevirmek.

Üçüncü seçenek benim gibi bedavacılar için... Diğer iki seçenekte bahsedilen işlemler sitenin sunucu kısmında(host üzerinde) gerçekleştirilir. Eğer benim gibi Blogger kullanıcıysanız maalese size ulaşabileceğiniz bir host alanı verilmiyor. bu durumda alternatif yollara başvurmanız gerekiyor. Bloggerın sunduğu bazı Gadget'lar bu sorun için çözüm olabilse de Bu gadgetlar ile birlikte gösterilen reklamlar, gadgetın sayfa tasarımına uymuyor oluşu dil bloguna seçeneği koymak isteyen bir blog sahibi için büyük bir problem. Tabii ki bu elimizin kolumuzun bağlı olduğu anlamına gelmiyor. İşte tam bu noktada Google'un çeviri servisi olan Google Translate imdadımıza yetişiyor. Bilindiği gibi bu servis sadece metinleri değil, tüm site içeriğini istenen dile çevirebiliyor. siteyi komple çevirmek için tek yapmamız gereken sitenin tam adresini çeviri kutucuğuna yazmak. Google tüm siteyi otomatik olarak, büyük bir doğrulukla istediğiniz dile çevirecektir. Ancak ziyaretçilerinizden bunu yapmalarını isteyemezsiniz.

İşte ben de tam bu noktada şunu düşündüm. Acaba javascript kullanarak(Javascript kullanıcı tarafında çalıştığı için yukarıda saydığım hosting ve yükleme sorunum olmayacak)bunu otomatik olarak yaptırabilir miyim? Yani ziyaretçi aynı diğer büyük sitelerde olduğu gibi, dil seçeneği menüsünden tek bir tuşa basarak tüm siteyi istediği dile çevirmesini sağlayabilir miyim? Bu düşünce üzerine küçük bir araştırma yaptım ve şu sonuçlara ulaştım,

-İlk olarak google translate'nin nasıl çalıştığını, çeviri ile ilgili sorgulamaların google çeviri sunucusuna nasıl yollandığını araştırdım. Türkçe'den İngilizce'ye çevirmesi için çeviri kutusuna bir metin ya da site adresi yazdığımda bu bilgiler sunucuya şu şekilde gönderiliyordu,

"http://translate.google.com/translate?hl=tr&sl=tr&tl=en&u="

Adres çubuğunda bu ifadenin karşısında çevirlmesi için yazdığım metin ya da site adresi yazıyordu. Böylelikle google sunucusuna sorgu göndermenin yolunu da bulmuş oldum. Yukarıdaki kod sadece ingilizce için geçerlidir. Diğer dillerin kodunu elde etmek için de ayrıca çeviri işlemleri yaptırılmalı ve adres çubuğunda baştan çeviri metnine kadar olan kısım kopyalanmalıdır. Bu şekilde google'un sunduğu tüm çeviri seçenekleri elde edilebilir.

-Sonra bunu javascript'e otomatik olarak nasıl yaptırabileceğim üzerine çalışmaya başladım. Yazacağım program iki şey yapmalıydı,

1. Kullanıcı herhangi bir dili seçtiğinde program sitenin o anki sayfasına ait url'yi adres çubuğundan kopyalamalı ve bir değişkene aktarmalı
2. Sonra da bu değişkenin değeri ile google'dan aldığımız o dille ilgili kodu birleştirip ardes satırına yazmalı ve googe sunucusuna dil sorgulamasını yollamalı

İşte aşağıda yazdığım kodlar bu işi yapıyor. Kulanıcı herhangi bir butona bastığında o butonla ilgili bir fonksiyon çalışıyor. Seçeneklerdeki her dil için ayrı bir fonksiyon yazdım. Hepsi temelde aynı işi yapıyor sadece değişken isimleri ve dil sorgusu için kullandığı kodlar farklı. dil sorgusu için kullanılan kodlar turuncu renkle renklendirilmiştir. Bu program üç dil için yapılmıştır. istenirse aynı mantıkla diğer diller de eklenebilr.

<div style="heigth:23px;">

<script language="javascript" type="text/javascript">

function eng(){

var a

a=document.location.href;

parent.location.href='http://translate.google.com/translate?hl=tr&sl=tr&tl=en&u=' +a

}

function ger(){

var g

g=document.location.href;

parent.location.href='http://translate.google.com/translate?js=n&prev=_t&hl=tr&ie=UTF-8&layout=2&eotf=1&sl=tr&tl=de&u=' +g

}

function frn(){

var f

f=document.location.href;

parent.location.href='http://translate.google.com/translate?js=n&prev=_t&hl=tr&ie=UTF-8&layout=2&eotf=1&sl=tr&tl=fr&u=' +f

}

</script>

<input type="button" value="" onclick="eng()" style=" background-image:url(ingiliz.jpeg); width:26px; height:22px; cursor:pointer; " title="English" /><input type="button" value="" onclick="ger()" style="background-image:url(alman.jpeg); width:26px; height:22px; cursor:pointer; " title="German" /><input type="button" value="" onclick="frn()" style="background-image:url(fransiz.jpeg); width:26px; height:22px; cursor:pointer;" title="French" />

</div>

Bu kodlamanın sonucunda oluşturulan javascript dil menü çubuğu şu şekilde görüntülenir,

Javascript if Uygulaması (Javascript ile Basit Bir Hesap Makinesi)

Programlama öğrenmeye çalışan herkesin eninde sonunda karşılaşacağı bir problem vardır. Programcılar buna "Program Akış Denetimi" derler. Bilgisayar programı dediğimiz şey esasen akış halinde birbirini takip eden bir dizi işlemden ibarettir. Program akışı içinde bu işlemler bilgisayar tarafından süratle gerçekleştirilir ve sonuçları ekrana yansıtılır. Bazı programlar yapı itibariyle basittir. Sadece kullanıcıdan ya da herhangi bir yerden aldığı verileri işleyerek sonucunu gösterirler. Bu tip programlar tek yönde çalışırlar ve genelde sadece tek bir şarta dayalı işlemleri gerçekleştirirler ve çözüme ulaşırlar. Ancak bazı problemlerin çözümü bu kadar basit olmaz. Programcılar sıklıkla bilgisayara, "Şu şart halinde şunu yap, bu şart halinde bunu yap" şeklinde komutlar etkleyerek programa farklı durumlar için esneklik kazandırmak zorunda kalırlar. İşte bu farklı durumların sorgulandığı yer, belirlenen şarta göre program akışının yön değiştirdiği ya da olağan akışına devam ettiği bir kavşak noktası gibidir. Program akışı bu noktalardan denetlenir. Hemen hemen tüm programlama dillerinde bu denetleme "if" komutu ile yapılır. "if" komutu program akışını iki kola ayırır. İngilizce'de "eğer" anlamına gelen bu sözcük programa işleyeceği verileri, programcı tarafından önceden belirlenen kriterlere göre(büyüklük, küçüklük, eşitlik gibi)karşılaştırıp sonuca göre (evet yada hayır) program akışını yönlendirme olanağı verir.

Buraya kadar anlatılanlar Javascript için de geçerlidir. Javascript'te "if" komutu şu şekilde kullanılır;

if(aranan şart){

uygulanacak işlem

}

Bir sonraki işlem

Aranan Şart: x==5, secim=="yeni", a<5 gibi şartların sorgulandığı bölüm.

Uygulanacak İşlem: x=sayi1+sayi2, document.hesap.sonuc.value=islem gibi komutların uygulandığı, çeşitli işlemlerin yapıldığı kısım. Bu bölümde çeşitli aritmetik işlemler, karşılaştırmalar, döngüler gerçekleştirilebilir. Bir sonraki işlem: aranan şartın sağlanamadığı durumlarda yapıl Javascript'te "if komutu şu şekilde çalışır;

1- Önce parantez içindeki şart sorgulanır. Sorgulama sonucu evet ya da hayır dır.

2- Sonuç evet ise yani şart sağlanıyorsa, süslü parantezler içindeki işlemler gerçekleştirilir.

3- Sonuç hayır ise yani şart sağlanmıyorsa süslü parantez içindeki işlemler uygulanmaz. "if" bloğundan çıkılır ve hemen bir sonraki işlem gerçekleştirilir.

Birden fazla "if" komutunu iç içe kullanabilirsiniz. Yani bilgisayara "şu şart halinde, şu şartta şu şartı sorgula" şeklinde komutlar verebilirsiniz. Bu komutun iç içe uygulamasını daha sonraki bir yazıya bırakıp örnek bir program ile yazımı sonlandırmak istiyorum. Aşağıdaki kodlar web sayfasında çok basit, ilkel bir hesap makinesi oluşturmak için yazıldı. Kullanıcı arayüzü olarak HTML'nin form elemanlarını (textbox ve button) kullandım. Program yaı ve işlevsellik açısından o kadar iyi olmasa da "if" komutunu anlamamız açısından yararlı olacaktr. Ayrıca şunu da belirtmek istiyorum bu programın "endeks=selectedIndex " ile başlayan kısmını "Hakkı İcal"'in Javascript ders notlarından aldım. Oradan öğrendiklerimi geliştirip değiştirerek ürettiğim uygulamaları buradan sizlerle paylaşıyorum. Umarım hem sizin için hem de benim için faydalı olur.

İşte hesap makinesi kodları:

<script language="javascript1.2">

function hesapla(secme){ /* Bu satırda bir fonksiyon tanımlanıyor*/

var sayi1,sayi2,endeks, secilenIslem,islem /*değişkenler belirleniyor*/

endeks=secme.selectedIndex

secilenIslem=secme.options[endeks].text /*bu kısımda açılır menüden seçilen değeri"secilenIslem" değişkenine aktarıyor */

sayi1=eval(document.hesap.birinci.value)/* Sayısal işlem yapılacak değişkenlere*/

sayi2=eval(document.hesap.ikinci.value) /* kullanıcının girdiğideğerleraktarılıyor*/

if(secilenIslem=="Topla"){ /* bu kısımda kullanıcının seçtiği işlem*/

islem=sayi1+sayi2 /* sorgulanıyor ve işlem gerçekleştirilip sonucu*/

document.hesap.sonuc.value=islem /* "Sonuç" adlı text box'a yazdırılıyor*/

}

if(secilenIslem=="Çıkar"){

islem=sayi1-sayi2

document.hesap.sonuc.value=islem

}

if(secilenIslem=="Çarp"){

islem=sayi1*sayi2

document.hesap.sonuc.value=islem

}

if(secilenIslem=="Böl"){

islem=sayi1/sayi2

document.hesap.sonuc.value=islem

}

if (secilenIslem=="İşlemi Seçiniz"){ /*kullanıcı işlem seçimi yapmazsa uyarı*/

alert("Lütfen Bir İşlem Seçiniz") /*mesajı veriyor*/

}

}

</script>

<form name="hesap">

<div style="float:left;">

1. Sayı : <input type="text" value="" name="birinci" maxlength="10"

/><br />

2. Sayı : <input type="text" value="" name="ikinci" maxlength="10"

/><br />

Sonuç = <input type="text" value="" name="sonuc" maxlength="10" />

</div>

<div style="float:left;">

<select name="secim" onchange="hesapla(this)">

<option selected>İşlemi Seçiniz

<option>Topla

<option>Çıkar

<option>Çarp

<option>Böl

</select>

<input type="reset" value="Sil" />

</div>

</form>

Bu kodlamanın sonucunda hesap makinemiz şu şekilde görüntülenir.

1. Sayı :

2. Sayı :

Sonuç =

İşlemi Seçiniz Topla Çıkar Çarp Böl

CSS3 ile Web Sayfasına Yuvarlak Köşeli Elemanlar Koymak

Bir web sayfasına içerik yerleştirilirken genellikle div, span gibi kutu özelliği olan ve sayfa üzerinde belirli bir yüzeyi kaplayan elemanlar kullanılır. Tablo ile web tasarımının modasının geçtiği şu günlerde, tasarımcılar sayfalarını "div" veya "span" gibi kutu elemanları ile hazırlamaktadırlar. Bu elemanlar CSS'nin verdiği sayısız özellikler sayesinde web tasarımcıların daha keliteli ve daha güzel görünümlü siteler tasarlamasına olanak sağlamıştır. Bu yazıda artık üçüncü versiyonu ile karşımıza çıkan CSS'nin tasarımcılara verdiği yeni bir imkandan bahsetmek istiyorum. CSS3 ile gelen "border-radius" kodu sayesinde artık tasarımcı hazırladığı web sayfasına köşeleri yuvarlatılmış HTML elemanları yerleştirebilir. Bunu bir örenek kod üzerinde gösterelim. Mesela bir "div" elemanı CSS3 sayesinde şu şekilde biçimlendirilebilir,

<div style="float:left; text-align:center; font-size:18px; background: #9CF; border:solid 5px #c1c6c7; border-radius: 55px 35px 20px 10px; padding:30px;">Köşeleri Yuvarlatılmış Div</div>

Bu kodlamanın sonucu aşağıdaki gibi görüntülenir.

Köşeleri Yuvarlatılmış Div

İsterseniz benzer bir kodlama ile yuvarlak butonlar da yapabilrisiniz. Alın size bir örnek,

<input type="button" value="Yuvarlak buton" style="text-align:center; font-size:18px; color:#fff; background: #9CF; border-radius:10px; padding:5px;"/>

Bu kodlama da şu şekilde görüntülenir,

"border-radius" bu kodun standart halidir. Eğer yaptığınız kodlamanın diğer web tarayıcılarda da sorunsuz çalışmasını istiyorsanız Şu kodları da sayfanıza eklemelisiniz,

-moz-border-radius:55px 35px 20px 10px; / Firefox için /

-webkit-border-radius:55px 35px 20px 10px; /Safari ve Google Chrome için /

Burda verdiğiniz

ilk değer: sol-üst köşeyi,

ikinci değer: sağ-üst köşeyi,

üçüncü değer:sağ-alt köşeyi,

dördüncü değer:sol-alt köşeyi

yuvarlatmak için vermeniz gereken yarıçap değerleridir. Eğer yarıçap için tek bir değer girerseniz, tüm köşeler aynı değerde yuvarlatılır.

Son olarak "border-radius" kodu ile uymlu tarayıcı listesini de verelim.

Uyumlu tarayıcılar:

-----------------------------

Firefox 3.5 ve üzeri

Internet Explorer 9 ve üzeri

Netscape Navigator 3 ve üzeri

Opera 10.5 ve üzeri

Google Chrome 4.0 ve üzeri

Kaynak:  Fatih Hayrioğlu

Yazıların Arkaplan Rengini Değiştirmek

Web sayfanıza koymak istediğiniz metin içeriğinin önemli gördüğünüz kısımlarını işaretlemek, belirgin hale getirmek isteyebilirsiniz. Basit bir CSS kodu yardımıyla ders çalışırken kullandığınız fosforlu kalemle işaretler gibi metin içeriğinizin istediğiniz kısımlarını ya da tamamını işaretleyebilirsiniz. Bunun için kullanmanız gereken CSS kodu "background-color" dur. Bu kodu metin içeriğinizi işarelemek içi kıullandığınız HTML tagına (<b>, <a>, <span>, <div>,... gibi) bir "Style" özelliği olarak ekleyebilrsiniz. Bunu bir örnekle açıklayalım,

< b style="background-color: #9fc666;" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at...... </b>

Bu kodlamanın sonucu aşağıdaki gibi görüntülenir.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque.

Taglar arasındaki farkı görebilmemiz açısından aynı işemi <div> tagı için uygulayalım.

<div style="background-color: #9fc666;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque.</div>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque.

Dikkat ettiyseniz iki tag arasında önemli bir fark var. HTML'nin bazı tağları sayfayı satır satır işaretlerken bazıları kutu şeklinde bir alanı işaretler. Tasarımınızı yaparken bu önemli farkı da göz önünde bulundurmalısınız.

Program Kullanmadan Bilgisayarın MAC Adresini Değiştirmek

Fiziksel adres olarak da bilinen MAC(Media Access Control-Ortam Erişim Kontrolü) adresi, bir bilgisayarın yerel ağa ya da internete bağlanırken kullandığı cihazın (ethernet, FDDI, Bluetooth, Wi-fi gibi) değişmeyen numaralarıdır. Her üretici firma kendisine özel bir numara grubu kullanır. MAC adresi 12 numaradan oluşur. Bu numaralar onaltılık sistemde oluşturulmuştur.

İnternete bağlanan bir bilgisayara servis sağlayıcı tarafından bir IP numarası verilir. Bilgisayar bu numarayı kullanarak bağlanmak istediğiniz web sitesinin sunucu bilgisayarına kendisini tanıtır ve bu şekilde bağlantı kurulur. Bu numara modemi açıp kapattıkça değişir. Ancak MAC numarası değişmez. IP numarasını öğrenmek için Başlat >Çalıştır' a tıklayıp komut satırına cmd komutu yazılır ve DOS ekranı karşınıza çıkar. DOS oratmında "ipconfig /all" komutu yazılır. Bu komut bilgisayarın yerel ağ yapılandırmasını bir liste halinde size sunar. Burada "fiziksel adres" başlıklı satır sizin MAC numaranızdır.

Şimdi MAC numarasını program kullanmadan nasıl değiştirebileceğimizi gösterelim,

İlk olarak Masaüstünde "Ağ Bağlantılarım" a girilir. Buradan sodaki menüden "Ağ Bağlantılarını Görüntüle" seçeneğine tıklanır ve bilgisayarın "Yerel Ağ bağlantısı" görüntülenir. Bunun üzerine fare ile gelinerek Sağ tuş > Özelliklere tıklanır

Açılan menüde "Microsoft Ağları İçin İştemci" seçili olmalıdır. "Yapılandır" düğmesine tıklanır.

Sekmeli menüden "Gelişmiş" seçeneği seçilir. Ardından açılan listeden "Network Address" seçilir. Burada değer olarak sizin MAC numaranız görüntülenmektedir. Bu numara üzerinde istediğiniz sayısal değişiklikleri yapın ve "Tamam" düğmesine basın.

Bu işlemin ardından bilgisayar ağ bağlantınızı yenileyecektir. Tekrardan DOS ekranına dönüp "ipconfig /all" yazdığınızda "Fiziksel adres" kısmında MAC numarası üzerinde yaptığınız değişikliklerin gerçekleştirildiğini görebilirsiniz.

Web Sayfasına Resimli Arka Plan Yapmak

Sevdiğiniz, beğendiğniz ya da yaptığınız tasarıma uygun olduğunu düşündüğünüz bir resmi web sayfanızın arka planı olarak kullanabilirsiniz. Bunun için HTML dosyanızın <body > tagının içine "background" parametresini kullanarak istdiğiniz resmi (jpg ,gif ya da png) arkaplan olarak belirleyebilirsiniz. İstediğiniz bir resmi arkaplan yapmak için,

< body background="arlaplan.gif" >

....................

....................

...................< /body >

şeklinde bir kodlama yeterlidir. "background" parametresine değer olarak arkaplan resminin konumu verilir. Burada dikkat edilmesi gereken husus adresin doğru olarak verilmesidir. Aksi takdirde resim görüntülenmez. Bu işlem sonucunda seçtiğiniz resim sayfanın arka planına döşeme şeklinde (sayfa boyunca tekrar ederek) yerleşir.

Artık günümüzde arkaplan resmini yerleştirmek için CSS kodlarından faydalanılmaktadır. CSS kodları web tasarımda nesnelerin yerleştirilmesi için HTML kodlarına göre daha çok imkan tanımaktadır. Bunu bir örnek ile açıklayalım.

< body style="background:url(arkaplan.jpg); background-repeat:no-repeat;" >

....................

....................

...................< /body >

Son olarak tag içinde kullanılan parametreleri de açıklayalım,

background-repeat : Arkaplan resminin tekrarlanma şeklini belirlemek için kullanılır. Dört farklı değeri vardır.

no-repeat : Tekrarlama olmaz.

repeat : Resim tüm sayfa boyunca döşenir.

repeat-x : Yatay doğrultuda döşeme yapar.

repeat-y : Düşey doğrultuda döşeme yapar

Gelen Mailin Kaynağını (IP'sini) Bulmak (Hotmail için)

MSN'de biri ile konuşuyorsunuz birden mesaj kutunuza bir mail geliyor. Açıp bakıyorsunuz abuk sabuk şeyler, reklamlar, vs.vs.... Bazısının gönderen kısmında sitenin ismi yazıyor bazısında o da yok. Kendi kendinize düşünüyorsunuz. Bu mailleri kim gönderiyor? Mesele sadece abuk sabuk mesajlarla da bitmiyor.Bazı mailleri ise görünüm itibariyle bir bankanın ya da devlet kurumunun resmi sitesinden farksız. Sizden kimlik numaranızı kişisel bilgilerinizi talep ediyorlar.

-Lütffen aşağıdaki formu doldurunuz.
-Kredi kartınızın kullanım süresi dolmuştur. Yenisini gönderebilmemiz için lütfen eski kredi kart numaranızı ve şifrenizi giriniz, kişisel bilgilerinizi giriniz vesaire vesaire....

Acaba bu mesaj gerçekten bankanızdan ya da devlet kurumundan mı geldi? ya da üye olduğunuz internet sitesinden mi? Bir kere şunu kafanıza yazmanız lazım. Bankalar ya da devlet kurumları bu şekilde mailler ile işlerini yürütmezler. Bunu olsa olsa kötü niyetli kişiler yapar. Bu kişilerin yaptığı işe "phishing" (yemleme) denir. en çok kullanılan internet dolandırıcılığı yöntemlerinden biridir. Özellikle internet üzerinden alım - satım, e-ticaret işleri ile uğraşanlar için çok tehlikelidir. Dikkat edilmezse sonuçları çok ağır olabilir. İşte bu durumda kullanıcıya düşen görev ilk olarak mesajın kaynağını kontrol etmektir. Bu yazıyı Hotmail için hazırladım. Ancak diğer önemli e-posta servislerinin de buna benzer hizmetleri bulunmaktadır. Şimdi Hotmail'de bu işin nasıl yapıldığını görelim

Hotmail'inize gelen mesajların kaynak ip'sini öğrenmek için tek yapmanız gereken fare ile iletinin üstüne gelip sağ tuşa basmak ve çıkan menüden ileti kaynağını göster seçeneğine tıklamak. Ardından açılacak olan sayfada hotmail size bu mesajı gönderen kişinin ya da internet sitesinin ip numarasını gösterecektir.Bu ip numarasının internetten whois sorgusunu yapıp yerini öğrenebilirsiniz. Eğer böyle bir mesaja cevap verme niyetiniz var ise bunu İp kontrolünden sonra gönül rahatlığıyla yapabilrisiniz. Ama ben yine de bu tarz maillere karşı dikkatli olun derim.

Flash Yıldız Gezegen Animasyonu Ver. 1.01

Daha önce yapmış olduğum yıdız gezegen animasyonunu biraz daha geliştirdim. Flash animasyon tekniklerini öğrendikçe yaptığım çalışmaları buradan sergilemeye devam edeceğim.

Eğer animasyon görüntülenmiyorsa bilgisayarınızın DNS numaralarını değiştirin. İsterseniz şu numaraları kullanabilirsiniz:

64.81.79.2

128.107.241.184

HTML Kodları ile Web Sayfasının Arkaplan Rengini Değiştirmek

Web sayfanızın arkaplan rengini değiştirmek için < body > tagının "bgcolor" parametresine o rengin ingilizce adını (red, yellow, white, black gibi) ya da onaltılık sistemde hazırlanmış renk kodunu girmeniz yeterlidir. Arkaplan rengi şu şekilde değiştirilir.

< body bgcolor="red" >

............

...........bu kısımda diğer sayfa elemanları bulunur.

...........

...........

< /body >

Bu kodlama ile sayfa arkaplanı kırmızı olarak değiştirilir. Burada "bgcolor" için red yerine onun hexadesimal(onaltılık) RGB kodu olan #FF0000 da yazılabilir. Sonuç aynıdır. Hexadesimal sayı sistemi 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F elemanlarından oluşur.

Burada RGB sisteminden de bahsedelim. RGB, Red-Green-Blue (Kırmızı-Yeşil-Mavi) ışık renklerinin karışımı ile diğer renklerin elde edilmesine dayalı bir renklendirme standardıdır. Her renk için hexadesimal sayılardan oluşan bir sayı çifti bulunmaktadır. Bu çiftlere verilen değere göre istenilen renk elde edilebilir. Konunun daha iyi anlaşılabilmesi için RGB sistemini bir tablo haline getirdim.

RENKLER		KIRMIZI	YEŞİL	MAVİ
KODLAR	#	0,1,2..A,B,..F	0,1,2..A,B,..F	0,1,2..A,B,..F

Laptoplarla ilgili piyasa - fiyat araştırmalarım için => LapTopCanavarı

Flash Saat

Web sayfanızda kullanabileceğniz. Granit desenli flash saat uygulaması.

Eğer flash saat görünmüyorsa DNS numaranızı değiştirin.

64.81.79.2

128.107.241.184

Numaralarını kullanabilirsiniz.