Pengembang situs web awal tidak perlu khawatir tentang merancang situs web karena pengguna akan melihatnya di komputer dan komputer tersebut memiliki resolusi layar tetap. Dengan revolusi seluler, semakin banyak orang mencari di perangkat seluler mereka - tablet atau ponsel - untuk mendapatkan informasi. Oleh karena itu menjadi penting bagi pengembang situs web, untuk membuat situs web yang melayani segala sesuatu mulai dari PC Windows hingga perangkat seluler. Artikel ini menjelaskan perbedaan antara desain web adaptif vs responsif dan memungkinkan Anda memutuskan mana yang lebih baik untuk Anda dan organisasi Anda.
Desain Web Responsif
Desain Web Responsif melibatkan pengkodean ekstra dan menggunakan apa yang disebut "grid cairan". Angka-angka ditentukan dalam "persentase" daripada jumlah piksel yang tepat. Ini membuat kode situs web yang sama dirender dengan benar di layar PC dan di layar ponsel. Dengan demikian, tidak peduli bagaimana Anda mengubah ukuran layar Anda, situs web yang sama disajikan dengan cara yang mudah dibaca. Untuk situs web yang lebih kecil, teks dan gambar mudah mengalir dengan ruang layar dan masuk ke dalamnya tanpa merusak situs web atau tanpa memotong bagian situs web.
Pendekatan desain web yang responsif membuatnya wajib menggunakan CSS3, bukan hanya CSS. Ini juga menggunakan gambar skalabel dan grid cairan yang agak sulit untuk dikodekan.
Desain Web Adaptif
Desain web adaptif juga difokuskan pada penyajian situs web yang dapat dilihat pada tablet dan ponsel selain layar PC. Namun pendekatannya sedikit berbeda. Dalam desain web responsif, fleksibilitaslah yang memungkinkan aliran teks bebas dan ukuran gambar agar muat di layar yang berbeda.
Dalam desain web adaptif, pengembang menggunakan ukuran layar dan kode yang ditentukan sebelumnya. Yaitu, ketika seorang pengguna masuk ke situs web, situs web menentukan jenis perangkat yang digunakan dan menyajikan situs web yang dirancang untuk ukuran layar perangkat tersebut. Konten dapat bervariasi di berbagai perangkat dalam beberapa kasus.
Sebagai contoh, para pengembang akan mempertimbangkan 1280 × 800 piksel untuk PC, 8 ″ untuk tablet dan 5 ″ untuk ponsel. Kode awal desain web adaptif berisi identifikasi layar. Jika PC, tunjukkan versi web dari situs web. Jika ini tablet 8 ″, tampilkan versi tablet situs web dan juga, jika perangkat tersebut adalah ponsel, tunjukkan versi seluler situs web tersebut. Ini dicapai dengan menggunakan pernyataan "IF", diikuti oleh dimensi yang berbeda yang ditentukan tepat dalam piksel daripada membuatnya dalam persentase.
Jika perangkat baru datang dengan resolusi layar yang berbeda, pengembang harus kembali ke pengkodean untuk menggabungkan resolusi layar yang lebih baru. Dengan demikian, desain web adaptif memiliki beberapa peluang untuk terpangkas pada perangkat yang lebih kecil jika pengembang tidak berhati-hati.
Dibandingkan dengan desain web responsif, desain web yang adaptif lebih mudah untuk dikodekan dan sebagian besar pengembang memilih yang terakhir melalui desain web yang responsif.
Desain web responsif vs Adaptif
Situs web responsif sulit dikodekan. Kode ini kompleks dan menggunakan nilai persentase, bukan nilai piksel tetap. Diperlukan jumlah konsentrasi yang bagus untuk membuat situs web yang berskala menurut ukuran layar perangkat. Sebaliknya, lebih mudah untuk membuat situs web yang berbeda untuk perangkat yang berbeda seperti halnya dalam desain web yang adaptif. Meskipun pekerjaan lebih pada desain web adaptif karena pengembang akan membuat situs web yang berbeda untuk ukuran perangkat yang berbeda, itu masih lebih mudah dibandingkan dengan desain web responsif.
Karena ada terlalu banyak perangkat seluler di pasar, pengembang tidak dapat selalu menyertakan semua jenis resolusi layar. Yang mengarah ke pemangkasan situs web di layar yang lebih kecil ketika pendekatan desain web adaptif digunakan.
Situs web adaptif sedikit lambat dalam pemuatan karena situs web telah terlebih dahulu mencari tahu perangkat apa dan resolusi layar apa yang digunakan. Berdasarkan itu, versi situs web yang terkait dimuat ke layar perangkat. Dalam hal desain web responsif, kode tunggal digunakan dan secara otomatis menyusut agar sesuai dengan layar ponsel.
Anda mungkin ingin juga melihat posting ini di MSDN berjudul Mengapa saya lebih memilih desain web yang adaptif dibandingkan desain web yang responsif.
PEMBARUAN: Halaman yang terhubung tidak tersedia di Microsoft. Anda mungkin ingin memeriksa SharePoint Desain Web Responsif sebagai gantinya.
