19.10.2008

Header nasıl yapılır ?


Öncelikle, hazırladığım headerları beğendiğiniz için çok teşekkür ederim. Banner / header 'ların nasıl yapıldığını soranlar , merak edenler için amatörce bir yol hazırladım.

Photoshop,dw veya diğer çözmesi zor çizim ve resim düzenleyici programlarını bilmiyorum/kullanmıyorum.

Şimdiye dek basit düzenleme programı olan PhotoScape'i kullandım.Sizler de bu programdan faydalanabilir hatta Türkçe sürümünü bile indirebilirsiniz.

Header resimlerimi çok sık değiştirdiğimi farketmişsinizdir,bunun nedeni hergün önüme çıkan ve beni cezbeden binlerce resim. :)

Bazen bir fotoğraf,bazen kumaş parçasının bir bölümü bazen de minik resimlerle kendi hazırladığım blog headerları nasıl yapılıyormuş inceleyelim;

  • Her blogun header ölçüsü farklıdır,örnek olması açısından kendi blogumun ölçüsünün resmini inceleyebilirsiniz.
  • Şablon - Html'yi Düzenle - Widget Şablonlarını Genişlet'i tıklayalım.
  • Cntrl+f ile şablonumuzda header-wrapper diye aratalım.
  • Gördüğümüz rakamsal değer,header ölçümüzdür.Örneğin benim blogun header ölçüsü 900 px.
  • Beğendiğimiz bir resmimizi PhotoScape ile açalım.
  • Yaptığım son header resmi, Franci Strümpfer'a ait bir çalışma.Boyutu 2.4 MB olduğu için küçültmeliyim.Resize/Yeniden Boyutlandır kısmından boyutu 900 px ' düşürüyorum.
  • Resmin sadece bir kısmını kullanmak istediğimden Kırp kısmından istediğim gibi kesiyorum. ( Genelde 900X350 ölçüsünü kullanıyorum. )
  • T butonuna tıklayıp,dilediğim yazıyı yazıyor,dilersem çerçeve ekliyorum.
  • Resmin bir köşesine sahibinin adını yazıyorum ki,emeğe saygısızlık olmasın.
  • Resmi bilgisayarımıza kaydediyoruz.
  • Blogumuza gelip, Kumanda Paneli-Yerleşim' e tıklıyoruz.Header kısmındaki Düzenle'ye basıyoruz.

  • Açılan pencerede işaretli yerlere tıklayıp resmin yüklenmesini sağlıyoruz.
  • Kaydet diyoruz,headerimizi güle güle kullanıyoruz.

Öneriler;
  • Değişik fontlar için Dafont en beğendiğim içeriğe sahip site.
Pin It!

32 yorum :

  1. Ş-A--H-A-N-E-M-S-İ-N

    Süperrr....

    YanıtlaSil
  2. bende çok istiyordum header yapmayı ama yolu bulamamıştım:)oğlum uyuduktan sonra tek tek deniycem ve başarırsam size ithaf edicem:) sevgiler...

    YanıtlaSil
  3. delfinacığım bu yazdıklarını ancak uygulanırken görürsem anlayabiliyorum .belki birgün ben de yapabilirim.

    YanıtlaSil
  4. Benim en büyük şansım,Delfina ile aramda incecik bir duvar olması:)Bugün yine onun kafasını şişirdim bana Header öğret diye.Canım arkadaşım büyük bir sabırla gösterdi ama bana bir bakışı vardı ki (anlamadınmı daha)diye.Teşekkürler Delfina...

    YanıtlaSil
  5. Ben de cok merak ediyordum bu guzel bannerleri.. Bir de muzik koymayi anlayabilsem..

    YanıtlaSil
  6. Delfinacığım verdiğin bilgiler için teşekkür ediyorum.Bende çok özeniyordum doğrusu.Bana da bir arkadaş yapıp gönderdi.Ama çeşitleme şansım olamıyor bilmediğim için.İnşaallah verdiğin bilgilerle başarabilirim bende.sevgiler.

    YanıtlaSil
  7. Bu kadar detaylı yazmak büyük bir yardım oldu bana.

    Çok Çok teşekkürler!

    YanıtlaSil
  8. Çok eğlenceli Delfina,paylaşımın için teşekkürler:)

    Sevgiyle.

    YanıtlaSil
  9. canım bılgıler cok guzel..pekı bu programın turkcesını ındırebılırsınız demıssın onunda lınkını verebılırmısın?ınan anlamıyorum ıng..:))çat pat:))

    sevgılerımle..

    YanıtlaSil
  10. ne zamandır bu kadar açıklayıcı ve kolay bir yöntem bulamamıştım , hemen değiştirdim :) çok teşekkür ederim sevgiler

    YanıtlaSil
  11. Çok sık yorum bırakmasam da çok sık uğrarım buraya. Her gelişimde headerın değiştiğini fark ediyorum. Kimisini çok beğeniyorum ama bir daha ki gelişime değişmiş oluyor. Bence elinde yeterince header oldu. Bunları kullanarak sayfayı her yinelediğimizde değişik bir header açılmasını sağlayan bir olay yapabilirsen çok şık olacağı kanaatindeyim. Sinemabed'deki gibi...

    YanıtlaSil
  12. ÇOK ÇOK TEŞEKKÜR EDERİM SİZİN SAYENİZDE DE HEADER YAPIMINI ÖĞRENDİM :

    YanıtlaSil
  13. nunucum,sadık yorumcum :) çok tşkler...

    güldem,takıldığın yerleri sormaktan çekinme..sevgiler.

    nalan teyzecim,aklımda bi proje var,sizin için yapacağım özellikle :)

    büşracım,headerini değiştirdin mi bakacağım şimdi,eğer değişmemişsse bir daha öyle bakacağım :) ahahahaa :))

    mehtap,hepsi çok kolay.müziği yan menüye mi koymak istiyorsun,yazı içine mi?

    mehtap2; sende bi dene olmazsa burdayım :)

    karen hn,çok tşkler.sizler de çok güzel bilgiler paylaşıyorsunuz.sevgiler,

    YanıtlaSil
  14. butterfly,birşey değil :) sevgiler...

    salihacım,şeyy buldun mu türkçesini,o gün unuttum bak yaa :(

    benimkuzum,işinize yaramasına sevindim.sevgiler,

    buzcevheri,yapıcı yorumun için çok tşkler.bir kullandığım headeri bir daha kullanabilsem dediğin öneriyi yapardım ama bunca değişik fikir varken aynı takılmayayım ben :) sürekli mi ziyaret ediyorsun,çokkk mersiii :)) a aklıma gelmişken, şu dilime dolanan buzcevheriiii ovaaaalaraa nakaratını nasıl unutucam yaa,gece kalkıyom dilimde,sabah kahvaltı yapıyom dilimde :) senden etkili reklamcı çıkar buzcevheri :)

    YanıtlaSil
  15. dilek,benim sayemde mi olur hiç,sen çabaladın öğrendin ve başardın.tebrikler.

    YanıtlaSil
  16. Bu verdiğin bilgi için çok teşekkür ederim. Oğlum henüz küçük olduğu için pek ilgilenemiyorum. Çok işime yaradı.
    Başarılarının devamını dilerim
    Elif Örencik Zorcan

    YanıtlaSil
  17. sevgili elif,yardımcı olabiliyorsam ne mutlu bana.oğluşa ve sana kucak dolusu sevgiler

    YanıtlaSil
  18. yapamadım:( şimdi şöyle sorun çıktı.benim yerleşimdeki navbar yazan yazının yanındaki düzenleyi tıkladığımda sadece blogger ın mavı,siyah,gümüş search this blog şeyi çıkıyor.resim yükleyebileceğim bir yer yok:(

    YanıtlaSil
  19. yapıyım derken sayfa düzenimi bozdum....acil yardım istiyorummm :(((

    YanıtlaSil
  20. Sevgili Delfina,
    Yönlendirmeler için ben de çok teşekkür ederim :) Artık kendi header larımı yapabiliyorum !

    Sevgiyle,
    Bettra...

    YanıtlaSil
  21. sevgili Delfina,
    verdiğin linkler o kadar işime yaradı ki anlatamam. ne zamandır bloğuma böyle bir header resmi koymak istiyordum. ama böylesine iyi bir anlatım ve çok işime yarayan yararlı linkler bulamamıştım. şimdi bloğum çok daha güzel oldu. inşaallah daha iyilerini de yapacağım...tekrar teşekkürler...sevgiler...

    YanıtlaSil
  22. bettra harikasın ama linkine tıklayamadım,bulup bakacağım hemen...

    sevgiyle,

    sihirlisepetcim hemen bakıyorum :) sevgiler

    YanıtlaSil
  23. merhabalar,
    blogunuzu gece'nin blogunu didiklerken gordum siz de bildigini paylasan anlatan nadir insanlardansiniz,tebrik ve tesekkur ederim.ben blog dunyasinda cok eski bir okuyucu cok yeni bir yaziciyim umarim anlattiginiz guzellikleri yapabilirim bende bir gün.sevgiler,emeğinize,yureginize saglik

    YanıtlaSil
  24. meraba önerdiğiniz dafont adlı siteye girdim. ordan bi tane download ettim ama photoscapete çıkmadı.. ne yapabilirim???

    YanıtlaSil
  25. @melis, Windows klasörünün içinde, Font klasörüne atınız o download ettiğiniz fontları. Daha sonrasında kullanmak istediğiniz heryerde çalışır,ancak bazen Türkçe harfleri desteklemeyen fontlar var,onları kullanırken dikkatli olmalı.

    Ve Delfina, çok teşekkürler.

    YanıtlaSil
  26. Merhaba Delfina,
    Sayfanı geç bulmakla birlikte daha ilk saniyesinde bana istediğim çeşitte header yapma şansını sunduğun için çok müteşekkirim.
    Photoscape'in altını üstüne getirdim yaklaşık son 2 saattir :)

    Teşekkürler :)

    YanıtlaSil
  27. merhaba
    Pınar hanımın bloğundan size ulaştım, iyikide gelmişim. sayenizde bloğuma header yaptım hemde migren eşliğnde geceyarısı:(
    teşekkür ederim paylaşımınız için..sevgiler

    YanıtlaSil
  28. pınar sağolsun karşımıza çıkardı sizi. kocaman merhabalar :)

    YanıtlaSil
  29. merhaba..blogunuzu yeni keşfettim ve çok güzel paylaşımlarınız var ..ellerinşze sağlık ..yukarda dafont sitesini yazmışsınız ve bende font oluşturdum indir yazısını tıkladığımda zip dosyası olarak iniyor dosyaları çıkartıyorum içinden ama başka şeyler mevcut yani indirme işlemini başaramadım lütfen yardımcı olurmusunuz...ayrıca bloguma beklerimmm

    http://hazanmevsimi58.blogspot.com/

    YanıtlaSil
    Yanıtlar
    1. Merhaba Eylül,

      Teşekkür ederim ziyaretiniz için...Dafont'tan doğru indirmişsiniz,açılan dosyada uzantısı truetype yazı tipi olanı kopyalayın, denetim masası-görünüm-yazı tiplerine yapıştırın. Böylelikle kullanabilirsiniz...

      Sevgiler,

      Sil
  30. canım yukarda vermiş olduğun resim siteleri harika artık hergün resim değiştiririm :) resimleri indirmek için kayıt istiyor kayıt sorun değilde telefon falan ayrıntılı kayıt istiyor ama siz ücretsiz olduğunu söylemiştiniz kayırsız olmazmı indirme işlemi

    YanıtlaSil
    Yanıtlar
    1. Buyazıyı yazdığım zamanlarda telefon istemiyordu,spam önlemek çin geliştirilmiş güvenlik duvarı olabilir.Ama üye girişi olmadan dosyanın orjinalini indiremezsiniz.

      Sil

♠ Kaliteli yorum kimi mutlu etmez ki :) ♠

Related Posts with Thumbnails
01 09 10