Apa itu Konten Overlay?

Konten Overlay adalah jendela atau panel yang muncul di atas layar saat pengguna mengklik tombol atau melakukan tindakan tertentu. Sederhananya, itu adalah konten yang muncul di atas halaman yang sudah ada, seperti jendela pop-up atau menu geser.

• Tooltip atau panel samping: Jendela informasi yang muncul di samping saat pengguna mengarahkan mouse atau mengklik elemen tertentu

• Jendela modal: Jendela pop-up yang muncul di tengah ketika tombol tertentu diklik, dan latar belakang menjadi buram

• Menu seluler: Menu yang menutupi seluruh layar ketika tombol hamburger ditekan

Di Framer, overlay biasanya diterapkan dengan memberikan posisi tetap (Fixed Position) pada komponen Frame dan mengatur properti Visible ke On/Off berdasarkan pemicu tertentu atau menggunakan komponen Overlay untuk mengontrol visibilitas berbasis status.

Mengapa Konten Overlay Tidak Dibaca?

Google saat ini cukup baik dalam memahami halaman web, tetapi tidak dapat melihat halaman seperti manusia. Khususnya, konten yang tidak terlihat ketika halaman pertama kali dimuat hampir tidak pernah di-crawl. Overlay di Framer tidak dirender ketika halaman pertama kali dibuka demi kinerja dan animasi, sehingga meskipun terdapat teks atau tautan di dalam overlay, Google menganggapnya sebagai “informasi yang tidak ada di awal.” Akibatnya, konten dalam overlay tidak terpapar ke mesin pencari dan tidak membantu dalam SEO situs.
Catatan: Crawling adalah proses di mana mesin pencari (seperti Google, Naver, dll.) secara otomatis mengumpulkan dan menganalisis teks, gambar, tautan, struktur, dll., dalam halaman situs web.

Navbar juga Bukan Pengecualian.

Jika terdapat navbar dengan menu atau tautan yang tersembunyi menggunakan overlay, ini juga bisa menjadi masalah. Misalnya, jika suatu halaman hanya dapat diakses dari tautan dalam menu overlay, halaman tersebut tampak seperti tidak memiliki tautan internal, sehingga halaman tersebut menjadi ‘Halaman Yatim Piatu (Orphan Page)’ di mata mesin pencari.

Apakah Ada Solusi?

Sayangnya, tidak ada cara untuk membuat Google meng-crawl konten dalam overlay, tetapi Anda dapat mengurangi masalah ini dengan metode berikut:

• Menyediakan tautan penting di area umum
  Contoh: Tambahkan tautan teks di bagian bawah halaman (Footer)

• Menyediakan sitemap atau kumpulan tautan di luar overlay
  Contoh: Buat halaman HTML sitemap terpisah

Artikel ini adalah terjemahan dan adaptasi dari konten ‘Fixing uncrawlable overlay content’ di blog resmi Framer.