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 mudah untuk memperbarui situs secara menyeluruh menggunakan alat seperti Elementor. Setiap halaman dan blok berisi gaya sebarisnya sendiri, yang berarti perubahan tidak dapat dilakukan secara global. Jika kami ingin memperbarui gaya situs, kami harus menelusuri setiap halaman dan memperbarui setiap blok secara manual, yang akan memakan waktu dan tidak efisien. Dengan mengingat hal 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 yang baru, konsisten, dan mudah diperbarui.

2) Mengapa Kami Memutuskan Tidak Menggunakan Elementor

Elementor adalah salah satu pembuat halaman paling populer untuk WordPress. Di permukaan, alat ini tampak seperti alat 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.

Keterbatasan dan Tantangan Elementor:

1. Bug dan Gangguan : Meskipun Elementor menawarkan banyak fitur yang bermanfaat, namun ada beberapa masalah teknis yang menyertainya. Misalnya, ketika kami menyalin halaman dan mencoba mengeditnya, halaman baru sering kali tampak berbeda dari aslinya, bahkan sebelum melakukan perubahan apa pun. Sering terjadi bug pada cara elemen ditampilkan, seperti properti "lebar gambar maksimum" yang tidak berfungsi dengan benar. Gangguan ini mempersulit kami untuk memastikan gaya yang konsisten di seluruh halaman.
2. Kebebasan Kreatif yang Terlalu Banyak, Menyebabkan Ketidakkonsistenan : Salah satu nilai jual utama Elementor adalah kemampuan untuk menyesuaikan segalanya. Namun, fleksibilitas ini dapat menjadi pedang bermata dua, terutama ketika beberapa editor bekerja di situs tersebut. Mudah bagi orang awam untuk secara tidak sengaja membuat halaman dengan desain yang tidak konsisten. Misalnya, kami melihat contoh editor yang menggunakan teks merah muda pada tombol merah muda atau menambahkan segitiga oranye terbang di latar belakang, yang menghasilkan desain yang berantakan dan membingungkan. Tanpa sistem desain yang ketat, menjadi mustahil untuk mempertahankan identitas visual yang kohesif.
3. Kustomisasi Terbatas untuk Fungsionalitas Lanjutan : Meskipun Elementor unggul dalam pembuatan halaman dasar dengan teks dan gambar, hal itu menjadi lebih menantang saat Anda perlu menambahkan fungsionalitas khusus. Kami sering kali merasa terbatas pada blok bawaan, yang sulit dikustomisasi untuk fitur yang lebih kompleks. Seiring kebutuhan kami berkembang melampaui tata letak dasar, keterbatasan Elementor menjadi semakin jelas.
4. Kode yang Membengkak dan Masalah Performa : Metode Elementor dalam membangun halaman memperkenalkan penumpukan elemen yang berlebihan. Misalnya, Elementor secara otomatis menghasilkan beberapa
   kontainer dalam lainnya

   elemen, masing-masing dengan rangkaian gayanya sendiri. Hal ini menghasilkan struktur yang membengkak yang berdampak negatif pada kecepatan pemuatan, kinerja halaman, dan akhirnya peringkat SEO situs web. Ketika kami menjalankan uji kecepatan, hasilnya secara konsisten buruk, dan kode berat yang dihasilkan oleh Elementor sebagian besar menjadi penyebabnya.
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. Setiap orang melihat situs yang sama, yang membatasi kemampuan kami untuk menguji dan menyempurnakan elemen desain seperti warna, bentuk tombol, dan gambar latar belakang. Tanpa fungsi ini, kami tidak dapat mengoptimalkan situs berdasarkan perilaku pengguna yang sebenarnya.
6. Database Bloat : Mungkin salah satu kelemahan Elementor yang paling signifikan adalah cara menangani gaya dan konten. Elementor menyimpan gaya, struktur bertingkat, dan tag lain yang tidak perlu yang tercampur dengan konten dalam database. Hal ini menyebabkan database menjadi membengkak dan tidak dibersihkan bahkan saat Elementor dinonaktifkan atau dihapus instalasinya. Akibatnya, beralih ke tema atau kerangka kerja baru tidak menyelesaikan masalah – gaya tersebut tetap tertanam di halaman, yang terus menimbulkan masalah.

Dengan mempertimbangkan semua tantangan ini, menjadi jelas bahwa kami membutuhkan solusi yang lebih tangguh. Kami membuat keputusan untuk membangun situs web baru yang independen tanpa Elementor, dengan 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 tetapi fleksibel. Alih-alih mengandalkan sistem blok Elementor yang rumit, editor konten di WordPress jauh lebih bersih, memungkinkan pembaruan cepat dan kustomisasi mudah. Di bawah editor, terdapat pengaturan untuk Advanced Custom Fields (ACF), yang telah 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.csvfile, 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 asli, yang dibangun menggunakan Elementor, memiliki 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",
"sameAs": [
"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 secara keseluruhan dan menyajikan versi halaman yang di-cache secara statis kepada pengunjung yang berulang.

9) Optimasi dan Pembersihan Basis Data

Situs web lama telah mengumpulkan sejumlah besar data "sampah" karena struktur basis data Elementor yang tidak efisien dan membengkak. Untuk memastikan situs baru berjalan lancar, kami melakukan pembersihan dan pengoptimalan basis data secara menyeluruh.

• Menghapus Data Elementor Lama

Seperti yang disebutkan sebelumnya, bahkan setelah menonaktifkan Elementor, gaya dan pengaturannya masih tertanam dalam basis data. Kami menggunakan kueri khusus untuk menghapus data berlebih ini dan membersihkan basis data. Selain itu, kami menghapus semua file media yang tidak digunakan, revisi posting, dan transien kedaluwarsa yang terkumpul 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 tanggalkolom 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 berlebihan, dan masalah kinerja yang disebabkan oleh Elementor. Dengan membuat situs baru dengan pengembangan khusus dan Bidang Kustom Lanjutan, kami memperoleh situs web yang lebih efisien, kohesif, dan profesional yang meningkatkan pengalaman pengguna sekaligus memungkinkan pembaruan yang efisien dan fungsionalitas pengujian A/B. Situs baru ini menyediakan fondasi yang kokoh untuk pertumbuhan dan peningkatan di masa mendatang.