Photoshop Dersleri” serisine devam ediyoruz, bu dersimizde photoshop‘ta web 2.0 için internet sitesinin en üst kısmının nasıl yapıldığını göreceğiz.

autocadhocasi.com/wp-content/autocad/2009/04/11.jpg”>11 515x104 Photoshop Dersleri   Web 2.0 Header Yapımı

Boş bir sayfa açıyoruz, boyutları internet sitesi üst tarafına uygun olması için width:1000 pixels, height 200 pixels yapıyoruz.

1 Photoshop Dersleri   Web 2.0 Header Yapımı

Açılan yeni sayfamızın arkaplan rengini siyaha çeviriyoruz ve, Rectangle aracı ile şekilde ki gibi bir alanımızı seçiyoruz. Seçili alana sağ tıklayıp “new layer“e tıklıyoruz ve yeni bir layer oluşturuyoruz.

2 Photoshop Dersleri   Web 2.0 Header Yapımı

Oluşturduğumuz yeni layeri Paint Bucket Tool (dolgulu boyama aracı) yardımı ile beyaz renge boyuyoruz. Boyadıktan sonra yine oluşan bu layer’e sağ tıklayayıp Blending Options‘u seçiyoruz.

3 Photoshop Dersleri   Web 2.0 Header Yapımı

Karşımıza çıkan yeni “Blending Options” penceresinde, renk geçişi uygulamak için ” gradient overlay ” ı seçiyoruz, ayrıca sonradan menümüz için özel alan yapmamızı sağlayacak olan ” stroke ” yi seçiyoruz.

4 Photoshop Dersleri   Web 2.0 Header Yapımı

Gelelim renk seçimine, renk seçimi daha çok sizin keyfinize ve hayal gücünüze bağlı. Ben uyumlu olması için kırmızı siyahı seçtim. Şimdi, gradient yazan yazının yanında ki renk şeridine basıyoruz ve gradient editor‘umuzu açıyoruz. İlk renk seçimini #000000, ikinci renk seçimini #420000 olarak seçiyoruz. ( Dediğim gibi bu sizin hayal gücünüze ve projenize bağlı, farklı renkler seçebilirsiniz. )

5 515x213 Photoshop Dersleri   Web 2.0 Header Yapımı

Seçtiğiniz renge bağlı olarak, şimdi stroke efektimizin rengini belirleyeceğiz. Ben seçtiğim renge uygun olması amaçlı #8c0000 kodlu rengi seçtim. Ayrıca “size” kısmını 1 yaptım ki zarif birşeyler olabilsin.

6 Photoshop Dersleri   Web 2.0 Header Yapımı

Şimdi, resim penceremizde alttaki gibi bir resim oluşması gerekiyor;

7 Photoshop Dersleri   Web 2.0 Header Yapımı

Şimdi, yine Layer penceremize geri dönüyoruz ve sayfayı oluşturduğumuzda ilk oluşan layer ‘i seçiyoruz. (eğer ki kilitliyse kilidi kaldırın)

Daha demin ki adımlarda öğrendiğimiz ” sağ tıklayıp blending options seçme ” olayını tekrar yapıyoruz ve bu sefer sadece Gradient Overlay seçeneğini işaretli yapıyoruz. Burada ki seçtiğimiz renk, az önce oluşturduğumuz kırmızı siyah renkli üst kısmın altını dolduracak. Bu yüzden yine hayal gücünüzü iyi kullanıp, buraya iyi uyacak renkler seçmeniz gerekiyor. Ben uyar diye düşünüp beyaz’dan gri’ye dönüştürmeyi seçtim.

8 Photoshop Dersleri   Web 2.0 Header Yapımı

Penceremizde altta ki gibi bir resim oluştu;

9 Photoshop Dersleri   Web 2.0 Header Yapımı

İşte internet sitemizin üst tarafı hazır oldu, daha sonra yine kendi hayal gücünüzü kullanarak menü yerleştirebilir, kendi logonuzu uyumlu hale getirebilirsiniz. En son olarak;

11 Photoshop Dersleri   Web 2.0 Header Yapımı

Bu Photoshop Dersini de Böylece bitirmiş oluyoruz..

Bu yazıyı beğendiyseniz RSS ye abone olabilirsiniz!
sayfa içi reklam alanı

Yorumlarınız Değerlidir

“Photoshop Dersleri – Web 2.0 Header Yapımı” için 7 yorum bulunuyor

Kullanıcı girişi yaparak ya da zorunlu olan * alanlarını doldurarak yorum yapabilirsiniz.

İsminiz *

Email adresiniz *

Web siteniz

Mesajınızı buraya yazabilirsiniz:


Toplam 7 yorum var.

  1. oylabunu.com | 10 Nis 2009, 23:10
    1

    Photoshop Dersleri 15…

    Bir internet sitesinin en üst kısmını oluşturan web 2.0 header yapımı anlatılıyor…

  2. 100puan.com | 10 Nis 2009, 23:26
    2

    Photoshop Dersleri 15…

    Web 2.0 header yapımı anlatılıyor…

  3. 101bilge.com | 10 Nis 2009, 23:26
    3

    Photoshop Dersleri 15…

    Web 2.0 header yapm anlatlyor…

  4. imlerim.com | 10 Nis 2009, 23:41
    4

    Photoshop Dersleri 15…

    Web 2.0 header yapımı anlatılıyor….

  5. siteimle.com | 10 Nis 2009, 23:44
    5

    Photoshop Dersleri 15…

    Web 2.0 header yapımı anlatılıyor….

  6. oyyla.com | 19 Nis 2009, 02:18
    6

    Photoshop Dersleri 15…

    Web 2.0 header yapımı anlatılıyor…

  7. forum | 25 Tem 2010, 19:07
    7

    oldukça iyi duruyor.teşekkürler :)



  • AutoCAD Dersleri
  • AutoCAD Dersleri
  • AutoCAD Dersleri
  • AutoCAD Dersleri
  • AutoCAD Dersleri
  • AutoCAD Dersleri
  • AutoCAD Dersleri
  • AutoCAD Dersleri
  • Yapılan Son Yorumlar
  • GÜLŞAH: Merhaba, Son birkaç günden beri autocad hatch...
  • herbalife ürünleri: kesinlikle bu anlatımla proje çizimi...
  • jasdef: arka plana image den reesim seçicem fakat resim...
  • nakliyat: elinize sağlık çok güzel olmuş teşekkürler
  • kazancrehberim.net: çok güzel bir eklenti tavsiye ederim
  • En Çok Yorum Alan Yazılar
  • AutoCADHocasi.com 8 GB U3 Bellek Hediye Ediyor !
  • AutoCADHocasi.com Ödüllü Yorum Yarışması
  • AutoCADHocasi.com Yarışması
  • AutoCAD 2009 Geliyor (Yeni Arayüz, Yeni Özellik ve Komutlarla AutoCAD 2009)
  • AutoCAD’de 3 Boyutlu Araba Yapmak !!!
  • AutoCAD ile Pırlanta Yapımı
  • Üye Girişi

Botacad: Hoşgeldiniz. Bana AutoCAD hakkında öğrenmek istediklerinizi sorabilirsiniz. Henüz yapım aşamasındayım, eksik veya hatalar olabilir.

Seo Hocası

AutoCAD Sözlüğü

AutoCAD indir, Dersleri, Eğitimi

Bağlantılar

AutoCAD Download photoshop tutorial Bilgisayar eğitiminin adresi Yeşersin

staricad autocad reklam alanı
AutoCADHocasi.com Kaan Gülten tarafından oluşturulmuş, Dersler veren sitedir.
Destek Ol
Seo Danışmanlığı
Önem Verilen Kelimeler
  • AutoCAD Kursu
  • indir
  • AutoCAD ironman
  • Download
  • Dersleri
Özel Yazılar
  • Kurs Projesi
  • 3 Boyutlu Araba Çizimi
  • 3 Boyutlu Havuz Çizimi
  • Sweep Komutu 3
  • Sweep Komutu 4
Özel Yazılar 2
  • Projeksiyon Görüntüsü Oluşturma
  • Buzlu Cam Yapımı
  • Anipath - Yol Animasyonu
  • Işıklı Kalem Çizimi
  • Divide ile Yol üzerinde ilerleyen yazı
Google Site Map | AutoCAD Hocası | AutoCAD | AutoCAD | Google

Powered by 2008 - 2010 AutoCADHocasi.com