PSD to CSS/XHTML Anlatım

Son güncelleme: 05.10.2012 19:26

  • PSD to CSS/XHTML Anlatım


    noimage

    Tasarım bloglarını dolaşırken gözüme çarpan "PSD to HTML" dökümanlarını da bir kenara toplayıp, arşive almak istedim. Bu konuda birçok blogda derlemeler de yer alıyor. Aşağıda yer alan adresler ise faydalı olacağını düşündüğüm siteler.

    A- Videolu Eğitimler

    1- Web Deneyimleri - Eşi Benzeri Görülmemiş Bir Video Serisi -Türkçe


    noimage

    Web tasarımı, CSS dökümü ve WordPress entegrasyonu konusunda Volkan Görgülü tarafından hazırlanmış, isminden de belli olduğu gibi Eşi Benzeri Görülmemiş Bir Video Serisi. İngilizce ile arası iyi olmayan arkadaşların bulabileceği en güzel kaynaklardan bir tanesi. Sitede yer alan diğer yazılar da oldukça işinize yarayacaktır.

    Adres: http://www.webdeneyimleri.com/xhtml-...temasi-yapmak/

    http://www.webdeneyimleri.com/wordpr...ideolu-anlati/

    2- PSD'den XHTML'e nasıl dönüştürebiliriz?

    Web tasarımı ve diğer alanlarda eğitsel yazıları ve dökümanları(tutorial) ile adından çokça söz ettiren Tutsplus'ta işinize yarayacak güzel bir video serisi var. 4 Videoda PSD tasarımı XHTML formatına dönüştürülmüş.

    Bölüm 1 - PSD tasarımın dilimlenmesi ve XHTML halinin oluşturulması

    Bölüm 2 - CSS

    Bölüm 3 - Temel Javascript Uygulamaları

    Bölüm 4 - IE6 ile Zorlu Mücadele

    Adres: How to Convert a PSD to XHTML | Nettuts+

    3- Web Sitesi Oluşturmak

    Birçok konuda videolu dökümanları ile kullanıcılarına faydalı olan CSS Tricks'te 3 videodan oluşan bir döküman dikkatimi çekti.

    Bölüm 1- Photoshop'ta Tasarımı Oluşturmak

    Bölüm 2- Tasarımı CSS/XHTML'e çevirmek

    Bölüm 3- WordPress Teması Oluşturmak

    4- Tasarımı PSD'den HTML'ye Dönüştürmek


    noimage


    Tutsplus'ta yer alan videolu dökümanlardan bir tanesi daha. Sade ve basit bir arayüzü %100 CSS-XHTML'e dönüştürmeyi anlatıyor.

    Adres: Converting a Design From PSD to HTML | Nettuts+

    B - Yazılı Dökümanlar - Makaleler

    Bu konuda birçok forumda konular açılmış yazılar yazılmış fakat genelde soru soran kişiler aradıklarına cevap bulamamış. Kimisinde Photoshop kullanarak CSS'i oluşturma anlatılmış, kimisinde Photoshop eklentisi ile WordPress teması oluşturmak anlatılmış, bazı sitelerde ise bu konuya detaylı olarak değinilmiş. Türkçe sitelerde sonuç tek bir dökümana ulaşıyor: Fatih Hayrioğlu tarafından hazırlanan CSS Başlangıç Kitabı..Bu işlere merak saldıysanız kesinlikle okumanızı öneriyorum, çünkü bu kitap CSS dünyasına açılan kapının anahtarı

    CSS konusunda Fatih Hayrioğlu'nun Not Defteri bulabileceğiniz en güzel Türkçe kaynaklardan bir tanesi. Temel CSS Dersleri, CSS ipuçları, CSS teknikleri ve problemlerin çözümleri CSS Dersleri sayfasında sizleri bekliyor.

    1- O kadar bahsetmişken bir de makalesine yer vermezsek olmaz yani 3 yazıdan oluşan seride Fatih Bey, dökümünü yapmış olduğu bir projeyi baştan sona anlatmış. Baya emekle yazılan bu yazı serisini okumadan geçmeyin bence..

    PSD'den HTML'e - fanatikmarslar.com Sitesinin Kodlaması

    Bölüm-1-Bölüm-2-Bölüm-3

    2- Değerli dostum Beyaz'ın sitesinde bu konu ile alakalı, oldukça basit anlatılmış güzel bir yazı yer alıyor. O da bu konuda arayışta olan arkadaşlar için yazmış

    Adres: Psd to Css

    noimage


    3- Adım Adım Web Tasarımı - PSD'den HTML'e..

    Tutsplus tarafından hazırlanmış güzel bir döküman daha. CSS ile alakalı her döküman arayışımda sürekli karşıma çıkan bir yazı. Faydalı olmak istiyorum dercesine okurlarına ulaşmak istiyor heralde

    Adres: From PSD to HTML: Building a Set of Website Designs Step by Step | Nettuts+


    noimage

    4- Sıfırdan Portföy Sitesi Oluşturmak

    Bu yazıyı CSS-XHTML'e merak saldığım ilk zamanlarda okumuştum. Aradan yaklaşık 3 sene geçmesine rağmen CSS bilgime yeni şeyler ekleyememek, benim için oldukça üzücü bir durum. Umarım yazıyı okuyanlar bu düşünce ile yol almaz

    Adres. Build a Sleek Portfolio Site from Scratch | Nettuts+

    5- Oldukça basit bir anlatıma sahip olan başka bir PSD dönüşüm dökümanı..

    Adres: The Design Lab: PSD Conversion | hv-designs

    Şimdilik bu kadar. Daha güzellerini gördükçe bu yazıya eklemeye çalışacağım. Yazı biraz uzun oldu farkındayım, umarım açar açmaz sekmeyi kapatmazsınız. Bu satırı okuduğunuza göre sekmeyi kapatmayanlardansınız

    Yazı hazırlanırken kullanılan derleme adresleri:

    43 PSD to XHTML, CSS Tutorials Creating Web Layouts And Navigation

    http://designm.ag/resources/converting-psd-to-html/

    38 Great Tutorials To Convert PSD To HTML/CSS | Design Inspiration

    Faydalanabileceğiniz siteler:

    Css/XHtml/W3C
#05.10.2012 19:24 0 0 0
  • tebrikler faydalı
#05.10.2012 19:26 0 0 0