Desain Web Responsif vs. Pengendalian-Agen Pengguna

Fitur mediapermintaan CSS3 telah menyebabkan banyak kemungkinan menarik dalam hal mengembangkan situs web yang menyesuaikan dengan berbagai ukuran layar dan perangkat.

Namun, dalam praktiknya, saya mulai memahami bahwa mediafitur permintaan CSS3 , dan seluruh gerakan "Desain Web Responsif", mungkin tidak memenuhi janjinya.

Masalah yang saya lihat adalah bahwa, pada akhirnya, pengembang web lebih peduli tentang apakah pengguna mereka melihat konten melalui Desktop, Tablet, atau perangkat Mobile. Tetapi CSS3 hanya menyediakan sarana untuk mendeteksi resolusi layar . Secara teori, mendeteksi resolusi layar sepertinya cara yang bagus untuk menyesuaikan berbagai perangkat yang berbeda. Namun dalam praktiknya ...

Misalkan kita memiliki fungsi Javascript sederhana yang hanya menampilkan lebar layar:

function foo()
{
   alert(screen.width);
}

Di Blackberry Touch saya, output ini:

768

Di Samsung Galaxy saya, output ini:

800

Jadi ... um, pada titik ini, resolusi ponsel pintar umum semakin dekat dengan resolusi tingkat Desktop. Kemampuan untuk mendeteksi apakah pengguna melihat situs web Anda melalui smartphone, tablet, atau desktop, tampaknya semakin sulit jika yang Anda lakukan hanyalah resolusi layar.

Ini membuat saya mempertanyakan seluruh kebijaksanaan di balik seluruh gerakan "Desain Web Responsif" CSS3 berdasarkan pertanyaan media. Tampaknya mediafitur kueri lebih cocok untuk beradaptasi dengan jendela browser yang mengubah ukuran pada layar Desktop, daripada berbagai perangkat seluler.

Teknik lain yang mungkin untuk mendeteksi perangkat seluler atau tablet adalah menggunakan deteksi fitur, dengan memeriksa apakah ontouchstartacara tersebut didukung. Tetapi bahkan ini menjadi semakin tidak dapat diandalkan karena banyak layar Desktop mulai mendukung sentuhan.

Pertanyaan: Jadi ... sebagai pengembang web, jika saya tidak bisa mengandalkan RWD atau deteksi fitur, apakah sniffing agen pengguna (yang terkenal tidak bisa diandalkan seperti biasanya) benar-benar merupakan pilihan terbaik untuk mendeteksi perangkat seluler?

Berhentilah mengkhawatirkan perangkat tertentu.

Kemampuan untuk mendeteksi apakah pengguna melihat situs web Anda melalui smartphone, tablet, atau desktop, tampaknya semakin sulit jika yang Anda lakukan hanyalah resolusi layar.

Itu ini semakin sulit untuk mendeteksi melalui resolusi layar, dan hanya akan mendapatkan lebih keras karena lebih banyak perangkat memasuki pasar, tetapi tujuan kueri media tidak mendeteksi perangkat types.What pertanyaan media baik di adalah membuat tweak untuk desain Anda saat tidak lagi menyenangkan untuk digunakan pada dimensi saat ini. Jika situs mulai berantakan pada lebar 550px, maka tidak masalah jika ada perangkat dengan dimensi tersebut atau tidak: Anda mengatur breakpoint di sana.

Ini sama dengan deteksi fitur. Jika perangkat mendukung sentuhan, lalu apa bedanya jika itu perangkat seluler atau monitor berukuran dinding di masa depan? Either way peningkatan perangkat tambahan mungkin akan berguna.

Menghirup agen-pengguna - seperti yang telah Anda nyatakan - sama sekali tidak bisa diandalkan. Saya bisa mengubah string Agen-pengguna saya menjadi kutipan Shakespeare jika saya benar-benar menginginkannya. Apa yang akan diputuskan situs Anda tentang peramban saya?

Agen pengguna juga membutuhkan banyak pekerjaan untuk menangani semua kemungkinan. Apakah Anda punya satu untuk Firefox di android? Chrome di iOS? Lumba-lumba di Froyo? Peramban WiiU? Browser yang sangat terbatas pada ponsel berfitur LG lama saya? Lynx? IE 13? Tautan? IceWeasel? Browser Blackberry playbook? Bagaimana Anda memberi tahu perbedaan antara Opera berjalan di tablet dan opera berjalan di telepon?

Daftar ini hanya dapat bertambah seiring berjalannya waktu.

Agen pengguna juga berbohong. Jika Anda Google sekitar, Anda akan menemukan daftar agen pengguna vs kenyataan. Jadi ini masalah. Beberapa orang menggunakan pengaturan dpi untuk menentukan perangkat apa atau apa itu.