Responsive tasarımı bir çok yerde görmüş ve duymuş olmalısınız. Peki nedir bu responsive?
Türkçe’de “duyarlı” anlamına gelen responsive; web sitenizin bilgisayar, tablet, akıllı telefonlar gibi bir çok cihazda uyumlu olarak gösterilmesi demektir. Sitenin kodlaması tüm ekran boyutlarına göre ayarlanır.
Eski sistemde bilgisayar kullanıcıları ile mobil/tablet kullanıcıları arasında farklar vardı. Web sitesini bilgisayarından görüntüleyen ziyaretçi tüm sayfayı görürken, mobildeki ziyaretçi ekranın bir kısmını görmekteydi. Responsive tasarım sayesinde artık bu sıkıntı ortadan kalkmış oldu.
Gelin bahsettiğimiz farklı cihaz boyutlarına birlikte göz atalım.
BİLGİSAYAR | GENİŞLİK | YÜKSEKLİK |
Samsung Chromebook | 1366 px | 768 px |
MacBook Pro 17’ | 1920 px | 1200 px |
MacBook Pro 15’ | 2880 px | 1800 px |
MacBook Pro 13’ | 2560 px | 1600 px |
TABLET | GENİŞLİK | YÜKSEKLİK |
Apple iPad 1&2 | 768 px | 1024 px |
Apple iPad 3&4 | 1536 px | 2048 px |
Samsung Galaxy Tab 2 | 600 px | 1024 px |
Google Nexus 10 | 1600 px | 2560 px |
TELEFON | GENİŞLİK | YÜKSEKLİK |
iPhone 4 & 4S | 640 px | 960 px |
iPhone 11 | 828 px | 1792 px |
Samsung Note 10 | 1080 px | 2280 px |
Huawei P30 Pro | 1080 px | 2340 px |