Reka Bentuk Web Mudah Alih 10 Tips Untuk Penggunaan Lebih Baik

Pelayaran web mudah alih dijangka menjadi platform Internet utama yang akan datang. Sekarang mudah untuk melayari internet dari hampir mana saja menggunakan peranti mudah alih yang sesuai dengan tangan kerana teknologi. Menjadi pendek dalam pelaksanaan kegunaan yang baik dalam reka bentuk web mudah alih menjadikannya sukar untuk melayari jalan di sekitar pelbagai laman web mudah alih yang popular. Merekabentuk untuk peranti mudah alih perlu lebih mudah daripada laman web standardnya dan lebih banyak tugas berasaskan tugas untuk mendapatkan pekerjaan yang dilakukan kerana pengguna mencari sesuatu yang spesifik dan mendesak.

Anda harus mengambil kira bagaimana menggunakan minimum yang paling minimum ruang yang tersedia untuk kandungan utama anda dan tetap menarik untuk pengguna mudah alih. Elakkan gambar besar dan animasi kilat kerana ia akan melambatkan laman web anda. Ingat bahawa fungsi lebih penting daripada gaya untuk laman web mudah alih. Sekiranya laman web anda tidak dikodkan dan direkodkan dengan betul, ia boleh kelihatan lebih baik pada satu telefon, paling buruk pada yang lain atau lebih teruk, tidak dipaparkan sama sekali. Uji, sahkan dan semak apakah ia serasi dengan semua peranti mudah alih.

Untuk membantu anda membuat laman web yang boleh diakses bukan sahaja pada desktop atau komputer riba tetapi juga peranti mudah alih, berikut adalah beberapa perkara yang perlu dipertimbangkan di dalam reka bentuk web mudah alih dengan imej sampel bersama dengan pautan langsung versi laman web mudah alih.

1. Tentukan resolusi skrin

Dunia mudah alih mengandungi pelbagai pertimbangan desain yang berbeza dari saiz skrin yang berbeza dan resolusi kepada pelbagai bentuk. Bertujuan untuk menyeimbangkan antara lebar skrin dan saiz khalayak yang mencukupi. Ketahui spesifikasi peranti mudah alih semasa dan gunakan penghakiman terbaik anda. Apa yang mencabar untuk pemaju mudah alih adalah cara untuk mendapatkan seseorang untuk dipaparkan dengan tepat merentasi pelbagai saiz skrin tanpa perlu membuat halaman untuk platform yang berlainan.

Berikut adalah senarai resolusi web yang popular di peranti mudah alih pada Februari 2011 yang disampaikan oleh Uxbooth.com dengan artikel yang diterbitkan, Pertimbangan untuk Reka Bentuk Web Mudah Alih (Bahagian 2): Dimensi, oleh David Leggett. Penulis menerangkan beberapa perkara mengenai dimensi paparan dan penyelesaian untuk reka bentuk susun atur.

2. Memecahkan laman web ke bahagian kecil

Bahagian teks yang panjang boleh sukar dibaca supaya meletakkannya pada beberapa halaman menghadkan penggiliran ke satu arah. Menghapuskan kandungan keutamaan yang rendah. Tetapkan kepada satu lajur teks yang membungkus sehingga tiada penggiliran mendatar.

Untuk contoh di bawah ini, versi laman web mudah alih CBS News hanya menunjukkan seksyen berita utama dan memecahkan artikel berita ke dalam bahagian kecil. Walaupun Treehugger membentangkan dirinya dengan artikel terkini dan tweet terkini dengan beberapa ciri laman web penuh. Kedua-dua tapak tersebut mempunyai pengguna mengklik pautan teks untuk melihat bahagian artikel yang lain.

CBS News

Treehugger

3. Memudahkan reka bentuk

Kesederhanaan menyamakan kebolehgunaan. Biarkan mereka bergerak di sekitar tapak tanpa kesulitan. Elakkan kemasukan jadual, bingkai dan pemformatan lain. Sekiranya anda menggunakan padding, ingatlah untuk memastikan ia minimum minimum yang kurang daripada yang anda gunakan untuk laman web biasa. Berbanding dengan komputer desktop, lebih banyak lagi anda mengklik pautan di laman web mudah alih, lebih banyak yang anda tunggu kerana masa loading. Dengan itu, anda perlu menyekat dan memudahkan laman web anda dengan keseimbangan antara kandungan dan navigasi.

Untuk contoh kami, laman web versi mudah alih senarai Best Buy hanya kategori produk yang paling penting merendahkan tahap hierarki untuk kandungan. Walaupun laman utama mudah alih YouTube hanya menampilkan empat video sorotan terkini.

Belian terbaik

Youtube

4. Pilihan untuk melihat laman web penuh

Sediakan pautan untuk pelawat mudah alih anda untuk beralih kembali ke tapak web penuh anda untuk pengguna untuk mencari dan melihat kandungan dan ciri lain yang hanya boleh diakses pada versi desktop laman web ini. Penonton anda pasti akan melakukan banyak menatal menegak, jadi tolong bantu mereka dengan pautan 'Kembali Ke Atas' supaya mereka boleh melompat ke bahagian atas halaman.

Sebagai contoh, Ars Technica mempunyai butang pautan ke laman web standard yang ditempatkan di tajuk. Walaupun Shangri-La mempunyai pautan laman web penuh yang ditempatkan di footer.

Ars Technica

Shangri-La

5. Penempatan navigasi

Kenali penonton anda dan ketahui apa yang mereka cari. Ketahui bagaimana mereka mahu menavigasi tapak anda. Posisi menu navigasi anda di bawah kandungan jika pengguna mudah alih yang disasarkan anda ingin melihat perubahan kandungan dengan cepat. Kandungan dan tajuk utama perlu dilihat terlebih dahulu untuk tidak melihat cara melihat kandungan halaman. Bagi pengguna yang ingin menavigasi kategori tertentu dengan serta-merta, letakkan navigasi di bahagian atas halaman. Berikut adalah pelbagai contoh penempatan pelayaran yang digunakan dalam reka bentuk web mudah alih.

D & G

Politico

Horoskop Harian

6. Gunakan pautan teks

Laman web utama anda boleh menggunakan menu fly-out, rollovers atau gadget lain yang mewah, tetapi penyemak imbas mudah alih mungkin tidak. Perlu diketahui bahawa unsur halaman dinamik dan pautan grafik mengambil sumber, jadi memilih pautan teks yang dilabel dengan baik.

A List Apart

Reddit

7. Buat perbezaan antara pautan yang dipilih

Menggerakkan kursor ke bawah akan menatal halaman dan menyoroti pautan sekaligus. Oleh itu, adalah penting untuk memberi nasihat kepada pengguna apa perkara yang menjadi tumpuan. Ini boleh dilakukan dengan menukar font dan warna latar belakang pautan dan butang atau dengan menambah sedikit padding di sekeliling pautan untuk menjadikan kawasan yang boleh diklik lebih besar sekitar 44px dengan 44px. Geek Squad dan Diesel menggunakan font besar untuk teks yang boleh diklik.

Skuad Geek

Diesel

8. Baki pautan

Setiap muat turun halaman menggunakan sumber masa dan sistem, yang mana kedua adalah kekurangan, jadi cuba untuk tidak memaksa pelawat laman digg melalui banyak halaman untuk mengakses maklumat yang dicari. Seret keseimbangan antara bilangan pautan pada setiap halaman dan kedalaman tapak.

Flickr

Twitter

9. Kurangkan kemasukan teks pengguna

Sulit untuk memasukkan teks dalam versi mudah alih laman web. Gantikan dengan butang radio atau senarai sebaliknya supaya mereka boleh memilih dari apa yang mereka perlukan dengan mudah. Ingat bahawa pengguna telefon bimbit tidak mempunyai akses ke papan kekunci konvensional dan tetikus. URL yang lebih singkat, lebih baik kerana ia adalah monoton untuk menaip URL lama.

Untuk sampel kami di bawah, Fedex menggunakan senarai semak dan drop down menu. Walaupun Tumblr membuat anda memilih bahasa anda menggunakan menu drop-down.

Fedex

Tumblr

10. Tiada pop atau menyegarkan

Pelayar mudah alih biasanya tidak menyokong pop timbul. Dan jika mereka melakukannya, mereka akan mempunyai ruang yang sangat sempit untuk masuk. Jauhi penggunaannya untuk mengelakkan keputusan yang tidak dapat diramalkan. Juga, tidak ada halaman yang menyegarkan secara berkala untuk mengelakkan mengisi memori peranti yang terhad. Biarkan pengguna menyegarkan kandungan.

Secara ringkas

Dapatkan kreatif dan aplikasikan reka bentuk web mudah alih anda dengan cara yang baru. Jadikan kandungan anda cukup menarik dan boleh digunakan. Berikan pengguna anda apa yang mereka mahu, apabila mereka mahu. Pengguna tidak mahu menggali lebih mendalam ke laman web ini hanya untuk mencari apa yang mereka cari dalam web mudah alih.

Adakah anda mempunyai laman web pilihan yang benar-benar memberi inspirasi kepada anda? Bolehkah anda berkongsi beberapa tip reka bentuk web mudah alih anda? Beritahu kami!

Bacaan lanjut

1. Reka Bentuk Web Responsif (alistapart.com)
2. Buat Tapak Mudah Alih Anda (thinkvitamin.com)
3. W3C mobileOK Checker (w3.org)
4. Simulator iPhone