Yazar: suat 16 Mart 2020
Responsive web tasarım, internet sitelerinin farklı cihazlarda (bilgisayarlar, tabletler, akıllı telefonlar vb.) doğru şekilde görüntülenmesini sağlamak için tasarlanmış bir tekniktir. Bu teknik, web sitelerinin, farklı ekran boyutlarına ve cihazlara otomatik olarak uyum sağlamasını sağlar.
Responsive web tasarım, sayfanın boyutuna göre değişen bir şekilde tasarlanan esnek bir grid sistemi kullanır. Bu sayede, içerik ve görseller farklı boyutlarda görüntülenebilir ve sayfanın okunabilirliği, kullanılabilirliği ve erişilebilirliği artırılır.
Responsive web tasarım, ayrıca kullanıcı deneyimini de iyileştirir. Site ziyaretçileri, farklı cihazlarda aynı web sitesini ziyaret ederken, tutarlı bir deneyim yaşarlar ve web sitesinde gezinmek daha kolay hale gelir.
Sonuç olarak, responsive web tasarım, internet sitelerinin farklı cihazlarda doğru şekilde görüntülenmesini sağlayarak, kullanıcı deneyimini artırır ve web sitesinin erişilebilirliğini ve kullanılabilirliğini iyileştirir.
2011-2012 tarihine kadar web siteleri 960 piksel gibi sabit bir genişlikte oluşturulabilir. Tüm kullanıcıların aşağı yukarı tutarlı bir deneyim kazanması bekleniyordu. Ancak şimdi tabletler, netbook’lar ve akıllı telefonlar var. Kullanıcılar Web’de mobil cihazlarında eskisinden daha sık geziniyorlar. Bu nedenle, son kullanıcının küçük ekranda tatmin edici bir deneyime sahip olması çok önemlidir. Sürekli genişleyen tarayıcı ve cihaz manzarasının çözümü, bir web sitesinin birden fazla cihaza ve ekrana uyum sağlamasına izin veren HTML5 ve CSS3 ile oluşturulmuş İzmir Responsive bir web tasarımıdır.
Ethan Marcotte (2014) “İzmir Responsive web tasarımı” terimini kullanmıştır. List Apart makalesinde üç mevcut tekniği birleştirdi (esnek ızgara düzeni, esnek görüntüler ve medya ve medya sorguları). Bu tez esnek düzenleri ve medya sorgularını açıklamaya odaklanmaktadır.
Esnek tasarımlar, portre ve manzara modlarına sahip cihazlara mükemmel uyum sağlar (Bkz. Resim 8). İzmir Responsive bir tasarım oluşturmak için kullanılabilecek birçok CSS ızgara sistemi vardır. İzmir Responsive ızgaralar CSS’de çeşitli yöntemler kullanılarak yapılır: negatif kenar boşlukları, kutu boyutlandırma: kenarlık kutusu, tablo ekranını kullanma, flexbox kullanma.
Bu yöntem, her blok arasında sabit bir kenar boşluğu olan ızgara blokları oluşturmak için negatif kenar boşlukları kullanır. CSS’deki negatif kenar boşlukları, bir belgedeki nesnelerin çakışmasına izin veren değerlerdir (Mozilla Developer Network, 2014). Örnek: Negatif Kenar Boşlukları
