Responsive Web Tasarım(Design) Nedir?

Responsive web tasarımı, farklı ekran boyutları ve çözünürlüklerine uyum gösteren; her türlü ekranda(masaüstü, laptop, tablet, cep telefonu) okunurluğu yüksek web sitesi tasarımları demektir.

Normalde masaüstü PC’ler için hazırlanmış bir web sitesi, mobil cihazlarda zoom out olarak gözükür ve bu boyutunda da okunması oldukça zordur. Aşağıdaki resimde ne demek istediğimi anlayacaksınız. Hepsiburada.com’ un ayrıca mobil uygulaması bulunmaktadır ama web sitesini mobil adresinden açmadığınız takdirde aşağıdaki gibi kullanışsız şekliyle görünmektedir.

responsive-olmayan-tasarim


Responsive site tasarımdaysa web sitesi mobil cihazın çözünürlüğüne response edecek(uyum sağlayacak) ve okunurluğu bozulmadan görünecektir. Aşağıdaki resimde responsive bir web sitesi görmektesiniz. Yukarıdakinin askine kullanıcının rahatlığına uygun ve okunabilir bir durumda…

responsive-web-sitesi-ornek

Responsive bir web sitesi yaptırmak demek; hem masaüstü PC’ lere ve laptoplara tasarım sağlamak hem de mobil uyumlu web sitesi yaratarak tablet ve telefonlarda da uyum göstermek demektir. İşin aslı tek bir tasarımla birçok iş yapmaktır…

Responsive site yaptırmak için birçok sebebiniz vardır. Detaylarına şuan girmeyeceğim fakat en büyük sebeplerinden biri kullanıcı deneyimi için oldukça önemli olmasıdır. Kullanıcı deneyimi, Google gibi arama motorlarında yapılan aramalarda üst sıralara çıkmak demektir. Kısacası Google’da üst sıralara yükselmek için Responsive Web Sitesi yaptırmanız şarttır.

Responsive web sitesi nasıl yapılır?

Çok basit olarak responsive site yapımını maddeler halinde açıklayacağım:

  1. Sabit bir genişlik ve yükseklik vermek yerine yüzde oranına göre ayarlamalar yapılmalıdır.
  2. Farklı ekran çözünürlüklerine göre farklı kodlamalar eklenmelidir.
  3. Grid sistemi kullanılmalıdır.Genel tasarım oluşturulurken mobil görünümüde düşünülerek uygun bir yapı oluşturulmalıdır.
  4. Son olarak işi basitleştirmek için Bootstrap veya Materializecss gibi responsive yapıya uygun hazır framework’ler kullanılabilir.

Responsive Test

Responsive web sitenizin mobil cihazlarda nasıl görüneceğini test etmek için Google bir site oluşturmuştur.

Resizer web sitesi ile sizde responsive test yapabilirsiniz.

Responsive bir web sitesi yaptırmak istiyorsanız veya bu konuyla alakalı öğrenmek istediğiniz her hangi bir şey varsa bana info@aedizayn.com e-posta adresinden ulaşabilirsiniz.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir