7 Tips WordPress Untuk Situs Web yang Mudah Bergerak


Tidak ada yang lebih buruk daripada memiliki situs web desktop yang tampak hebat dan situs seluler yang tidak berfungsi dengan baik.

Sebagian besar perbaikan desain sederhana tetapi memang memerlukan perhatian jika Anda ingin pengunjung tetap menggunakan Anda situs saat menjelajah di perangkat seluler.

Artikel ini akan menyoroti tujuh masalah situs web yang ramah seluler dan perbaikan untuknya.

  • Perubahan yang Dibuat Tidak Ditampilkan di Ponsel
  • Navigasi yang Tidak Ramah
  • Tata Letak Responsif Berhenti Berfungsi Tiba-tiba
  • Gambar Terlalu Lama Dimuat
  • Konten Paling Penting Tidak Jelas
  • Terlalu Banyak Informasi
  • Data untuk Layar Kecil
  • Pembaruan Situs Web yang Ramah Seluler Tidak Ditampilkan

    Anda baru saja menghabiskan banyak waktu membuat pembaruan ke situs web Anda. Mereka tampak hebat di desktop Anda tetapi tidak muncul di perangkat seluler Anda.

    Salah satu alasan paling umum adalah caching. Peramban seluler Anda dapat menampilkan versi lama situs Anda yang sebelumnya Anda unduh. Alasan lain mungkin karena situs web Anda menahan versi lama halaman Anda dan tidak menunjukkan perubahan Anda.

    Jika ini masalahnya, Anda harus menghapus cache untuk mengunduh versi yang direvisi. Plugin caching seperti WP Super Cache, W3 Total Cache, atau WP Cache Tercepat dapat membantu menyelesaikan masalah ini.

    In_content_1 semua: [300x250] / dfp: [640x360]->

    Di bawah ini adalah empat langkah untuk membantu Anda membersihkan cache dan browser situs web Anda untuk memungkinkan versi baru ditampilkan di situs ramah seluler Anda.

    1. Refresh browser Anda beberapa kali di browser Anda desktop dan perangkat seluler.
    2. Uji situs web Anda pada perangkat seluler yang berbeda.
    3. Bersihkan situs Anda dengan plugin caching.
    4. Periksa dengan perusahaan hosting Anda untuk mengetahui apakah ada sistem caching lain di server Anda yang perlu dihapus.
    5. Navigasi yang Tidak Ramah

      Mungkin sulit untuk membuat menu navigasi yang berfungsi baik di perangkat seluler. Jika navigasi situs web Anda memiliki banyak item dan submenu, akan lebih sulit untuk memeras segala sesuatu di layar yang lebih kecil.

      Misalnya, jika Anda hanya memiliki tiga atau empat item dalam navigasi situs web Anda, itu akan terlihat baik-baik saja. di ponsel. Namun, jika Anda memiliki lebih banyak item dan submenu, mereka akan saling menumpuk dan terlihat penuh sesak.

      Di bawah ini ada beberapa cara untuk memperbaiki masalah ini untuk situs web ramah seluler:

      • Ubah navigasi Anda menjadi menu dropdown untuk perangkat seluler.
      • Tampilkan menu navigasi Anda sebagai elemen blok, sehingga muncul secara vertikal.
      • Gunakan ikon menu yang dapat beralih untuk mengambil lebih sedikit ruang.
      • Buat menu navigasi seluler menggunakan jQuery.
      • Gunakan menu Hamburger (Banyak tema menyertakan ini sebagai opsi atau Anda dapat  gunakan plugin.)
      • Tata Letak Responsif Berhenti Bekerja Tiba-tiba

        Jika ponsel Anda ramah situs tiba-tiba berhenti berfungsi, mungkin karena plugin di situs Anda.

        Menginstal plugin baru atau memperbarui plugin yang ada dapat menyebabkan konflik dengan orang lain yang memengaruhi tata letak responsif Anda.

        Mulailah dengan menonaktifkan setiap plugin satu per satu untuk melihat apakah itu penyebabnya. Jangan nonaktifkan semuanya sekaligus atau Anda tidak akan tahu plugin mana yang menjadi penyebabnya.

        Perubahan kode kemungkinan penyebab lainnya. Jika Anda memodifikasi kode apa pun secara tidak sengaja atau tidak sengaja, pulihkan basis kode asli dan lihat apakah situs web responsif Anda mulai berfungsi lagi.

        Saat memeriksa situs Anda untuk responsif seluler, Anda harus selalu mengujinya pada perangkat seluler.

        Kadang-kadang tampaknya berfungsi ketika mengubah ukuran jendela browser di desktop Anda tetapi tidak ditampilkan dengan benar di ponsel.

        Jika satu baris kode hilang dari file header HTML, itu dapat merusak desain responsif. Satu baris kode yang hilang ini akan menyebabkan perangkat seluler Anda menganggap situs yang Anda lihat adalah situs web berukuran penuh.

        Situs yang dirender akan menjadi ukuran area pandang (ukuran area area halaman web yang terlihat oleh pengguna).

        Untuk memperbaiki situs ramah seluler Anda, tambahkan baris kode berikut ke bagian header:

        Terkadang ketika tema diperbarui, kode ini dapat menghilang.

        Gambar Terlalu Lama Dimuat

        Mengoptimalkan gambar dan mengurangi ukuran file gambar masuk akal. Gambar besar yang tidak dioptimalkan dapat memperlambat kecepatan pemuatan halaman web Anda. Ini bisa membuat frustasi bagi pengguna seluler.

        WordPress versi 4.4 dan di atasnya secara otomatis menampilkan versi terkecil dari gambar di server Anda.

        Jika Anda sudah menjalankan versi terbaru dari WordPress , tetapi situs Anda masih belum memuat dengan cukup cepat, Anda dapat:

        • Instal plugin seperti  Optimasi Gambar Tersenyum, Kompresi, dan Beban Malas untuk mengubah ukuran dan mengoptimalkan gambar Anda
        • Gunakan alat kompresi dan optimisasi sebelum mengunggah gambar ke situs Anda seperti TinyPNG, Kompres JPEG, atau Pengoptimal Gambar Online.
        • Konten Paling Penting Tidak Jelas

          Beberapa situs web memuat banyak konten yang tidak perlu untuk mengisi ruang kosong saat dibuka di desktop.

          Situs web yang dikembangkan tanpa sadar pengguna seluler umumnya termasuk dalam kategori ini. Situs-situs ini membutuhkan lebih banyak waktu dan bandwidth untuk dimuat.

          Jika laman tidak dirancang dengan tepat untuk perangkat seluler, maka sebagian konten mungkin tidak akan muncul di seluler tanpa banyak bergulir.

          Sebagian besar waktu, elemen pada halaman web Anda akan terlihat satu arah di komputer dan sama sekali berbeda di perangkat seluler.

          Misalnya, halaman penetapan harga dengan tiga kolom akan menampilkannya berdampingan di komputer.

          Namun , pada perangkat seluler, kolom ditumpuk satu sama lain karena ukuran layar lebih kecil. Perilaku ini diharapkan.

          Pastikan tabel harga Anda berada di posisi teratas di laman web Anda sehingga akan muncul lebih dulu saat dilihat di seluler. Jika Anda memiliki banyak teks di atas meja Anda, pengguna seluler harus menggulir ke bawah untuk melihatnya dan mungkin tidak.

          Untuk pengalaman pengguna seluler yang paling optimal, letakkan potongan konten paling kritis di bagian atas halaman. Jika pengguna perlu menggulir banyak sebelum mereka dapat melihat konten Anda, mereka mungkin tidak akan.

          Terlalu Banyak Informasi

          Situs dengan pengguna yang rumit- elemen antarmuka seperti tabel, formulir multi-langkah, dan fitur pencarian lanjutan dapat menghasilkan pengalaman pengguna seluler yang buruk.

          Elemen-elemen ini mengandung terlalu banyak informasi yang dapat membuat kerumunan layar ponsel dan mengganggu pengguna menemukan informasi yang mereka inginkan.

          Salah satu pendekatan adalah menghapus atau menyembunyikan beberapa konten dari pengguna seluler. Namun, ini bukan solusi ideal bagi pengunjung yang ingin memiliki akses ke elemen-elemen ini.

          Untuk menghindari masalah ini, optimalkan situs ramah seluler Anda sebanyak mungkin. Selain itu, hapus elemen yang tidak perlu sambil berfokus pada struktur inti situs web Anda.

          Data Untuk Layar Kecil

          Tabel kompleks dengan banyak baris dan kolom dapat masalah saat dilihat di layar ponsel kecil. Perbaikan terbaik adalah dengan menggunakan tabel responsif.

          Plugin seperti  Tabel Responsif WP dapat membuat ini mudah dilakukan.

          Seperti dengan tabel harga di atas, ketika dilihat pada perangkat seluler, kolom akan ditumpuk ke pas dengan layar yang lebih kecil.

          Cara lain untuk menampilkan data pada perangkat seluler meliputi:

          • Membuat tabel yang lebih kecil tanpa tata letak grid untuk menghindari perlunya pengguliran horizontal.
          • Membalikkan tabel di sisinya untuk lebih cocok di layar yang lebih kecil.
          • Mengganti tabel yang lebih besar dengan yang lebih kecil yang tertaut ke versi lengkap.
          • Mengubah tabel menjadi diagram lingkaran.
          • Ketika penggunaan seluler tumbuh secara eksponensial, sangat penting bahwa situs web bisnis dioptimalkan dengan versi ramah seluler. Tingkatkan pengalaman pengguna tanpa mengorbankan fungsionalitas dengan mengikuti langkah-langkah di atas.

            Anda juga harus selalu memantau kinerja situs Anda dan membuat tweak jika diperlukan untuk meningkatkan kinerja dan pengalaman pengguna.

            Mengelola Kategori dan Tags | | Panduan WordPress (4)

            Pos terkait:


            14.10.2019