Dua Flavors Dari Pendekatan ' Satu Web ' : Responsif Vs Adaptive
Dua Flavors dari Pendekatan ' Satu Web ' : Responsif vs Adaptive
Anda mungkin pernah mendengar orang menyampaikan kita hidup dalam " dunia pasca - PC . " Apa artinya bagi para pengembang web ? Ini berarti bahwa 30 % hingga 50 % dari kemudian lintas situs Web Anda kini berasal dari perangkat mobile . Ini berarti bahwa segera , pengguna desktop dan laptop akan berada dalam minoritas di web .
Bagaimana kita menangani pergeseran tektonik ini sikap pengguna ? Kami telah bergerak di luar abad m - dot atau hacks t -dot , menjadi satu di mana teknik desain responsif dan adaptif memerintah hari - apa W3C panggilan pendekatan One Web . Bagian penting dari rekomendasi W3C yaitu bahwa " Satu Web berarti pembuatan , sejauh masuk akal , gosip dan layanan yang sama tersedia untuk pengguna terlepas dari perangkat yang mereka gunakan . "
Bagaimana kita menangani pergeseran tektonik ini sikap pengguna? Kami telah bergerak di luar abad m-dot atau hacks t-dot, menjadi satu di mana teknik desain responsif dan adaptif memerintah hari - apa W3C panggilan pendekatan One Web. Bagian penting dari rekomendasi W3C yaitu bahwa "Satu Web berarti pembuatan, sejauh wajar, gosip dan layanan yang sama tersedia untuk pengguna terlepas dari perangkat yang mereka gunakan."
Untuk pengembang yang berarti bahwa mengambil pendekatan Satu Web memastikan bahwa tidak hanya melaksanakan kerja situs Anda pada smartphone dan tablet ketika ini, tetapi bisa menjadi masa depan kedap untuk layar yang tak terbayangkan besok.
Saat ini ada tiga pendekatan yang terkenal untuk menyebarkan sebuah situs Satu Web: memakai desain responsif; desain adaptif sisi klien; dan desain server-side adaptif.
Salah satunya yaitu tidak lebih baik atau lebih jelek daripada yang lain; masing-masing mempunyai kekuatan dan kelemahan sendiri dan pengembang web yang bijaksana akan mempertimbangkan manfaat dan kelemahan masing-masing sebelum menentukan salah satu yang bekerja untuk proyek mereka berikutnya.
Desain Web Responsif
desain web responsif yaitu yang paling umum Salah satu pendekatan Web. Pendekatan ini memakai CSS query media untuk memodifikasi presentasi dari sebuah website didasarkan pada ukuran layar perangkat. Jumlah situs responsif yang semakin pesat, dari Boston Globe ke Disney untuk Indochino.
Keuntungan utama dari pendekatan ini yaitu bahwa desainer sanggup memakai template tunggal untuk semua perangkat, dan hanya memakai CSS untuk menentukan bagaimana konten yang diberikan pada ukuran layar yang berbeda. Plus, mereka desainer masih bisa bekerja di HTML dan CSS, teknologi mereka sudah bersahabat dengan. Selain itu, ada semakin banyak, toolkit open-source-responsif ramah menyerupai Bootstrap atau Yayasan yang membantu menyederhanakan proses membangun situs responsif.
Di sisi lain, ada beberapa cara pintas untuk desain responsif suara. Untuk pergi responsif, organisasi sering harus melaksanakan sebuah situs lengkap membangun kembali.
Desain dan pengujian fase sanggup cukup rewel, sebab sanggup menjadi sulit untuk menyesuaikan pengalaman pengguna untuk setiap perangkat yang mungkin atau konteks. Kita semua telah melihat tata letak situs responsif yang terlihat menyerupai sekelompok potongan puzzle yang tidak cukup cocok bersama. desain web responsif bekerja terbaik dalam kombinasi dengan pendekatan mobile pertama, di mana masalah penggunaan mobile diprioritaskan selama pengembangan. peningkatan progresif kemudian dipakai untuk mengatasi tablet dan memakai desktop kasus.
Client-Side Adaptive
desain adaptif dibangun di atas prinsip-prinsip desain responsif untuk menyampaikan pengalaman pengguna yang ditargetkan pada perangkat dan konteks tertentu. Menggunakan JavaScript untuk memperkaya website dengan fungsionalitas canggih dan kustomisasi. Misalnya, situs adaptif menyampaikan gambar Retina berkualitas hanya untuk Retina display (seperti iPad baru) sementara menampilkan definisi standar mendapatkan gambar berkualitas rendah.
Ada dua pendekatan untuk desain adaptif - satu di mana penyesuaian terjadi pada sisi client, di browser pengguna, dan lain di mana web server melaksanakan angkat berat mendeteksi banyak sekali perangkat dan memuat template yang benar. Contoh situs adaptif client-side termasuk Threadless dan ideeli. Salah satu kekuatan dari pendekatan template adaptif yaitu kemampuan untuk memakai kembali satu set HTML dan JavaScript seluruh perangkat, menyederhanakan administrasi dan pengujian perubahan.
Pendekatan adaptif sisi klien berarti Anda tidak perlu membangun kembali situs Anda dari bawah ke atas. Sebaliknya Anda sanggup membangun konten yang ada sementara masih menyampaikan tata letak ponsel-responsif. Untuk pengembang ahli, pendekatan ini juga memungkinkan Anda untuk secara khusus menargetkan perangkat tertentu atau resolusi layar. Misalnya, untuk banyak fashion online nasabah ritel Mobify ini, 95% dari kemudian lintas mobile mereka berasal dari iPhone. Sisi klien adaptif berarti mereka sanggup mengoptimalkan khusus untuk smartphone Apple.
Tidak menyerupai desain responsif, template adaptif memastikan bahwa hanya sumber daya yang diharapkan dimuat oleh perangkat klien. Karena perangkat dan fitur deteksi digeser ke perangkat mobile itu sendiri, jaringan CDN menyerupai Akamai dan Edgecast sanggup memakai sebagian besar fungsi caching mereka tanpa mengganggu pengalaman pengguna.
Pendekatan adaptif client-side mempunyai rintangan yang lebih tinggi untuk masuk dari desain responsif. Pengembang perlu mempunyai pemahaman yang solid dari JavaScript untuk memakai teknik ini. Hal ini juga tergantung pada template yang sudah ada sebuah situs sebagai dasar. Akhirnya, sebab penyesuaian sisi klien yaitu semacam lapisan di atas basis instruksi yang ada, Anda perlu untuk mempertahankan mereka sebagai situs Anda secara keseluruhan berkembang.
Server-Side Adaptive
Kita sanggup mencapai pendekatan adaptif server-side dalam banyak sekali cara, melalui plugin server-side dan deteksi kustom biro pengguna. Situs yang memakai server-side adaptif termasuk Etsy, One Kings Lane dan OnlineShoes.com.
Mengapa menentukan server-side adaptif? Ini biasanya menyampaikan template yang berbeda untuk masing-masing perangkat, memungkinkan kustomisasi lebih, dan itu menciptakan logika perangkat pendeteksi di server, memungkinkan halaman mobile yang lebih kecil yang memuat lebih cepat. Selain itu, ada banyak server-side plugin yang tersedia untuk umum CMSS dan eCommerce sistem menyerupai Magento.
Pendekatan ini bukan untuk menjadi lemah hati-biasanya membutuhkan perubahan signifikan ke sistem back-end, yang sanggup mengakibatkan implementasi yang panjang (dan mahal). Persyaratan untuk mengelola beberapa template mengakibatkan biaya pemeliharaan. Akhirnya, pendekatan ini sanggup mengalami duduk masalah kinerja ketika server berada di bawah beban berat. Ketika deteksi user agent mobile dilakukan pada server, banyak prosedur caching umum dipakai oleh CDN menyerupai Akamai perlu dimatikan. Hal ini sanggup mengakibatkan pengalaman pengguna yang lebih lambat untuk mobile dan desktop pengunjung.
Tentu saja, banyak perusahaan yang masih bergulat dengan dasar-dasar responsif, dan mereka tidak siap untuk menghadapi rasa yang lebih canggih dari adaptif. Semakin, kompetisi dan kemudian lintas seluler, bagaimanapun, akan mendorong semakin banyak organisasi untuk menendang ban pada semua tiga pendekatan, dan menentukan salah satu yang terbaik bagi pengguna mereka.