Blog

Web tasarım günümüzde kullanılan en yaygın pazarlama ağıdır. Bu sebeple doğru bir internet sitesi ile potansiyel müşterilerinizi arttırarak daha fazla kazanç elde edebilirsiniz. Elbette doğru bir web tasarım sahibi olmak da göründüğü kadar kolay değildir. Özellikle Google olmak üzere arama motorları nitelikli bir internet sitesi için pek çok kriter aramaktadır. Zaman içinde değişen ve gelişen bu kriterlere bir örnek verecek olursak son zamanlarda özellikle responsive (mobil uyumluluk) çalışması ön plandadır.

Responsive web tasarım, akıllı cihazlar için (tablet, telefon vb.) web sayfaların ekrana tam oturması ve ekran çözünürlüğünün ekrana uymasıdır. Mükemmel kalitenin yakalanması için yapılmış tasarımlardır. Responsive tasarım nedir? Sorusuna yanıt olarak duyarlı tasarım diyebiliriz. Çünkü tüm akıllı cihaz ekranlarına uyumlu olarak özel olarak tasarlanmıştır.

Responsive Tasarım
Responsive tasarım Duyarlı tasarımın amacı, tek bir alana sahip olmaktır. Ancak farklı boyutlardaki cihazlarda görüntülendiğinde ekranın boyutuna sığmalıdır. Geleneksel bir “sabit” internet sitesini baz alalım. Örneğin, bir masaüstü bilgisayar ortamında görüntülendiğinde, internet sitesi üç sütun olarak gösterilir. Ancak aynı düzeni daha küçük bir tablette gördüğünüzde, sizi yatay olarak kaydırmaya zorlayabilir. Bu durum kullanıcıları iyi değil etkiler. Daha küçük bir akıllı cihaz olan telefonlarda sabit internet siteleri bir hayli sorun yaratmaktadır. Büyük görüntüler düzeni bozabilir ve sitenin yüklenmesi bir haylizaman alır. Ancak, bir site duyarlı yani responsive tasarım kullanıyorsa, tablet sürümü otomatik olarak sadece iki sütunu görüntülemek üzere ayarlanabilir. Bu şekilde, içerik okunabilir ve gezinmesi kolay hale gelir. Telefonlarda ise görüntülerin düzeni bozulmaz, yalnızca yeniden boyutlandırılır. Bu sayede daha güzel bir görüntü elde edebilirsiniz. Responsive tasarım ile yapılan internet siteleri, kendilerini cihaza göre ayarlayabilir. Duyarlı tasarımıyla, internet sitesi otomatik olarak izleyicinin gördüğü cihaza göre ayarlar.

Responsive Web Tasarımı Nasıl Çalışır?
Responsive web tasarımDuyarlı sitelerde sayfalar, öğelerini piksel yerine oranla boyutlandırmıştır. Dolayısıyla, üç sütununuz var ise, her birinin tam olarak ne kadar geniş olması gerektiğini ayarlayamazsınız. Bunun yerine diğer sütunlarla ilişkili olarak ne kadar geniş olması gerektiğini ayarlayabilirsiniz. Örneğin sütun 1 sayfanın yarısını almalı, sütun 2 % 30’unu almalı ve sütun 3 % 20’sini almalıdır. Bu gibi oranlar ile sayfalar düzenlenmektedir. Mobil cihazlardan internette girme oranı %45’tir. Bu sayede responsive tasarım yaptırmanın neden bu kadar önemli olduğunu anlıyoruz. Gün geçtikte bu oran artmaya başlayacaktır çünkü herkeste bulunan mobil cihazlara, her yerde erişebiliyoruz. Sizin sitenize kaç kişinin mobilden girdiğini test etmek için site trafiğini gösteren web araçlarını deneyimleyin. Bir çok sitede olduğu gibi sizin sitenize de mobilden girenlerin sayısı fazlaca gözükecektir. Bu %n piksel yerine ortan kullanılmalı ve tüm ekran boyutlarına sitenizi sığdırmalısınız.

Neden Responsive Web Siteleri Tercih Edilir?
Günümünzdeki web tasarım firmaları genelde mobil uyumlu internet sitesi tasarlarlar. Hem kendi referanslarını çoğaltmak için, aynı zamanda müşterinin memnun olması için bunu yapmaları şarttır. Geçen yıllara göre her yıl mobil uyumlu internet siteleri artış göstermektedir. Hal böyle olunca herkes responsive tasarım yaptırmak istemektedir. Mobil kullanıcılar, bilgisayar kullanıcılarına göre daha fazla oldukları için, onlar için tasarımı yapılmış internet siteleri bir hayli dikkat çeker. Bu sayede kullanıcılar sitede daha fazla vakit çekirir. Çünkü kullanılması kolaydır. Mobil internet kullanımının hızla yaygınlaştığı günümüzde, kişi ve kurumların internet sitelerinin akıllı cihazlarda problemsiz görüntülenmesi ve rahat gezinti yapılması hedef müşteri kitlesi için oldukça önemlidir. Tek bir tasarımla her cihazda aynı kalitenin yakalanması demek maliyetlerin de düşmesi demektir. Yani her cihaz için farklı ayar maliyetleri ortadan kalkar. Üstelik tek bir domain ile tüm ekran boyutlarına duyarlı bir sitenizin olması sizin veya şirketiniz için son derece önemlidir.

Duyarlı Web Siteleri Nasıl Yapılır?
Web sitesinin düzeninde, ekrana bağlı dinamik değişiklikleri hayata geçirmek için farklı kod parçacıkları kullanılır. Aşağıda, duyarlı web tasarımının ana bileşenlerinden bazıları verilmiştir.

Responsive tasarım duyarlılığı sağlamak amacıyla yaygın olarak uygulanmakta olan CSS yöntemleri, medya sorgularını içerir. Bunlar, sadece belirli bir koşul doğruysa bir özellik bloğu ekleyerek çalışır. Tarayıcı genişliğini ifade eder ve her tarayıcıya ayrı kod yazmanızı sağlar. Örneğin masaüstünde görünen bir bloğun mobilde görünmesini istemiyorsak; mobil boyutundaki medya tagları arasında o bloğa display:none veririz. Bu sayede ekran boyutumuz vermiş olduğumuz genişliğe geldiği zaman, o blok yok olacaktır. Bu sayede her çözünürlüğe uygun bir kod yazmış olacaksınız. Medya Sorguları, duyarlı web sayfalarında önemli bir rol oynar. Medya sorguları ile farklı tarayıcı boyutları için farklı stiller tanımlayabilirsiniz. Duyarlı görüntüler, herhangi bir tarayıcı boyutuna uyacak şekilde güzel bir şekilde ölçeklenen resimlerdir. CSS width özelliği % değerine ayarlandığında, tarayıcı penceresi yeniden boyutlandırıldığında görüntü ölçeklenir ve küçülür. Bu sayede dilediğimiz tasarımları yapabiliriz. Yapımı zor gibi gözükse de esasında normal internet sitesinden farkı yok. Sadece biraz zahmetli diyebiliriz.

Responsive tasarım yapan web tasarım ajansları günümüzde sıklıkla tercih edilir. Çünkü yapmış oldukları internet sitesi içeriklerinin her çözünürlüğe uyup okunabilmesi ve site içerisinde kolayca gezilmesi son derece önemlidir.