Selamlar forum sakinleri. Web dilleriyle ilgili bilgim epey kısıtlı yani temel html kodlarını biliyorum html düzenlerim ama css, js gibi mevzular işin içine girince fransız kalıyorum. Asıl işim tasarım bir siteyi komple photoshop ile tasarlayıp kesip biçerim fakat htmlye aktaramıyorum. Bununla ilgili eğitim almayı düşünüyorum. Bilen arkadaşlara belki de komik gelecek olan asıl cahilce sorum Photoshop ile bir siteyi tasarladım diyelim Bu tasarımın responsive halini nasıl yapıyoruz mümkün mü öyle bir şey.
Altında nasıl bir sistem yatıyor iki farklı psd hazırlamak gibi bi şey mi?
PSD to HTML Hakkında Cahilce Bir Soru
9
●150
- 14-12-2020, 21:11:43
Üyeliği durdurulduHayır kodlarken ona göre kodluyorsunuz tabi tasarımında buna uygun olması önemli. Şöyle örnek vereyim bir tane kutunuz var tasarımda kodlarken buna 300px width vermek yerine 20% olarak veriyorsunuz mesela her çözünürlüğe göre boyutlansın diye + @media seçicileri var özel çözünürlüklere uygun css'leri düzenlemek için biraz alengirli bir konu ama ekstra bir tasarım gerekmiyor
- 14-12-2020, 21:11:52Farklı bir PSD hazırlayabilirsiniz veya geliştirici uygun gördüğü ve uygun göreceğiniz şekilde kesip biçer.enisyavuz adlı üyeden alıntı: mesajı görüntüle
- 14-12-2020, 21:13:20Basitçe mobilde uyumlu olması için html yazılarımda
<html><meta name="viewport" content="width=device-width, initial-scale=1.0">
bunu kullanıyorum telefona uyumlu hale geliyor. Yine benzer şekildedir muhtemelen. - 14-12-2020, 21:14:59Kaba olmak istemiyorum ama artık şu bootstrap ı görmekten bıktım ya responsive demek bootstrap demek değil ya cidden koca ülkede ki algı bu ya. Responsive CSS içinde olan bir şey JS'nin içinde de olan bir şey sabit boyutlar yerine esnek boyutlar veriyorsunuz veya ekran boyutuna göre boyutlandırmalar yapıyorsunuz. Boostrap ise sadece 12 colondan oluşan 1140 genişliğinde ki tasarımları fazlası da olabilir. Daha kolay bir şekilde responsive yapmak için içerisinde hazır kodları barındırıyor. Mesela siz 3 tane yan yana kutu yaptınız bunlar için css yazmanız lazım ama bootstrap grid sistemine göre çizilmiş ise tasarım siz direkt col-4 diyorsunuz ve 4 kolonu kaplıyor 4 kolondan toplam kaç yapar 12 yani 3 tane yan yana kutu oluşturmuş olursunuz.mimarkaan adlı üyeden alıntı: mesajı görüntüle
Kısaca responsive dediğimiz olay bir teknik ve bir çok şekilde de yapılabilir. Bunu bir şey ile bağdaştırmayalım. Yeri gelir js kullanırsın yeri gelir css. Yeri gelir PHP ile user agent'ten bilgi alırsın mobil ise ayrı bir html yapısı eklersin masaüstü ise ayrı. - 14-12-2020, 21:18:33mimarkaan adlı üyeden alıntı: mesajı görüntüle teşekkür ederim bilgi için.
Teşekkürler kafama daha şekillendi.PANDAA adlı üyeden alıntı: mesajı görüntüleHayır kodlarken ona göre kodluyorsunuz tabi tasarımında buna uygun olması önemli. Şöyle örnek vereyim bir tane kutunuz var tasarımda kodlarken buna 300px width vermek yerine 20% olarak veriyorsunuz mesela her çözünürlüğe göre boyutlansın diye + @media seçicileri var özel çözünürlüklere uygun css'leri düzenlemek için biraz alengirli bir konu ama ekstra bir tasarım gerekmiyor Photoshop için bu işlere özel bir plugini var mı acaba.
Teşekkürler cevabınız için.Misafir adlı üyeden alıntı: mesajı görüntüle
Dreamweaver'a biraz göz attım XD ye de bakıcam hocam teşekkürler.NextWorld adlı üyeden alıntı: mesajı görüntüle
Teşekkürler araştıracağım kodları.omergundogar adlı üyeden alıntı: mesajı görüntüle - 14-12-2020, 21:20:25 Üyeliği durdurulduPlugin degilde google'dan photoshop grid olarak aratırsanız gridlere uygun tasarımlar mobilde daha iyi olur.enisyavuz adlı üyeden alıntı: mesajı görüntüle teşekkür ederim bilgi için.
Teşekkürler kafama daha şekillendi. Photoshop için bu işlere özel bir plugini var mı acaba.
Teşekkürler cevabınız için.
Dreamweaver'a biraz göz attım XD ye de bakıcam hocam teşekkürler.
Teşekkürler araştıracağım kodları.
