Photoshop Ile Sıfırdan Web Tasarım (Resimli anlatım) [Ps Team]

+ Yorum Gönder
Grafik ve Photoshop Dersleri Bölümünden Photoshop Ile Sıfırdan Web Tasarım (Resimli anlatım) [Ps Team] ile ilgili Kısaca Bilgi
  1. 1
    MUSTAFA
    Usta Üye
    Reklam

    Photoshop Ile Sıfırdan Web Tasarım (Resimli anlatım) [Ps Team]

    Reklam



    Photoshop Ile Sıfırdan Web Tasarım (Resimli anlatım) [Ps Team]

    Forum Alev
    Ben elinizde hazır bir photoshop tasarım olduğunu farzederek başlıyorum.
    Ben Forumda Bir Cok Tasarımı Paylastım
    Resim 1 de görndüğü gibi tasarımımızda slicelerimizi çiziyoruz.
    Yani parçalara ayırıyoruz.Mesela gördüğünüz gibi Menüleri çizmişim tek tek... Onları Sol menüden sliceyi alıp çizdikten sonra çizdiğimiz sliceye sağ tıklayıp "Edit Slice Options" a tıklıyoruz
    ve karşımıza gelen ekranda resmi ne olarak kaydedeceğini ve ona
    tıklayınca gideceği adresi yazıyoruz.Bu işlem bütün menülerde
    yapılır. Fakat linki heryere ermemize gerek yok
    istediğiniz yere verebilirsiniz...(Resim 1)

    Slicelerimizi çizdikten sonra "File" memüsüne tıklayıp "Save For Web" Sekmesi tıklanır. (Resim 2)

    "Save For Web" Sekmesi' ni tıkladıktan sonra açılan ekranda genel bi ayar yapmıyoruz ve
    "Save" Butonuna basıyoruz.(Resim 3)

    "Save" Butonu Tıklandıktan Sonra karşımıza gelen kayıt ekranında
    kaydedeceğimiz yolu belirtiyoruz.Alt bölümden "Html and Images"i seçim kayıt ediyoruz (Resim 4)

    Kaydettiğimiz dizine geliyoruz ve sıra geldi html olarak yaptığımız bu tasarımı Herhangi bir
    Web Tasarım Editöründe açıyoruz.(Dreamweaver & Frontpage vs.vs...)..(Resim5)

    Ve .html yaptığımız bu sayfayı herhangi bir web tasarım editöründe açtık. (Ben Share Point Kullandım)
    Ve sonunda bir html sayfamız oldu (Resim 6)

    Bu sayfamıza Web Tasarım Editöründe Neler Yapabiliriz ?
    * Css ile görüntüye zenginlik katabilirsiniz.
    * Arka plana renkler ekleme yazılar yazma vs vs
    Ve daha çok işlemler yapabilirsiniz.
    Resimlerin üzerine yazı yazmak için size div kullanma yöntemini öneririm.
    Bilmeyen arkadaşlar için mantığı şu
    <DIV STYLE="background-image:url('images/resiminadi.gif'); width: resimin genişiliğipx; height:resimin yüksekliğipx">
    </div>
    Evet bu div in içine yazılacak yazılar sayfanın düzeninii bozmadan çıkacaktır
    Takıldığınız yerlerde Peme ile yardım isteyebilirsiniz mutlaka yardım ederim.


    Ama Yinede Fazla Kurcalamayın Verdigim Tasarımları Kendinize Göre Yapın Yeter :)


    EMEGE SAYGI



  2. 2
    Hasan
    Özel Üye

    --->: Photoshop Ile Sıfırdan Web Tasarım (Resimli anlatım) [Ps Team]

    Reklam



    MUSTAFA ; Konudaki Resimleri Tekrar Upload Etmen Gerekiyor Sanırım.

    Resimler Görünmüyor , Resimleri Yenileyeceğini Düşünüyorum Bu Yüzden Konuyu Taşımadım.







  3. 3
    MUSTAFA
    Usta Üye
    Resimler Yenilenmiştir

    Tasarımcılarımıza Kolay Gelsin








+ Yorum Gönder
5 üzerinden | Toplam : 0 kişi