Herkese merhabalar, internette yayınlanmış ücretsiz gözüme hoş gelen PSD web temalarını, responsive olarak kodlamasını yapıyorum.
GitHub Repo: https://github.com/eray-sga/polo360
Site Demo: https://eray-sga.github.io/polo360/
Tasarımın paylaşılmış ön izlemesi:
https://i.hizliresim.com/GDWYrb.jpg
Peki nedir bu PSD to HTML-CSS denen olay?
İşin piyasadaki adı, PSD to CSS, PSD to HTML olarak geçmektedir. Bu çalışmanın döngüsü şu şekildedir:
Bir web sitesi kodlanmadan önce Photoshop ile çizimi yapılır. Daha sonra bu Photoshop tasarımı, yani PSD dosyası birebir en uygun biçimde HTML, CSS, JavaScript veya Bootstrap, JQuery gibi ek kütüphanelere de ihtiyaç duyulursa kodlaması yapılır. Peki neden önce Photoshop ile çizilir, ne gerek var, amelelik değil mi? Bunun sebebi, şirketlerin ya da freelance çalışan kişilerde olabilir, müşterinin web sitesi ihtiyacını öncelikle grafik programları ile çizilip müşteriye JPEG veya PSD formatında gönderilerek tasarımın onayının alınması amacı ile yapılmaktadır. Tasarım beğenilirse kodlaması yapılır. Yani bu olayın mantığı budur.
Bu kodladığım proje Bootstrap framework alt yapısı ile responsive bir şekilde kodlanmıştır. Ek olarak CSS ile gerekli özelleştirmeler ve media sorguları yardımıyla responsive düzenlemeler yapılmıştır.
NOT: Tasarımda gözümden kaçmış bir nokta olabilir, burada devreye siz giriyorsunuz. :trl
GitHub Repo: https://github.com/eray-sga/polo360
Site Demo: https://eray-sga.github.io/polo360/
Tasarımın paylaşılmış ön izlemesi:
https://i.hizliresim.com/GDWYrb.jpg
Peki nedir bu PSD to HTML-CSS denen olay?
İşin piyasadaki adı, PSD to CSS, PSD to HTML olarak geçmektedir. Bu çalışmanın döngüsü şu şekildedir:
Bir web sitesi kodlanmadan önce Photoshop ile çizimi yapılır. Daha sonra bu Photoshop tasarımı, yani PSD dosyası birebir en uygun biçimde HTML, CSS, JavaScript veya Bootstrap, JQuery gibi ek kütüphanelere de ihtiyaç duyulursa kodlaması yapılır. Peki neden önce Photoshop ile çizilir, ne gerek var, amelelik değil mi? Bunun sebebi, şirketlerin ya da freelance çalışan kişilerde olabilir, müşterinin web sitesi ihtiyacını öncelikle grafik programları ile çizilip müşteriye JPEG veya PSD formatında gönderilerek tasarımın onayının alınması amacı ile yapılmaktadır. Tasarım beğenilirse kodlaması yapılır. Yani bu olayın mantığı budur.
Bu kodladığım proje Bootstrap framework alt yapısı ile responsive bir şekilde kodlanmıştır. Ek olarak CSS ile gerekli özelleştirmeler ve media sorguları yardımıyla responsive düzenlemeler yapılmıştır.
NOT: Tasarımda gözümden kaçmış bir nokta olabilir, burada devreye siz giriyorsunuz. :trl
