Pada 5 Juni 2025, saya menerima pesan WhatsApp dari tim PT Zumatic Saka Persada. Permintaannya cukup jelas: mereka ingin website yang lebih rapi, lebih mudah dikelola secara mandiri, dan tidak lagi bergantung pada bantuan teknis hanya untuk mengubah teks, gambar, atau halaman.
Klien menyampaikan:
Halo Pak, saya sedang mempertimbangkan untuk merapikan dan menyederhanakan website saya. Saya ingin bisa edit sendiri teks, gambar, dan halaman tanpa bantuan teknis. Saya tertarik migrasi ke block.
Dari sini terlihat bahwa klien sudah memahami manfaat WordPress blocks, dan kemungkinan besar sudah mempelajari layanan konversi website ke blocks yang saya tawarkan.
Ini juga bukan perkenalan pertama. Pada September 2023, klien pernah menghubungi saya untuk menyelesaikan beberapa masalah teknis di website yang sama. Jadi, proyek pada Juni 2025 ini adalah fase kedua: bukan lagi perbaikan parsial, melainkan transformasi yang lebih menyeluruh.
Saat diskusi dan audit dimulai, saya menemukan bahwa tantangannya tidak hanya soal editor konten. Desain lama memiliki masalah UI/UX, copywriting belum cukup kuat untuk mendukung konversi, dan performa teknis masih menyisakan banyak ruang perbaikan. Karena itu saya mengusulkan pendekatan yang lebih menyeluruh: konversi ke blocks sekaligus redesign. Klien setuju, dan di titik itulah proyek ini resmi dimulai.
Ringkasan Singkat
Sebelum masuk detail, ini poin utama hasil proyek ini:
Mobile performance: 53 → 93 (+75,47%)
Desktop performance: 81 → 100 (+23,46%)
HTTP requests: 122 → 64 (-47,54%)
Load time: 3,33s → 1,70s (-48,95%)
Workflow konten: raw HTML + builder berat → blocks + ACF
Adopsi tim: training turun dari 4 jam ke 1,5 jam; 90% konten bisa dikelola mandiri
Ingin audit cepat untuk memetakan potensi peningkatan di website Anda? Mulai konsultasi gratis.
Kondisi Awal & Tantangan
Fase Pertama (September 2023): Perbaikan Parsial
Saat pertama kali dihubungi pada September 2023, fokus klien masih pada perbaikan beberapa isu teknis. Namun, setelah dievaluasi, masalahnya ternyata saling terkait dan menumpuk.
Masalah keamanan dan pemeliharaan:
Website sering menerima spam dari contact form.
WordPress tidak terawat dengan baik (masih menggunakan PHP 7.2).
Beberapa plugin tidak kompatibel karena membutuhkan minimal PHP 7.4.
Masalah UX dan konten:
Desain UI kurang ramah pengguna.
Tabel project masih dibuat dengan raw HTML sehingga sulit diedit.
Tampilan website belum merepresentasikan profesionalisme perusahaan.
Fase Kedua (Juni 2025): Transformasi Menyeluruh
Ketika klien kembali menghubungi di Juni 2025, kebutuhan sudah berubah: mereka ingin sistem yang bisa dikelola tim internal tanpa friksi teknis. Ini yang menjadi titik balik dari “perbaikan” ke “transformasi”.
Baseline Performa Sebelum Optimasi
Audit performa awal memperlihatkan kondisi yang cukup memprihatinkan.
Skor PageSpeed Insights sebelum optimasi:
Mobile: 53 performance, 93 accessibility, 96 best practices, 85 SEO
Desktop: 81 performance, 98 accessibility, 96 best practices, 85 SEO
Hasil browser speed test (sebelum):
122 requests
3.1 MB transferred
7.0 MB total resources
3.33s finish time
1.35s DOMContentLoaded
Perbandingan Visual: Sebelum vs Sesudah
Perbandingan homepage menunjukkan perubahan paling terlihat: dari layout yang kaku menjadi struktur visual yang lebih modern, rapi, dan mudah dipindai.
Halaman kontak juga ikut ditata ulang, dari tampilan yang sangat dasar menjadi antarmuka yang lebih jelas dan meyakinkan bagi calon klien:
Kompleksitas Pengelolaan Konten
Tantangan terbesar ada di sisi operasional: pengelolaan konten terlalu teknis untuk tim non-teknis.
Tabel project dibuat dengan raw HTML sehingga butuh kemampuan coding untuk mengedit.
Ada 20 plugin aktif, termasuk WPBakery Page Builder yang kompleks.
Slider Revolution cukup berat dan sulit dikonfigurasi untuk kebutuhan harian.
Belum ada standarisasi alur kerja konten.
Pendekatan dan Metodologi
Audit Menyeluruh
Saya memulai dengan audit di lima area:
Audit teknis: performa, keamanan, dan kompatibilitas
Audit UX/UI: pengalaman pengguna dan struktur antarmuka
Audit konten: kualitas copywriting dan hierarki informasi
Audit SEO: kelayakan teknis dan on-page fundamentals
Audit workflow: proses kerja tim saat menambah atau mengubah konten
Strategi Transformasi
Berdasarkan hasil audit, strategi transformasi difokuskan ke tiga pilar utama:
1. Simplifikasi teknologi
Migrasi dari WPBakery ke GenerateBlocks Pro
Pengurangan plugin dari 20 menjadi 15 plugin yang lebih optimal
Implementasi GeneratePress sebagai tema dasar
2. Optimasi performa
Optimasi kode dan aset
Implementasi caching yang efektif
Kompresi dan optimasi gambar
3. Pengelolaan yang ramah pengguna
Sistem pengelolaan konten yang lebih intuitif
Custom plugin untuk kebutuhan multilingual
Integrasi ACF untuk manajemen project yang lebih sederhana
Implementasi Teknis
1. Migrasi Tema dan Page Builder
Saya mengganti sistem page builder dari WPBakery ke GenerateBlocks Pro yang lebih ringan dan lebih mudah digunakan. Keputusan ini didasarkan pada:
Performa lebih baik: kode lebih bersih dan lebih ringan
Kemudahan penggunaan: interface lebih intuitif untuk tim non-teknis
Fleksibilitas: mudah disesuaikan tanpa bloat
Maintenance: lebih sederhana untuk pemeliharaan jangka panjang
Saya juga menggunakan GeneratePress sebagai fondasi tema karena:
kode sangat ringan dan optimal,
kompatibilitas tinggi dengan GenerateBlocks,
fleksibel untuk kebutuhan kustomisasi jangka panjang,
dukungan pengembangnya matang dan stabil.
2. Pengembangan Plugin Kustom
Salah satu kebutuhan unik proyek ini adalah multilingual yang sangat spesifik. PT Zumatic hanya membutuhkan bahasa ganda (Indonesia/English) untuk halaman Insights & News. Karena itu saya membuat custom plugin dengan karakteristik:
Hanya aktif di halaman blog/insights
Tombol toggle bahasa yang mudah dipahami
Menyatu dengan alur WordPress admin
Dengan sistem ini, admin bisa mengelola konten dua bahasa tanpa plugin multilingual yang berat. Di interface tersebut admin dapat:
Menambahkan artikel baru lewat interface yang clean
Menentukan bahasa artikel melalui dropdown sederhana
Menghubungkan dua versi bahasa dari artikel yang sama
Melakukan preview sebelum publikasi
Keunggulan sistem ini:
Hanya aktif di area yang dibutuhkan
Interface sederhana, tidak membebani user dengan opsi berlebihan
Satu dashboard untuk kelola semua bahasa
Integrasi ACF untuk Manajemen Project
Untuk menggantikan sistem tabel raw HTML yang rumit, saya menyiapkan:
Custom Post Type untuk projects dengan field yang terstruktur
Integrasi ACF untuk input data yang lebih mudah
Custom filter system menggunakan GenerateBlocks Pro query blocks
Layout otomatis yang konsisten untuk semua project
Transformasi ini mengubah proses input project dari raw HTML yang rawan error menjadi form terstruktur yang mudah dipakai.
Manajemen informasi project:
Input informasi klien dengan mudah
Dropdown kategori industri
Field terstruktur untuk lokasi dan tahun project
Dropdown status untuk memantau progres
Fitur lanjutan:
Repeater field untuk detail scope project
Input teknologi yang digunakan
Integrasi query blocks untuk filter otomatis
Manfaat untuk tim PT Zumatic:
Tim non-teknis bisa menambah project baru tanpa coding
Semua project memakai template yang sama
Edit informasi tanpa risiko merusak layout
Output selalu rapi dan profesional
3. Optimasi Plugin dan Performa
Optimasi Plugin (20 → 15 Plugin)
Plugin dihapus/diganti:
WPBakery Page Builder → GenerateBlocks Pro
Slider Revolution
Ajax Load More → Native WordPress functionality
Breadcumb NavXT
CL Testimonial
Beberapa plugin security redundant
Contact Form 7 → Everest Form
Plugin baru yang ditambahkan:
GenerateBlocks Pro
Asset CleanUp Pro
Slim SEO
Custom multilingual plugin by Harun Studio
SCF
WPS Hide Login
WP SVG Images
SmartSMTP
4. Optimasi Performa
Kombinasi GeneratePress dan GenerateBlocks sebenarnya sudah cepat. Namun untuk hasil yang optimal, saya tetap menerapkan beberapa teknik lanjutan:
Menggunakan CSS/JS yang benar-benar diperlukan (dengan bantuan Asset CleanUp)
Minifikasi dan kombinasi file CSS/JS
Kompresi dan penggunaan format WebP
Implementasi caching multi-level
Hasil dan Dampak Transformasi
Peningkatan Performa
Skor PageSpeed Insights setelah optimasi:
Metrik
Before Mobile
After Mobile
Before Desktop
After Desktop
Peningkatan
Performance
53
93
81
100
75.47% (Mobile)
Accessibility
93
100
98
100
7.53% (Mobile)
Best Practices
96
100
96
100
4.17%
SEO
85
100
85
100
17.65%
Hasil browser speed test (sesudah):
Requests: 122 → 64 (turun 47,54%)
Transferred: 3.1 MB → 4.8 MB (konten dioptimasi)
Resources: 7.0 MB → 5.2 MB (turun 25,71%)
Finish Time: 3.33s → 1.70s (48,95% lebih cepat)
DOMContentLoaded: 1.35s → 1.44s (stabil)
Catatan: ukuran transferred memang meningkat karena ada penyesuaian aset konten baru, tetapi total resources turun, jumlah request berkurang drastis, dan finish time membaik hampir 49%.
Ingin hasil serupa untuk website Anda? Hubungi kami untuk konsultasi gratis. Kami akan audit singkat dan berikan rekomendasi implementasi.
Transformasi Dashboard WordPress
Salah satu dampak terbesar proyek ini justru ada di dashboard: dari yang membingungkan menjadi jauh lebih mudah dipakai tim internal.
Sebelum: menu membingungkan, plugin tidak terorganisir.Sesudah: struktur menu disederhanakan, CPT tertata, label lebih jelas.
Dashboard baru menampilkan:
Menu yang disederhanakan, hanya yang diperlukan
Custom Post Types untuk project dan insights
Label yang lebih mudah dipahami tim
Alur kerja harian yang lebih efisien
Visualisasi Metrik Performa
Berikut visualisasi perubahan performa di level browser:
Grafik di atas memperlihatkan pengurangan HTTP requests dari 122 menjadi 64, yang berkontribusi langsung pada peningkatan kecepatan loading.
Evolusi Halaman Project
Perubahan di halaman projects menunjukkan pergeseran dari sistem kaku ke halaman yang dinamis dan mudah dikelola:
Sebelum: tabel HTML/NinjaTable, sulit diedit oleh tim non-teknis.Sesudah: grid responsif, filter dinamis, manajemen via dashboard.
Halaman projects baru menampilkan:
Filter dinamis berdasarkan industri dan teknologi
Grid responsif di berbagai device
Tambah/edit project lewat dashboard
Layout konsisten dan profesional
Peningkatan Halaman Services
Halaman services juga mengalami peningkatan struktur dan penyajian:
Sebelum: layout dasar, informasi kurang terstruktur.Sesudah: struktur lebih jelas, visual lebih kuat, CTA tegas.
Dampak pada Workflow Tim
Kemudahan pengelolaan konten:
Project management: dari raw HTML ke sistem ACF yang mudah digunakan
Content creation: interface yang lebih intuitif untuk berbagai jenis konten
Multilingual: sistem bahasa sederhana dan efektif
Media management: organisasi aset lebih rapi
Training dan adopsi:
Setelah implementasi, saya memberikan training kepada tim PT Zumatic. Hasilnya:
95% adoption rate: tim langsung bisa menggunakan sistem baru
Waktu training turun dari 4 jam menjadi 1,5 jam
Tim dapat mengelola 90% kebutuhan konten secara mandiri
Feedback Klien
“Ini sudah sempurna! Proses pengelolaan menjadi sangat mudah. Meskipun masih butuh web developer untuk fungsi tertentu, untuk pengelolaan seperti menambahkan project baru, halaman baru, artikel/berita baru, semuanya sudah sangat mudah dan tidak terlalu teknis.”
Tim PT Zumatic Saka Persada
Pelajaran dari Proyek Ini
Faktor kunci keberhasilan:
Memahami workflow klien sebelum merancang solusi
Implementasi bertahap untuk meminimalkan disruption
Solusi kustom untuk kebutuhan unik
Investasi pada training agar adopsi berjalan cepat
Performa tetap jadi prioritas, bukan fitur semata
Praktik teknis yang saya terapkan:
Minimal plugin: hanya yang benar-benar diperlukan
Custom development untuk kebutuhan spesifik
Setiap keputusan teknis mempertimbangkan dampak performa
Kemudahan penggunaan di setiap interface
Sistem yang mudah dikembangkan ke depan
Siap Mentransformasi Website Anda?
Proyek PT Zumatic Saka Persada menunjukkan bahwa transformasi yang tepat bisa mengubah website dari beban operasional menjadi aset bisnis yang kuat dan mudah dikelola.
Jika website Anda menghadapi tantangan serupa, performa lambat, pengelolaan konten yang kompleks, atau kebutuhan fitur kustom, kami siap bantu menyusun strategi yang tepat.
Hubungi kami untuk konsultasi gratis, lalu kami petakan langkah paling relevan untuk kondisi website Anda saat ini.
FAQ Singkat
Apakah website harus dirombak total untuk bisa lebih cepat?
Tidak selalu. Banyak website bisa dipercepat dulu dari sisi bottleneck teknis (aset, cache, plugin, database, server) sebelum memutuskan redesign penuh.
Bagaimana memilih antara optimasi loading, konversi blocks, atau redesign?
Mulai dari audit dulu. Jika masalahnya dominan teknis, optimasi loading biasanya cukup. Jika struktur builder sudah terlalu berat atau UX sudah tidak relevan, konversi blocks atau redesign biasanya jadi langkah berikutnya.
Founder Harun Studio & web developer, blogger, serta hosting reviewer. Telah membantu pemilik bisnis meraih kesuksesan dengan design, development dan maintenance sejak 2021.
Artikel Terkait
Baca juga insight lain yang masih relevan dengan topik ini.