Desain ulang Divi 5 dari awal memberikan kecepatan, kinerja, dan kemudahan penggunaan yang tak tertandingi. Dengan Visual Builder yang disederhanakan dan back-end yang dibangun ulang sepenuhnya, membangun situs web dengan Divi 5 lebih cepat dan lebih mudah dari sebelumnya. Divi 5 akan memungkinkan Anda, terlepas dari tingkat pengalaman, untuk mengembangkan situs hebat dalam waktu singkat tanpa mengorbankan waktu atau kreativitas.
Mari lihat UI Divi 5 yang baru selama periode Alpha Publik ini. Ingatlah bahwa iterasi ini masih dalam tahap pengembangan aktif. Meskipun Anda mungkin menemukan beberapa kekurangan, saran di bawah ini akan memungkinkan Anda untuk memaksimalkan produktivitas saat Anda menguji dan mengembangkan dengan Divi 5.
10 Cara Terbaik Membuat Situs Web Lebih Cepat Dengan Divi 5
Sejak dirilisnya Divi 5 Public Alpha, banyak penyesuaian dan penyempurnaan telah diterapkan.
1. Manfaatkan Edit dengan Satu Klik
Di Divi 4, Anda harus mengeklik ikon pengaturan untuk mengubah bagian, baris, dan modul. Dengan Divi 5, pengeditan sekali klik telah menghilangkan semua itu. Modul dapat diedit dengan mengeklik di mana saja di dalamnya, yang mempercepat dan mengurangi frustrasi dalam proses desain.
Buat Situs Web Luar Biasa
Dengan Elementor pembuat halaman gratis terbaik
Mulai sekarangMisalnya, untuk mengubah modul teks, yang diperlukan hanyalah satu klik di mana saja dalam modul untuk mengakses pengaturannya secara instan.
2. Untuk Melakukan Tindakan Cepat, Klik Kanan
Menu konteks klik kanan di Divi 5 memberi Anda pintasan baru yang berharga untuk proses desain Anda. Setiap modul, bagian, atau baris dapat diklik kanan untuk membuat menu tindakan cepat dengan beberapa aktivitas yang sering digunakan. Alat ini memungkinkan Anda untuk menyelesaikan operasi dengan cepat tanpa membuka beberapa panel atau menelusuri opsi, baik Anda ingin menyalin gaya modul, menduplikasi pengaturan, atau menghapusnya.
Misalnya, anggaplah Anda membuat tombol dengan gaya yang unik. Dengan menggunakan opsi tindakan cepat, Anda dapat mengklik kanan, menyalin gaya tombol, dan menerapkannya ke semua modul tombol yang ingin Anda beri gaya yang sama.
3. Pasang Beberapa Panel Bertab untuk Berbagai Tugas
Docking multi-panel, yang memungkinkan Anda membuka dan mengontrol banyak panel secara bersamaan, adalah fitur baru Divi 5 yang fantastis. Anda dapat melihat banyak panel di versi sebelumnya (misalnya pengaturan layer + modul), tetapi Anda hanya dapat memindahkannya di sekitar kanvas tanpa menghalangi pandangan Anda. Untuk menjaga kanvas tetap bersih dari kekacauan, Anda dapat membuat tab panel di Divi 5.
Bila Anda dapat mendokumentasikan beberapa panel berdampingan, mudah untuk memodifikasi beberapa aspek desain Anda sekaligus. Antarmuka Divi 5 memungkinkan Anda untuk mengatur panel pada kanvas sesuai keinginan, menciptakan ruang kerja yang ideal untuk kebutuhan Anda. Misalnya, anggaplah Anda lebih suka meletakkan setiap panel di sisi kiri kanvas. Untuk membuat ruang kerja yang sesuai, Anda dapat melepaskan dan menggeser panel ke kiri, lalu menempelkan tab pada panel lainnya.
4. Manfaatkan Canvas Scaling untuk Desain Responsif
Divi 5 menawarkan pendekatan yang benar-benar baru untuk pembuatan halaman web yang responsif. Berkat penskalaan kanvas, Anda dapat dengan cepat menskalakan ruang kerja dan melihat bagaimana situs web Anda akan muncul di layar yang berbeda tanpa harus meninggalkan Visual Builder. Anda juga dapat dengan cepat mengubah ukuran kanvas desain, yang memungkinkan Anda mengubah tata letak, padding, dan margin.
Pertimbangkan skenario berikut: Anda sedang mengerjakan tata letak seluler dan ingin mengubah jarak antar bagian. Untuk menyesuaikan skala kanvas, klik dan seret tepi kanvas ke ukuran yang diinginkan. Dari sana, Anda dapat dengan cepat menyesuaikan margin dan padding untuk memastikan desain Anda tajam pada layar kecil.
5. Terapkan Efek Hover & Sticky Segera
Menambahkan efek hover dan sticky ke desain Anda kini lebih mudah dari sebelumnya dengan Divi 5. Pada iterasi Divi sebelumnya, pengguna harus membuka tab desain modul dan memasukkan pengaturan. Meskipun demikian, Divi 5 memungkinkan Anda menerapkan efek ini langsung dari menu pengaturan. Berkat metode inovatif ini, membuat desain yang dinamis dan menarik tanpa mengganggu alur kerja Anda kini lebih mudah dari sebelumnya.
Divi 5 memudahkan dan mempercepat penerapan efek hover pada tombol dan mempertahankan header di bagian atas layar saat pengguna menavigasi. Misalnya, Anda ingin menambahkan warna berbeda saat hover saat membuat ajakan bertindak. Untuk menerapkan perubahan dalam hitungan detik, pilih status hover dari menu dropdown di pengaturan.
6. Untuk Navigasi yang Lebih Efektif, Gunakan Breadcrumbs
Fitur breadcrumb baru di Divi 5 memudahkan dan mempercepat pengguna untuk mengakses modul dan pengaturan. Berkat breadcrumb, Anda dapat menavigasi antar tata letak tanpa tersesat. Breadcrumb berfungsi sebagai panduan visual yang menunjukkan lokasi persis Anda dalam pengaturan.
Saat bekerja di dalam suatu bagian, Anda tidak perlu kembali melalui menu atau kehilangan tempat Anda. Untuk mempercepat proses desain, setiap breadcrumb menawarkan tautan yang dapat diklik yang memungkinkan Anda untuk kembali ke preset sebelumnya dengan cepat.
7. Salin dan Tempel Gaya di Seluruh Modul untuk Menghemat Waktu
Divi 5 memudahkan penyalinan dan penempelan gaya modul di antara berbagai bagian. Ini menghemat waktu dan memastikan konsistensi di seluruh situs Anda dengan memungkinkan Anda menerapkan pengaturan desain yang sama dengan cepat di berbagai modul. Divi 5 menyederhanakan gaya dari modul, baris, atau bagian mana pun, lalu menggunakannya di seluruh desain Anda.
Misalnya, Anda ingin semua tombol pada halaman web memiliki desain yang sama. Anda dapat menerapkan gaya tersebut dengan mengklik kanan untuk membuka Menu Tindakan Cepat, menyalin gaya tersebut, lalu mengklik kanan untuk menempelkannya ke setiap tombol pada halaman.
8. Saat membuat tata letak yang kompleks, gunakan Wireframe View
Tampilan wireframe di Divi 5 menghilangkan komponen desain visual halaman, sehingga memperlihatkan cetak biru tata letak yang jelas dan tidak rumit. Dalam tampilan ini, Anda dapat berkonsentrasi sepenuhnya pada struktur, bebas dari gangguan visual seperti warna dan font. Tampilan ini bermanfaat untuk tata letak yang rumit saat Anda perlu melakukan penyesuaian struktural dengan cepat.
Dengan versi yang disederhanakan ini, Anda dapat berkonsentrasi pada penataan bagian, baris, dan modul. Tampilan wireframe memungkinkan Anda mengelola struktur proyek yang kompleks tanpa perlu mengkhawatirkan estetika.
9. Gunakan Konten Bentuk Panjang di Tampilan Lapisan
Tampilan Layers menggambarkan bagian, baris, dan modul halaman Anda. Dengan demikian, Anda dapat melihat keseluruhan struktur tata letak dengan cepat. Anda dapat dengan mudah menemukan bagian atau modul tertentu di panel Layers daripada harus menelusuri Visual Builder.
Elemen apa pun dalam tata letak dapat dipilih dan diedit segera di Tampilan Lapisan tanpa perlu mengekliknya di Pembangun. Ini sangat berguna untuk bagian yang bersarang jauh di dalam modul lain atau tersembunyi, seperti baris di dalam beberapa lapisan bagian.
10. Bersikap terbuka untuk mempelajari hal-hal baru
Divi 5 menawarkan pendekatan yang sama sekali berbeda dalam menggunakan Visual Builder. Ada kurva pembelajaran yang terkait dengan semua peningkatan signifikan ini. Pada awalnya, wajar saja jika Anda merasa sedikit kewalahan, terutama jika Anda terbiasa dengan iterasi Divi sebelumnya. Kabar baiknya adalah setiap modifikasi yang kami buat pada Builder mudah digunakan, jadi mengenal UI akan membantu Anda membuat situs web dengan Divi dengan lebih cepat dan efektif.
Penutup
Antarmuka Divi 5 dirancang untuk meningkatkan produktivitas, tetapi pengguna harus bereksperimen dengannya dengan menggabungkan beberapa panel, menggunakan pintasan klik kanan, dan meninjau kembali desain yang ada.
Divi 5 Migrator dapat membantu menyempurnakan desain. Dimulai dengan fitur-fitur sederhana seperti penskalaan kanvas dan alat efek hover dan sticky. Saat Anda semakin nyaman dengan Divi 5, Anda secara alami akan memasukkan lebih banyak fitur ke dalam proses desain Anda. Bereksperimenlah dengan pengaturan yang berbeda, bermain-main dengan antarmuka baru dan sempurnakan teknik untuk membuat alur kerja Anda lebih lancar dan lebih efisien.
