RESPONSİVE TASARIM ÖLÇÜLERİ

Web tasarım sayfamızı hazırlarken responsive (mobil) tasarım ölçüleri neye göre tasarım yapılmalı bu konuyu ele alacağız. Responsive tasarım nedir sorusunun cevabını anlatmıştık. Responsive tasarım (mobil tasarım) çalışmalarında birçok ölçü baz alınmakta olup tavsiye edebilceğimiz 4 ölçü ile tasarımı sonlandırabiliriz. Yapılan web tasarım siteleri bu ölçülerle mobil, tablet, masaüstü, büyük ekranlara göre duyarlı siteler olucaktır.

Responsive tasarım nasıl yapılır? Responsive tasarım yapmak istediğimiz websitenin kullanılabilirliğini göz önüne alındığında yapmamız gereken mobil tasarım ölçüleri belirtiğimiz 4 ölçüye göre tasarlanması yeterlidir. En çok kullanılan responsive tasarım ölçüleri aşağıdaki gibidir.

Peki responsive tasarım yapmak için uygulamamız gereken responsive tasarım kodu nasıl olduğunu aşağıdaki listede belirtelim.

• Mobil tasarım için 768px genişliğinden küçük ölçülere göre css yazılmalı.
• Tablet tasarım için 768px genişliğine eşit ve büyük ölçülere göre css yazılmalı.
• Masaüstü tasarım için 992px genişliğine eşit ve büyük ölçülere göre css yazılmalı.
• Büyük ekran tasarım için 1200px genişliğine eşit ve büyük ölçülere göre css yazılmalı.

Responsive tasarım yapmak için kullanışlı bir framework olan bootstrap kullanabiliriz. Responsive tasarım ölçüleri ve responsive tasarım kodu içinde var olan bir framework ile responsive (mobil) tasarım yapabirsiniz. Bootstrap nedir? Nasıl kullanılır? yazımızı inceleyerek responsive tasarım kullanımı hakkında bilgi alabilirsiniz.