1) Mengapa Kami Membuat Situs Web Baru dan Tidak Bisa “Mengganti Tema” Begitu Saja

Ketika kami pertama kali mengidentifikasi perlunya perubahan, tugasnya tampak sederhana: "Ubah blok teratas dan buat ajakan bertindak lebih efektif." Sekilas, ini mungkin tampak seperti perbaikan cepat, tetapi kami segera menyadari bahwa tugas kecil ini mengungkap masalah mendasar yang jauh lebih besar dengan struktur dan desain situs. Masalahnya bukan hanya satu blok; seluruh arsitektur situslah yang perlu dirombak.

Situs web kami dibangun dari waktu ke waktu, dengan berbagai halaman yang ditambahkan menggunakan berbagai desain dan tata letak, tanpa tema atau templat yang menyatukan. Setiap halaman memiliki desain yang unik, yang mungkin terdengar kreatif tetapi menimbulkan masalah yang signifikan: ketidakkonsistenan. Jika kami terus maju dan membuat desain baru hanya untuk blok teratas sambil membiarkan situs lainnya tetap seperti apa adanya, itu berarti memperbarui blok tersebut secara manual pada lebih dari 700 halaman dan posting. Lebih buruk lagi, proses manual ini perlu diulang setiap kali kami ingin membuat perubahan di masa mendatang. Bayangkan betapa tidak efisiennya harus menyisir ratusan halaman, memastikan setiap halaman memiliki pembaruan terkini. Dengan cepat menjadi jelas bahwa melanjutkan bekerja dengan situs lama tidak akan berkelanjutan.

Selain logistik pembaruan setiap halaman, kami juga harus mempertimbangkan pengalaman pengguna secara keseluruhan. Pengguna saat ini mengharapkan pengalaman yang lancar dan terpadu saat mengunjungi situs web. Jika mereka menggulir ke bawah halaman dan melihat bahwa desainnya tidak konsisten – dengan setiap blok menggunakan gaya yang berbeda – hal itu menciptakan kesan yang tidak profesional dan terputus-putus. Lebih buruk lagi, saat pengguna berpindah dari satu halaman ke halaman lain dan menyadari bahwa tata letak dan desainnya sama sekali berbeda, hal itu memperkuat kesan tidak teratur.

Ketidakkonsistenan tersebut tidak hanya terbatas pada tata letak. Banyak gambar di situs tersebut yang sudah ketinggalan zaman, tidak ditata dengan baik, atau bahkan dibuat secara tidak tepat oleh jaringan saraf. Gambar-gambar ini tidak sesuai dengan standar desain modern, dan menggantinya merupakan tugas berat lainnya. Penggunaan gambar yang buruk akan berdampak buruk pada kualitas situs secara keseluruhan, sehingga pengguna memiliki kesan negatif terhadap produk atau layanan yang kami tawarkan.

Tidak ada cara sederhana untuk memperbarui situs secara komprehensif menggunakan alat seperti Elementor. Setiap halaman dan blok berisi gaya inline sendiri, yang berarti perubahan tidak dapat dilakukan secara global. Jika kami ingin memperbarui gaya situs, kami harus memeriksa setiap halaman dan memperbarui setiap blok secara manual, yang akan memakan waktu dan tidak efisien. Dengan pemikiran ini, menjadi jelas bahwa satu-satunya solusi kami adalah membangun situs web baru dari awal. Ini akan memungkinkan kami untuk mentransfer semua konten sambil mempertahankan URL yang sama tetapi dengan desain baru, konsisten, dan mudah diperbarui.

2) Mengapa Kami Memutuskan untuk Tidak Menggunakan Elementor

Elementor adalah salah satu pembuat halaman paling populer WordPress. Di permukaan, sepertinya alat yang hebat yang memungkinkan pembuatan halaman dengan cepat dan mudah. Namun, setelah bekerja secara ekstensif dengannya, kami menemukan beberapa keterbatasan yang membuat kami memutuskan untuk beralih dari Elementor dan memilih situs web yang dibuat khusus.

Elementor’s Keterbatasan dan Tantangan:

1. Bug dan Glitch: Meskipun Elementor menawarkan banyak fitur berguna, hal ini bukannya tanpa masalah teknis. Misalnya, ketika kami menyalin halaman dan mencoba mengeditnya, halaman baru sering kali terlihat berbeda dari aslinya, bahkan sebelum melakukan perubahan apa pun. Sering terjadi bug pada cara elemen ditampilkan, seperti properti “lebar gambar maksimum” tidak berfungsi dengan benar. Kesalahan ini menyulitkan untuk memastikan gaya yang konsisten di seluruh halaman.
2. Terlalu Banyak Kebebasan Kreatif, Mengarah pada Inkonsistensi: Salah satu nilai jual utama Elementor’s adalah kemampuan untuk menyesuaikan semuanya. Namun, fleksibilitas ini bisa menjadi pedang bermata dua, terutama ketika banyak editor bekerja di situs. Sangat mudah bagi non-profesional untuk secara tidak sengaja membuat halaman dengan desain yang tidak konsisten. Misalnya, kami melihat contoh editor menggunakan teks merah muda pada tombol merah muda atau menambahkan segitiga oranye terbang di latar belakang, menghasilkan desain yang berantakan dan membingungkan. Tanpa sistem desain yang ketat, menjadi tidak mungkin untuk mempertahankan identitas visual yang kohesif.
3. Kustomisasi Terbatas untuk Fungsionalitas Tingkat Lanjut: Meskipun Elementor unggul dalam pembuatan halaman dasar dengan teks dan gambar, ini menjadi lebih menantang ketika Anda perlu menambahkan fungsionalitas khusus. Kami sering menemukan diri kami terbatas pada blok built-in, yang sulit disesuaikan untuk fitur yang lebih kompleks. Ketika kebutuhan kami berkembang melampaui tata letak dasar, batasan Elementor’ menjadi semakin jelas.
4. Kode Kembung dan Masalah Kinerja: Elementor’s metode membangun halaman memperkenalkan sarang elemen yang berlebihan. Misalnya, Elementor secara otomatis menghasilkan banyak
   wadah dalam wadah lain

   elemen, masing-masing dengan set gaya sendiri. Ini menghasilkan struktur membengkak yang secara negatif mempengaruhi kecepatan pemuatan, kinerja halaman, dan akhirnya peringkat SEO situs web. Saat kami menjalankan tes kecepatan, hasilnya selalu buruk, dan kode berat yang dihasilkan oleh Elementor adalah penyebab utamanya.
5. Tidak Ada Kemampuan Pengujian A/B: Dalam lanskap digital saat ini, pengujian A/B sangat penting untuk mengoptimalkan pengalaman pengguna. Namun, Elementor tidak menawarkan kemampuan untuk menampilkan versi situs yang berbeda kepada pengguna yang berbeda. Semua orang melihat situs yang sama, yang membatasi kemampuan kita untuk menguji dan menyempurnakan elemen desain seperti warna, bentuk tombol, dan citra latar belakang. Tanpa fungsi ini, kami tidak dapat mengoptimalkan situs berdasarkan perilaku pengguna nyata.
6. Bloat Database: Mungkin salah satu kelemahan paling signifikan dari Elementor adalah cara menangani gaya dan konten. Elementor menyimpan gaya, struktur bersarang, dan tag lain yang tidak perlu dicampur dengan konten dalam database. Hal ini menyebabkan database membengkak yang tidak dibersihkan bahkan ketika Elementor dinonaktifkan atau dihapus instalasinya. Akibatnya, beralih ke tema atau kerangka kerja baru tidak menyelesaikan masalah – gaya tersebut tetap tertanam di halaman, terus menyebabkan masalah.

Dengan mempertimbangkan semua tantangan ini, menjadi jelas bahwa kita memerlukan solusi yang lebih kuat. Kami membuat keputusan untuk membangun situs web baru yang independen tanpa Elementor, memilih pendekatan yang lebih berkelanjutan dan fleksibel.

3) Cara Membuat Halaman di Situs Baru

Membangun situs baru dari awal memberi kami kesempatan untuk membangun proses yang bersih dan efisien untuk membuat halaman. Dalam sistem baru, membuat halaman menjadi mudah:

1. Masuk ke panel admin WordPress dan klik Halaman -> Tambahkan Halaman Baru .
2. Anda akan melihat editor WordPress standar, tempat Anda dapat menulis atau menempelkan teks, menambahkan tautan, dan mengunggah gambar.

Proses ini sederhana namun fleksibel. Alih-alih mengandalkan sistem blok rumit Elementor’s, editor konten di WordPress jauh lebih bersih, memungkinkan pembaruan cepat dan penyesuaian mudah. Di bawah editor, ada pengaturan untuk Bidang Kustom Tingkat Lanjut (ACF), yang sudah dikonfigurasi untuk menjaga konsistensi di seluruh situs.

ACF memungkinkan kita membuat bagian konten yang fleksibel, dengan blok seperti Konten 1…Konten 15 , tempat Anda dapat dengan mudah mengatur judul, teks, gambar, dan label tombol untuk setiap bagian halaman. Blok-blok ini secara otomatis mengganti posisi gambar dan teks, memastikan bahwa tata letak tetap menarik secara visual tanpa memerlukan penyesuaian manual.

Untuk gambar, kami menerapkan sistem pencocokan warna yang secara otomatis menerapkan gradien pada warna utama situs. Ini memastikan bahwa semua gambar selaras dengan estetika keseluruhan. Untuk logo atau tangkapan layar yang warnanya harus tetap utuh, ada opsi "pertahankan warna" yang menggantikan gradien.

Sistem ini menyederhanakan manajemen konten sambil mempertahankan konsistensi desain di semua halaman.

4) Cara Membuat Postingan Baru

Pembuatan postingan di situs baru mengikuti proses yang sama sederhananya dengan pembuatan halaman, dengan beberapa perbedaan utama:

• Postingan memiliki URL yang menyertakan ../blog/.. , yang membedakannya dari halaman.
• Di bilah sisi kanan, blok secara otomatis menampilkan tiga artikel terbaru, membantu menjaga blog tetap dinamis dan menarik.

Template untuk semua postingan terletak di berkas template-parts/content/content-single.php , yang menangani struktur dan tata letak setiap postingan blog. Template yang konsisten ini memungkinkan pembaruan yang mudah dan memastikan bahwa semua postingan mematuhi pedoman desain yang sama.

5) Bidang Kustom Lanjutan (ACF)

ACF telah menjadi bagian penting dari pengembangan situs web baru kami. ACF memungkinkan kami membuat kolom kustom yang dapat dikelola dengan mudah melalui panel admin WordPress. Kolom seperti content_1 dirujuk dalam kode PHP, yang memungkinkan kami untuk menarik konten yang benar secara dinamis untuk setiap halaman dan posting.

Fleksibilitas ini penting untuk memastikan bahwa kami dapat mengelola dan memperbarui situs secara efisien sambil tetap menyediakan ruang untuk penyesuaian bila diperlukan.

6) Pengujian A/B

Salah satu peningkatan paling signifikan yang kami buat pada situs baru ini adalah penerapan pengujian A/B. Pengujian A/B memungkinkan kami membandingkan dua versi situs untuk melihat versi mana yang berkinerja lebih baik bagi pengguna. Ini dapat mencakup pengujian warna, bentuk tombol, latar belakang, atau bahkan tata letak yang berbeda.

Kami menerapkan fungsi ini menggunakan parameter GET di URL. Misalnya, dua kampanye iklan yang identik dapat dibuat, tetapi dengan URL yang berbeda:

• https://www.conveythis.com/?param=1

• https://www.conveythis.com/?param=2

Saat pengguna mengklik tautan ini, parameter tersebut disimpan dalam cookie. Bergantung pada nilai parameter, situs akan menampilkan versi halaman yang berbeda, seperti warna tombol atau gambar latar yang berbeda. Hal ini memungkinkan kami untuk mengumpulkan data berharga tentang preferensi dan perilaku pengguna.

Semua acara dicatat dalam .csv file, serta dalam basis data MySQL, yang memungkinkan kami menganalisis data dan membuat keputusan yang tepat tentang perbaikan situs.

7) File fungsi.php

8) Menangani SEO dan Kecepatan Situs

Fokus utama selama perombakan situs web adalah meningkatkan SEO dan kinerja situs secara keseluruhan. Situs aslinya, dibangun menggunakan Elementor, mengalami masalah dengan waktu pemuatan yang lambat dan praktik SEO yang kurang optimal karena kode yang membengkak dan gambar yang tidak dioptimalkan.

Meningkatkan SEO

Untuk memastikan situs baru kami ramah SEO, kami menerapkan beberapa praktik terbaik sejak awal:

• HTML Semantik : Kami dengan hati-hati menyusun HTML situs dengan penggunaan tag header yang tepat (
  Bahasa Indonesia:
  , dll.), memastikan bahwa mesin pencari dapat dengan mudah mengurai dan memahami hierarki konten. Hal ini sangat penting untuk peringkat SEO dan aksesibilitas.
• Tag Meta dan Data Open Graph : Kami memanfaatkan plugin Yoast SEO untuk menangani judul meta, deskripsi, dan data Open Graph untuk berbagi di media sosial. Dengan menggunakan Yoast, kami memastikan bahwa setiap halaman dan posting memiliki metadata yang dioptimalkan, yang sangat penting untuk visibilitas mesin pencari dan rasio klik-tayang dari platform media sosial.
• Schema Markup : Dengan menggunakan file function.php , kami menambahkan schema markup khusus untuk data terstruktur, yang meningkatkan cara mesin pencari menampilkan halaman kami di hasil pencarian. Misalnya, kami menyertakan skema untuk artikel, studi kasus, dan produk, yang membantu mesin pencari mengkategorikan konten kami dengan lebih baik.

fungsi add_schema_markup() {
  gema '
  {
    "@konteks": "http://schema.org",
    "@type": "Organisasi",
    "nama": "ConveyThis",
    "url": "https://www.conveythis.com",
"logo": "https://www.conveythis.com/logo.png",
"samaDengan": [
"https://www.facebook.com/conveythis",
"https://twitter.com/conveythis"
]
}
';
}
add_action( 'wp_head', 'tambahkan_schema_markup' );


Optimasi Kecepatan Situs

Performa merupakan faktor penting tidak hanya untuk pengalaman pengguna tetapi juga untuk peringkat SEO. Kami mengambil beberapa langkah untuk meningkatkan kecepatan situs:

• Optimalisasi Gambar : Kami memanfaatkan format gambar modern seperti WebP , yang menawarkan rasio kompresi yang lebih baik daripada format tradisional seperti PNG dan JPEG. Semua gambar disajikan dalam ukuran yang sesuai berdasarkan resolusi layar pengguna, memastikan waktu muat yang cepat bahkan pada perangkat seluler.
• Lazy Loading : Dengan menerapkan lazy loading untuk gambar, kami memastikan bahwa hanya gambar yang terlihat di layar pengguna yang dimuat pada awalnya. Gambar tambahan akan dimuat saat pengguna menggulir, sehingga mengurangi waktu pemuatan halaman awal.
• Caching dan Minifikasi: Kami menggunakan WP Rocket untuk caching, minifikasi, dan kompresi file HTML, CSS, dan JavaScript . WP Rocket membantu kami mencapai waktu muat yang lebih cepat dengan mengurangi ukuran file keseluruhan dan menyajikan versi halaman yang di-cache statis kepada pengunjung berulang.

9) Optimasi dan Pembersihan Basis Data

Situs web lama telah mengumpulkan sejumlah besar data “junk” karena Elementor’ membengkak dan struktur database tidak efisien. Untuk memastikan situs baru berjalan lancar, kami melakukan pembersihan dan pengoptimalan database secara menyeluruh.

• Menghapus Data Lama Elementor

Seperti disebutkan sebelumnya, bahkan setelah menonaktifkan Elementor, gaya dan pengaturannya masih tertanam dalam database. Kami menggunakan kueri khusus untuk menghapus kelebihan data ini dan membersihkan database. Selain itu, kami menghapus file media yang tidak terpakai, memposting revisi, dan transien kadaluwarsa yang telah terakumulasi dari waktu ke waktu.

• Pengindeksan Basis Data

Kami juga mengoptimalkan database dengan menambahkan indeks ke kolom yang sering ditanyakan, memastikan bahwa kueri database lebih cepat dan lebih efisien. Misalnya, menambahkan indeks ke kolom yang sering ditanyakan, memastikan bahwa kueri database lebih cepat dan lebih efisien. mengundurkan tanggal kolom mempercepat kueri yang terkait dengan posting terkini, sehingga meningkatkan kinerja halaman blog kami.

Kesimpulan

Keputusan untuk membangun situs web baru dari awal didorong oleh keterbatasan dan inefisiensi situs lama. Mengganti tema saja bukanlah pilihan yang tepat karena ketidakkonsistenan desain, gaya yang membengkak, dan masalah kinerja yang disebabkan oleh Elementor. Dengan membuat situs baru dengan pengembangan khusus dan Bidang Khusus Tingkat Lanjut, kami mencapai situs web yang lebih efisien, kohesif, dan profesional yang meningkatkan pengalaman pengguna sekaligus memungkinkan pembaruan yang disederhanakan dan fungsionalitas pengujian A/B. Situs baru ini memberikan dasar yang kuat untuk pertumbuhan dan perbaikan di masa depan.