Merhaba arkadaşlar,

Blog sayfamızın ilk makelesinde sizlere responsive design kavramından bahsetmek istiyorum. Responsive kelime anlamı olarak duyarlı, esnek responsive design ‘duyarlı yapı’ anlamına gelmektedir. Günümüzde böyle standart bir yapıya neden ihtiyaç duyulmuştur, nerelerde kullanma ihtiyacı duyarız.

Gelişen teknoloji her alanda olduğu gibi web alanında da hayatımıza kolaylıklar ve yenilikler sunmaktadır. Bugün haber okumak için girdiğimiz haber siteleri, ihtiyacımız olan ürünleri satın almak için kullandığımız ticaret siteleri veya kullanım amacı ne olursa olsun zamanımızı harcadığımız internet siteleri gelişen web teknolojisinin yansımasıdır. Bu kadar farklılığın içinde ziyaret ettiğimiz her sitenin çözünürlüğü farklıdır hatta kullandığımız bilgisayarın, telefonun, tabletin çözünürlükleri de birbirlerinden farklıdır.Tasarımcılar bu noktada farklı çözünürlükte web sitesi sunmanın problem yaratacağına karar vermişler. Örnek olarak yüksek çözünürlüğe sahip bir ekranda, detaylar sıkışık bir ekrandakine göre daha fazladır. İşte bu farklılıklar içinde görüntü için standart bir yapı kurmak amacıyla responsive web design kavramı ortaya çıkmıştır. Web tasarımcıları tek bir sitenin farklı platformlarda farklı çözünürlüğe sahip olmasını engellemek istemişlerdir.

Birçok web geliştiricisi bu problemi ilk başlarda görmezden gelmiştir. Bu durum esnek olmayan yapıları doğurmuştur.

Yukarıdaki resimlerde esnek bir yapı kullanılmıyan web sitesi görünmektedir. Bu problemlerin ortaya çıkışı responsive design kavramını doğurmuştur. Uygulanmaya başlanan responsive design, web geliştiricilerine bir tek web sitesi üzerinde tasarım ve içeriklerini kolaylıkla dijital aletlere uyarlamalarına olanak sağlamıştır. Bu gelişme kullanıcılar için çok tatmin edici bir deneyim imkanı sunmaktadır. Responsive web design kavramı web tasarımcı ve geliştirici Ethan Marcotte tarafından bulunmuştur. Mimarlık konusuna olan ilgisi ile ilk olarak Responsive Architecture kavramını geliştirmiştir. Responsive Architecture mantığı moving structure (hareketli yapı), color-changing walls (renk değiştiren duvarlar) sabitlerini kullanmayı esas alır.

Yukarıdaki resimde insanların ihtiyaçlarına göre değişen duvar renklerini görmekteyiz. Hareketli duvarlar ile değişen duvar renkleri Responsive Architecture yapısının temel mantığıdır. Bu fikir daha sonra Responsive web design fikrinin doğmasına olanak sağlamıştır.

Bir çok web geliştiricisi “öncelik masaüstü” felsefesiyle web sitelerinin tasarımı masaüstü bilgisayar ve laptoplar için tasarladılar. Bu felsefede haklılardı çünkü mobil cihaz kullanım sayısı çok azdı ve masaüstü için tasarlanmış bir web sitesini mobile cihaz için optimize etmeye gerek duyulmamıştı. Ama yakın geçmişte bu düşüncenin yanlış olduğu ortaya çıkmış ve mobil cihazlar için optimum hale getirilmesi gerektiği düşüncesi önemli bir yere sahip olmuştur.

Bugun mobil cihazlar bizim gerçek bilgisayarlarımız konumundadır. İnterneti kullanmak, mail transferi, sosyal ağ paylaşımları için dijital yaşamımız olmuşlardır. İşte nu noktada responsive design yapısını göz ardı etmek yanlış bir tutum olacaktır.

Yukarıdaki resimlerde soldakinde desktop web sitesi örneği verilmiştir. Sağdakinde ise aynı sitenin optimize edilmiş yapısını görmekteyiz.

Responsive design yapısının tanımını, kullanım amacını ve ne gibi sorunları çözme amacı olduğunu sizlerle paylaşmaya çalıştım, Responsive design yapısı kullanılan ve kulanılmayan örnekleri sizlere sunmak istememim amacı, bu yapıyı tasarlıcağınız web sitelerine uygulayarak kullanıcılara rahat bir kullanım imkanı ve görsel açıdan esnek bir görüntü sunmuş olursunuz. Eğer hiç kullanmadıysanız şimdi kullanmanın tam zamanı. Umarım faydalı bir yazı olmuştur bir sonraki makalemde farklı bir konuyla görüşmek üzere.