Skip to content

Duyarlı Web Tasarımı Nedir?

21 de Mayıs de 2021

Tabletlerden telefonlara ve büyük masaüstü bilgisayarlara kadar dünya çapında kullanılan milyonlarca cihaz var. Cihaz kullanıcıları, aynı web sitelerini bu cihazların herhangi birinde sorunsuz bir şekilde görüntüleyebilmek ister. Duyarlı web sitesi tasarımı, web sitelerinin cihazdan bağımsız olarak tüm ekran boyutlarında görüntülenebilmesini sağlamak için kullanılan bir yaklaşımdır.

Duyarlı Web Sitesi Tasarımı Nedir?

Duyarlı web tasarımı, web sitesi içeriğinin ve genel tasarımın, onu görüntülemek için kullandığınız cihaza göre hareket etmesini ve değişmesini sağlayan bir yöntemdir. Başka bir deyişle, duyarlı bir web sitesi yanıt verir cihaza bağlanır ve web sitesini buna göre oluşturur. Örneğin, şu anda bu pencereyi yeniden boyutlandırırsanız, Lifewire web sitesi taşınacak ve yeni pencere boyutuna sığacak şekilde kayacaktır. Web sitesini mobil cihazınızda açarsanız, içeriğimizin cihazınıza sığması için bir sütuna yeniden boyutlandırıldığını fark edeceksiniz.

Kısa bir tarihçe

Akışkan ve esnek gibi diğer terimler 2004 gibi erken bir tarihte ortaya atılmış olsa da, duyarlı web tasarımı ilk olarak 2010 yılında Ethan Marcotte tarafından icat edildi ve tanıtıldı. Web sitelerinin statik kalanlara karşı “şeylerin gelgitleri” için tasarlanması gerektiğine inanıyordu. “Responsive Web Tasarımı“, terim yükseldi ve dünya çapında web geliştiricilerine ilham vermeye başladı.

Responsive Web Sitesi Nasıl Çalışır?

Duyarlı web siteleri, kesme noktaları olarak da bilinen belirli boyutlarda ayarlama ve yeniden boyutlandırma için oluşturulmuştur. Bu kesme noktaları, belirli bir aralıkta olduğunda tarayıcının düzenini değiştiren belirli bir CSS ortam sorgusuna sahip tarayıcı genişlikleridir. Çoğu web sitesinde hem mobil cihazlar hem de tabletler için iki standart kesme noktası bulunur.

Maskot / Getty Images
Basitçe söylemek gerekirse, tarayıcınızın genişliğini yeniden boyutlandırmaktan veya bir mobil cihazda görüntülemekten değiştirdiğinizde, arkadaki kod yanıt verir ve düzeni otomatik olarak değiştirir.

Duyarlı Tasarım Neden Önemlidir?

Akıllı telefon tutan ve beyaz tahta üzerinde web tasarım fikirlerine bakan kadın

Westend61 / Getty Images
Esnekliği nedeniyle, duyarlı web tasarımı artık herhangi bir web sitesi söz konusu olduğunda altın standarttır. Ama neden bu kadar önemli?

  • Yerinde deneyim: Duyarlı web tasarımı, web sitelerinin, kullandıkları cihaz ne olursa olsun, herhangi bir internet kullanıcısı için sorunsuz ve yüksek kaliteli bir site içi deneyim sunmasını sağlar.
  • İçerik odağı: Mobil kullanıcılar için duyarlı tasarım, boyut kısıtlamaları nedeniyle yalnızca küçük bir snippet yerine yalnızca en önemli içeriği ve bilgileri görmelerini sağlar.
  • Google onaylı: Duyarlı tasarım, Google’ın ayrı cihazlar için birden çok ayrı sayfayı dizine eklemesine gerek kalmadan sayfaya dizine ekleme özelliklerini atamasını kolaylaştırır. Bu, elbette arama motoru sıralamanızı iyileştirir, çünkü Google mobil öncelikli web sitelerine gülümser.
  • Verimlilik tasarrufu: Geçmişte, geliştiricilerin masaüstü ve mobil cihazlar için tamamen farklı web siteleri oluşturması gerekiyordu. Şimdi, duyarlı web tasarımı, tek bir web sitesindeki içeriğin çoğuna göre güncellenmesini mümkün kılarak kritik miktarda zamandan tasarruf sağlar.
  • Daha iyi dönüşüm oranları: Kitlelerine çevrimiçi olarak ulaşmaya çalışan işletmeler için, duyarlı web tasarımının dönüşüm oranlarını artırdığı ve işlerini büyütmelerine yardımcı olduğu kanıtlanmıştır.
  • Gelişmiş sayfa hızı: Web sitesinin ne kadar hızlı yüklendiği, kullanıcı deneyimini ve arama motoru sıralamasını doğrudan etkiler. Duyarlı web tasarımı, sayfaların tüm cihazlarda eşit derecede hızlı yüklenmesini sağlayarak sıralamayı ve deneyimi olumlu yönde etkiler.

Gerçek Dünyada Duyarlı Tasarım

Duyarlı tasarım gerçek dünyadaki internet kullanıcılarını nasıl etkiler? Hepimizin aşina olduğu bir eylem düşünün: çevrimiçi alışveriş.

Mobil cihazın yanında not alırken çevrimiçi alışveriş yapmak için dizüstü bilgisayar kullandığınızı düşünün

Westend61 / Getty Images
Kullanıcı, öğle yemeği molası sırasında masaüstünde ürün aramaya başlayabilir. Satın almayı düşündükleri bir ürünü bulduktan sonra, alışveriş sepetine ekleyip işlerine geri dönüyorlar. Çoğu kullanıcı, bir satın alma işlemi gerçekleştirmeden önce yorumları okumayı tercih eder. Böylece kullanıcı, ürünün yorumlarını okumak için bu kez evde bir tablet üzerinden web sitesini tekrar ziyaret eder. Akşama devam etmek için web sitesini tekrar terk etmeleri gerekir. O gece ışığı kapatmadan önce, mobil cihazlarını alıp web sitesini tekrar ziyaret ederler. Bu sefer, son satın alma işlemlerini yapmaya hazırlar. Duyarlı web tasarımı, kullanıcının bir masaüstünde ürün arayabilmesini, bir tablette yorumları okuyabilmesini ve son satın alma işlemini mobil üzerinden sorunsuz bir şekilde yapabilmesini sağlar.

Diğer Gerçek Dünya Senaryoları

Çevrimiçi alışveriş, duyarlı tasarımın çevrimiçi deneyim için çok önemli olduğu senaryolardan yalnızca biridir. Diğer gerçek dünya senaryoları şunları içerir:

  • Seyahat planlama
  • Satın almak için yeni bir ev arıyorum
  • Aile tatili fikirlerini araştırmak
  • Tarifler aranıyor
  • Haberleri veya sosyal medyayı takip etmek

Bu senaryoların her biri büyük olasılıkla zaman içinde çok çeşitli cihazları kapsayacaktır. Bu, duyarlı bir web sitesi tasarımına sahip olmanın önemini vurgular.

Biçim mla apa chicago Alıntıınız

Miles, Brenna. “Duyarlı Web Tasarımı Nedir?” ThoughtCo, Mayıs. 14, 2021, thinkco.com/what-is-responsive-web-design-4775550.
Miles, Brenna. (2021, 14 Mayıs). Duyarlı Web Tasarımı Nedir? Https://www.thoughtco.com/what-is-responsive-web-design-4775550 adresinden erişildi
Miles, Brenna. “Duyarlı Web Tasarımı Nedir?” ThoughtCo. https://www.thoughtco.com/what-is-responsive-web-design-4775550 (erişim tarihi 21 Mayıs 2021).