SQL Server Tips, Teknik, dan Artikel

Apa itu Preloader? – Definisi UI/UX, penggunaan yang benar, contoh

mike-van-den-bos-jf1EomjlQi0-unsplash-scaled.jpg

[ad_1]

Preloader adalah animasi yang ditampilkan sebelum konten utama situs web atau aplikasi dimuat.

Dalam posting ini kita akan menjawab pertanyaan tentang apa itu preloaderberikan beberapa contoh dunia nyata, dan diskusikan kapan dan bagaimana mereka harus digunakan dalam pengembangan situs web dan aplikasi.

Apa itu preloader?

Seperti disebutkan sebelumnya, preloader ditampilkan sebelum konten utama situs web dimuat. Biasanya, ini mengambil bentuk animasi sederhana yang membuat pengunjung Anda sibuk saat situs web Anda dimuat.

Di bawah ini adalah contoh animasi preloader. Animasi tak terbatas ini ditampilkan saat konten utama dari sebuah situs web dimuat. Setelah konten itu dimuat, animasi dan layar preloader memudar, dan situs web memudar.

Preloader digunakan dalam arti estetika murni, mereka tidak benar-benar mempercepat waktu pemuatan situs web atau aplikasi, tetapi mereka berusaha untuk membuat pengunjung tetap sibuk saat situs web dimuat, yang meminimalkan tingkat drop off dan bouncing.

Mereka berada dalam “keluarga” kerangka atau layar pemuatan yang sama, konsep yang dipopulerkan oleh Facebook. Di sini, Anda dapat melihat contoh layar kerangka, di mana keseluruhan tata letak ditampilkan, dan animasi berkilau ditampilkan saat konten dimuat ke dalam struktur.

Haruskah Anda memiliki preloader?

Ada perdebatan yang sangat aktif tentang manfaat memiliki preloader di situs web.

Secara realistis, Anda tidak ingin berada dalam situasi di mana Anda membutuhkan preloader, karena Google menyukai situs web yang memuat cepat. Jika pengunjung Anda menunggu selama beberapa detik, ini dianggap sebagai pengalaman pengguna yang buruk, dan Google menghukum penempatan peringkat pencarian Anda.

Namun, jika Anda memiliki halaman web yang berat, atau aplikasi web, preloader dapat menempati pengunjung Anda selama beberapa detik yang diperlukan untuk memuat semuanya. Alih-alih memuat sesuatu yang tampak rusak, semuanya dimuat sekaligus setelah siap.

Prapemuat sangat bagus untuk situs yang tidak peduli dengan peringkat, tetapi saya tidak menyarankan penerapan di situs Anda kecuali itu adalah aplikasi web.

Namun, bagian selanjutnya kita akan melihat beberapa contoh situs web yang menggunakan prapemuat, dan Anda akan melihat bahwa mereka digunakan untuk efek artistik di samping meningkatkan pengalaman pengguna pada pemuatan aplikasi web yang lebih lama.

Situs Web Dengan Preloader – Contoh

isotropik-2022-07-07-at-17-59-13
Graham.app menghitung hingga 100. Ini berubah secara dinamis saat halaman menyelesaikan pemuatannya, dan akurat.
isotropik-2022-07-07-at-18-00-19
kikk.be preloader adalah bagian dari animasi masuk mereka. Layar ini ditampilkan saat halaman dimuat, dan kemudian bertransisi ke halaman itu.
isotropik-2022-07-07-at-18-01-28
co.bo menggunakan tipografi sebagai layar preloader mereka

Prapemuat artistik

Pada banyak situs web kelas atas, Anda akan melihat “prapemuat artistik”. Ini tidak benar-benar dimaksudkan untuk membuat pengguna sibuk saat situs web dimuat, tetapi mereka digunakan untuk efek artistik. Sebagian besar pra-pemuat ini dipasangkan dengan animasi masuk untuk halamanmenghasilkan pengalaman pemuatan dan transisi halaman yang sangat menarik.

Konsep “prapemuat” lainnya

Anda mungkin melihat kata “preloader” dalam pengembangan web digunakan dalam arti yang berbeda. Di bagian ini, kita akan melihat kata preload yang digunakan dalam konsep yang berbeda – kecepatan situs web.

Pramuat tautan

Pramuat tautan berarti bahwa ketika pengguna mengarahkan kursor ke tautan, aset dari halaman itu dimuat secara otomatis, menghasilkan waktu pemuatan yang dirasakan lebih cepat.

Baca lebih banyak: https://instant.page/

Pramuat aset

Fitur web standar ini memungkinkan Anda menentukan urutan pemuatan aset, yang dapat meningkatkan keseluruhan FCP dan waktu untuk interaktivitas.

Baca lebih banyak: https://www.smashingmagazine.com/2016/02/preload-what-is-it-good-for/

Pramuat cache

Beberapa solusi cache memungkinkan Anda untuk memuat versi halaman yang di-cache. Pada dasarnya menghasilkan versi HTML statis dari halaman yang dapat disajikan kepada pengunjung lebih cepat.

Perlu diingat bahwa jenis prapemuat ini benar-benar berbeda dari pramuat yang digunakan untuk membuat pengunjung tetap sibuk saat situs web dimuat. Tidak ada hubungan antara konsep preloading yang berbeda ini.

Kesimpulan

Preloader adalah animasi atau layar yang ditampilkan sebagai konten utama dari sebuah situs web atau aplikasi web yang dimuat. Ini dirancang untuk membuat pengunjung Anda tetap sibuk, sebagai upaya untuk meminimalkan rasio pentalan. Namun, saran saya adalah untuk fokus pada keseluruhan waktu pemuatan situs web Anda, daripada mencoba mengalihkan perhatian pengunjung dengan preloader.

[ad_2]

Source link

Madara
Madara

Content Writer

Subcribe

Class aptent taciti sociosqud lito. Subscribe and join our club.

Blogroll
Advertorial

Artikel terbaru