@nisantekinTasarımı tarayıcı destekliyor mu diye geliştiriciye sormadan önce baktığım yer: Can I use
İzmir'de serbest UI ve UX tasarımcısıyım. Tasarım teslim ettikten sonra geliştiriciden en sık duyduğum cümle şuydu: 'Bunu yaparız ama şu tarayıcıda bozulur.' Bir süre sonra bu konuşmayı tasarım aşamasında, kendi başıma yapabileceğimi fark ettim. Aracım Can I use oldu ve artık tasarım dosyasını göndermeden önce bir kez açmadan rahat etmiyorum.
Site, web teknolojilerinin hangi tarayıcının hangi sürümünde desteklendiğini tablo olarak gösteriyor. Arama kutusuna bir CSS özelliğinin ya da web teknolojisinin adını yazıyorsunuz; örneğin bir grid düzeni, yeni görüntü alanı birimleri ya da sayfalar arası geçiş animasyonları. Karşınıza tarayıcıların sürüm sürüm renklendirildiği bir tablo çıkıyor: yeşil destekliyor, kırmızı desteklemiyor, sarı kısmen destekliyor. Kısmi desteğin altında notlar var ve çoğu zaman asıl önemli bilgi o notlarda.
Bir tasarımcı olarak beni en çok etkileyen kısım küresel kullanım yüzdesi. Her özelliğin yanında, o özelliği destekleyen tarayıcıları kullananların dünya genelindeki oranı yazıyor. Ayarlardan ülke ya da kıta da seçilebiliyor. Bir de kendi sitenizin analitik verisini içe aktarıp kendi ziyaretçilerinizin ne kadarının bu özelliği görebileceğine bakma imkânı var. Müşterinin sitesine gelenlerin büyük kısmı eski bir kurumsal tarayıcıyla geliyorsa, çok yeni bir efekti tasarımın merkezine koymamam gerektiğini bu ekrandan anlıyorum.
Benim kullanım düzenim şöyle:
1. Tasarımda yeni bir yerleşim ya da efekt kullanacaksam önce desteğe bakıyorum.
2. Destek düşükse bunu dosyada not olarak bırakıyorum ve özelliğin desteklenmediği tarayıcıda nasıl görüneceğini ayrıca tasarlıyorum. Yani efekt yoksa da ekran düzgün dursun.
3. Geliştiriciyle konuşurken tablonun bağlantısını paylaşıyorum. Tartışma 'bence olur, bence olmaz' olmaktan çıkıyor.
4. Ana sayfadaki son eklenen özellikler listesine ara sıra göz atıyorum; yeni bir şey olgunlaşmışsa haberdar oluyorum.
Kod yazmayan biri için ilk başta biraz teknik görünebilir ama arama kutusuna kullandığınız özelliğin adını yazmak yeterli. Tasarımla kod arasındaki köprüyü güçlendirmek isteyen her tasarımcıya öneririm; geliştiriciyle ilişkiniz de bir anda düzeliyor.
Site, web teknolojilerinin hangi tarayıcının hangi sürümünde desteklendiğini tablo olarak gösteriyor. Arama kutusuna bir CSS özelliğinin ya da web teknolojisinin adını yazıyorsunuz; örneğin bir grid düzeni, yeni görüntü alanı birimleri ya da sayfalar arası geçiş animasyonları. Karşınıza tarayıcıların sürüm sürüm renklendirildiği bir tablo çıkıyor: yeşil destekliyor, kırmızı desteklemiyor, sarı kısmen destekliyor. Kısmi desteğin altında notlar var ve çoğu zaman asıl önemli bilgi o notlarda.
Bir tasarımcı olarak beni en çok etkileyen kısım küresel kullanım yüzdesi. Her özelliğin yanında, o özelliği destekleyen tarayıcıları kullananların dünya genelindeki oranı yazıyor. Ayarlardan ülke ya da kıta da seçilebiliyor. Bir de kendi sitenizin analitik verisini içe aktarıp kendi ziyaretçilerinizin ne kadarının bu özelliği görebileceğine bakma imkânı var. Müşterinin sitesine gelenlerin büyük kısmı eski bir kurumsal tarayıcıyla geliyorsa, çok yeni bir efekti tasarımın merkezine koymamam gerektiğini bu ekrandan anlıyorum.
Benim kullanım düzenim şöyle:
1. Tasarımda yeni bir yerleşim ya da efekt kullanacaksam önce desteğe bakıyorum.
2. Destek düşükse bunu dosyada not olarak bırakıyorum ve özelliğin desteklenmediği tarayıcıda nasıl görüneceğini ayrıca tasarlıyorum. Yani efekt yoksa da ekran düzgün dursun.
3. Geliştiriciyle konuşurken tablonun bağlantısını paylaşıyorum. Tartışma 'bence olur, bence olmaz' olmaktan çıkıyor.
4. Ana sayfadaki son eklenen özellikler listesine ara sıra göz atıyorum; yeni bir şey olgunlaşmışsa haberdar oluyorum.
Kod yazmayan biri için ilk başta biraz teknik görünebilir ama arama kutusuna kullandığınız özelliğin adını yazmak yeterli. Tasarımla kod arasındaki köprüyü güçlendirmek isteyen her tasarımcıya öneririm; geliştiriciyle ilişkiniz de bir anda düzeliyor.
11 2 yorum
