Blog

What you put in the top of your front page has a huge impact on the success or failure of your website. Put the wrong thing in, and you’ll probably see your visitors quickly navigating away from your site. Put the right content there and you may see your sales go up.

This article isn’t an all-in-one guide for creating above the fold content, nor is about an all-encompassing rule on what you should put in. Rather, I will give you a few tips, recommendations and a little bit of helpful research about this topic.

Sebelum langsung masuk ke intinya, ada baiknya mengetahui terlebih dahulu apa sebutan untuk bagian atas halaman depan Anda. Ada nama yang lebih baik untuk bagian tersebut daripada sekadar bagian-atas-situs-Anda.

“Above the Fold”

Istilahnya disebut Above the Fold. Mengapa? Karena di masa-masa awal ketika manusia mengenal surat kabar, koran biasanya dilipat menjadi dua sehingga hanya bagian atasnya saja yang langsung terlihat. Bagian atas atau bagian “above the fold” ini memuat tajuk berita terpenting hari itu, lalu saat Anda membukanya, Anda melihat tajuk-tajuk berita lainnya yang kurang penting. Begitu pula pada situs web, bagian atas situs Anda adalah hal pertama yang dilihat orang, kemudian saat Anda menggulir ke bawah, Anda melihat sisa situs tersebut, mirip seperti membuka lipatan koran.

Melanjutkan contoh surat kabar tadi, katakanlah Anda sedang berjalan di jalan dan melihat penjual koran. Saat Anda melihat koran tersebut dan jika tajuk utamanya menarik, Anda mungkin akan membeli koran tersebut untuk melihat isinya lebih lanjut. Hal ini pada dasarnya sama dengan situs web, jika pengunjung mampir ke situs Anda dan menemukan konten above the fold Anda menarik, mereka mungkin akan tertarik lalu menggulir ke bawah atau melihat bagian lain dari situs Anda untuk melihat lebih banyak.

Riset Nielsen

Earlier I said that your above the fold content may make or break your site. Nielsen Normal Group has written a few research articles about this across the years. I’ll quote the summary of their article The Fold Manifesto: Why the Page Fold Still Matters

The average difference in how users treat info above vs. below the fold is 84%.

If you just got confused about the wording of the quote, I did too at the start. Let me clarify: That study doesn’t mean that 84% of people do not scroll down, on the other hand I’ve seen other research say that most people do scroll down to the bottom of the page. It also doesn’t mean that the lower part isn’t important. Instead it means that the behavior of your visitors in your site is largely impacted by your content above the fold.

Ini masuk akal karena area atas situs web adalah hal pertama yang Anda lihat.

Jadi, setelah mengetahui betapa pentingnya konten above the fold di halaman depan Anda, apa yang seharusnya Anda tempatkan di bagian atas situs Anda?

Langsung ke Intinya

Langsung tunjukkan mengenai apa situs Anda sebenarnya. Halaman depan dan area above the fold adalah urat nadi dari seluruh situs Anda. Jika pengunjung Anda merasa bingung, mereka akan segera pergi dan menutup tab. Jika Anda seorang penulis buku baru, tuliskan bahwa Anda seorang penulis dan tampilkan buku terbaru Anda. Jika Anda seorang wedding organizer, tuliskan bahwa Anda adalah wedding organizer yang akan memberikan pernikahan paling berkesan yang pernah ada kepada pengunjung Anda. Atau jika Anda membuat situs untuk hotel kecil Anda, tuliskan bahwa Anda adalah tempat bed and breakfast terbaik di kota. (Saya akan menggunakan contoh-contoh ini lebih banyak di bawah.)

Pengunjung Anda tidak perlu menebak-nebak tentang apa situs tersebut. Mereka harus langsung memahaminya, baru setelah itu mereka akan menggulir ke bawah untuk melihat detail selengkapnya.

Libatkan Pengunjung Anda Secara Terarah

Selanjutnya Anda harus memikirkan tujuan sebenarnya dari situs web Anda. Apa alasan Anda membuat situs web tersebut sejak awal? Apa pun alasannya, Anda juga harus menampilkannya di area above the fold.

Mari kita ambil beberapa contoh yang saya sebutkan di atas. Untuk penulis buku baru, Anda mungkin menginginkan lebih banyak eksposur. Jika Anda memiliki e-book gratis, Anda dapat menempatkan tombol agar pengunjung Anda dapat mengunduhnya. Untuk wedding organizer, Anda tentu ingin orang-orang menghubungi Anda mengenai layanan Anda, cantumkan nomor telepon atau formulir kontak Anda. Atau untuk hotel kecil, cantumkan formulir pemesanan beserta nomor telepon Anda.

Untuk Page Builder Sandwich, saya ingin orang-orang lebih mengenal plugin ini, dan pada akhirnya menjadi pelanggan. Jadi saya menyediakan tombol di sana yang memungkinkan pengunjung langsung mencoba demo, dan tombol lain untuk membeli plugin tersebut.

Mendesain above the fold

Sekarang setelah kita tahu apa yang harus dicantumkan, kini saatnya memutuskan tentang desainnya. Secara pribadi, saya lebih menyukai konten terbagi yang bersih, itulah alasan adanya latar belakang solid di halaman depan kami. Namun, memadukan konten above the fold Anda dengan gambar atau video juga merupakan ide yang bagus agar membuatnya lebih hidup.

Here’re a few examples of what you can do about your front page.

Add a background image. A large background image behind your large statement is a great eye-catcher and can further encourage visitor engagement. For new book author, maybe adding a background image illustrating the setting of his free ebook would entice people more.

Add an introduction video. Admit it, people can be lazy, especially when it comes to reading. So if your site is a bit complicated, it might be a good idea to add a short video that introduces your site/product quickly. For the wedding organizer, then this can be a video of their latest wedding. Or for our site for example, we can add in a quick intro about the features of our plugin.

Add a video background. This is a bit of a trend nowadays, but I find it appealing at times. If this suits your taste, then this might be a good idea.. I know PayPal had a video background before in their site. For the small hotel, you can put in a stationary video of a scenic area of your hotel as the backdrop.

Kesimpulan

Membuat konten above the fold untuk halaman depan Anda tidaklah sulit, tetapi memerlukan pemikiran dan pengujian agar tepat. Jika Anda sudah memiliki situs dan sudah puas dengan tampilannya, tetapi memiliki rasio pentalan yang tinggi di Google Analytics Anda, maka saya mendorong Anda untuk mencoba dan memikirkan kembali konten above the fold Anda dengan tips di atas.

If you have tips on creating above the fold content, kindly share them in the comments!

Page Builder Sandwich can Help You Design Your Front Page & Above The Fold Content

Page Builder Sandwich is a WordPress plugin that allows you to create any design you want without writing any piece of code.

Pelajari Lebih Lanjut Tentang Page Builder Sandwich

There may be times where you want to add supporting videos from YouTube or Vimeo into your site. Or maybe you want to add Tweets from Twitter, or content from other websites like Flickr and Instagram. You can embed these content easily in your WordPress site.

To do this, all you need to do is find the permalink for the content. In some sites like YouTube, the permalink is simply the current URL. For other sites like Reddit or Vimeo, you’ll have to find the “permalink”, “share” or “embed” button to get the URL. In some sites like Facebook, you’ll have to click the date of the status or post in order to get the permalink.

Permalink memiliki banyak bentuk dan rupa, tetapi biasanya mereka terlihat seperti di bawah ini. Yang satu ini berasal dari YouTube:

https://www.youtube.com/watch?v=dQw4w9WgXcQ​

Anda dapat menempelkan URL ini di editor konten untuk menyematkan konten. Jika dapat disematkan, Anda akan melihat bahwa URL tersebut akan diubah menjadi video atau konten yang sebenarnya. Jika tidak, itu berarti Anda tidak dapat menyisipkan konten dari situs tersebut.

Situs Apa Saja yang Dapat Saya Sematkan di Situs Saya?

Not all sites can be embedded into your WordPress site. The WordPress Codex has a list of sites which you can embed: https://codex.wordpress.org/Embeds

Memasang Plugin Dapat Menambahkan Lebih Banyak Situs yang Dapat Disematkan

If the content you want to embed isn’t in the list in the WordPress Codex, there is another way. Installing plugins can add more embeddable sites. For example, installing Jetpack allows you to embed wall posts from Facebook.

There are plenty more out there that add more sites, do a search for “oEmbed provider” in the WordPress.org plugin repository to find more. Here’s a link to the plugin repo for your convenience: https://wordpress.org/plugins/search.php?type=term&q=oembed+provider

Cara Lain untuk Menambahkan Konten – Kode Sematan Iframe

Jika hanya menempelkan URL tidak berhasil, ada cara lain untuk menyematkan konten. Coba periksa opsi berbagi dari situs yang ingin Anda sertakan, selain permalink, Anda mungkin juga diberikan sepotong “kode sematan”. Kode sematan terlihat seperti ini:

<iframe width="420" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>​

Copy that then in your WordPress content editor, click on the text tab on the top of the editor and paste that in. After you’ve pasted that in, head back to the visual tab, you’ll see if it works when the embed code now looks like the actual content that will get embedded. You can’t do this in the visual tab, pasting it from there would just show the pasted code in your site, it won’t get converted into the content.

Gunakan Page Builder Sandwich untuk Menambahkan Konten dari Situs Lain dari Frontend

While adding content from other sites seem easy, doing things in the administration side of WordPress is a bit of a hassle. You have to know whether to add it in the visual tab or text tab, and you’ll have to preview your page or post in order to see how it would look like when viewed by your site’s visitors.

Page Builder Sandwich mempermudah segalanya dengan memungkinkan Anda mengedit situs sebenarnya sepenuhnya dari frontend. Saat Anda menggunakan Page Builder Sandwich, Anda menulis dan mengedit konten situs Anda dengan mudah. Menyematkan konten dari situs lain juga jauh lebih mudah.

Dengan Page Builder Sandwich, cukup tempelkan permalink atau kode sematan iframe di bagian mana pun di bagian depan situs Anda dan itu akan langsung diubah menjadi konten yang disematkan, tidak perlu lagi mengetahui di tab mana Anda harus menempelkan sesuatu.

Dapatkan Page Builder Sandwich sekarang.