Pengarang: Neil Lock

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 menyelami lebih lanjut, adalah baik untuk mengetahui nama bahagian atas halaman utama anda terlebih dahulu. Terdapat nama yang lebih baik untuknya selain daripada bahagian-atas-laman-anda.

“Above the Fold”

Ia dipanggil Above the Fold. Mengapa? Kerana pada zaman dahulu apabila manusia mempunyai sesuatu yang dipanggil surat khabar, ia biasanya dilipat dua supaya hanya bahagian atas yang dapat dilihat serta-merta. Bahagian atas atau bahagian “above the fold” tersebut mengandungi tajuk utama yang paling penting untuk hari itu, kemudian apabila anda membukanya, anda akan melihat tajuk-tajuk lain yang kurang penting. Begitu juga dengan laman web, bahagian atas laman anda adalah perkara pertama yang dilihat oleh pengunjung, kemudian apabila anda menatal ke bawah, anda akan melihat bahagian lain laman tersebut, sama seperti membuka lipatan surat khabar.

Berpegang kepada contoh surat khabar tadi, katakan anda sedang berjalan di jalanan dan melihat seorang penjual surat khabar. Apabila anda melihat surat khabar tersebut dan tajuk utamanya menarik, anda mungkin akan membeli surat khabar itu untuk membaca selebihnya. Ini pada dasarnya sama seperti laman web, jika pengunjung melawat laman anda dan mendapati kandungan ‘above the fold’ anda menarik, mereka mungkin akan tertarik dan menatal ke bawah atau melihat bahagian lain di laman anda untuk mengetahui lebih lanjut.

Kajian 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 memandangkan bahagian atas sesebuah laman web ialah perkara pertama yang anda lihat.

Jadi setelah mengetahui betapa pentingnya kandungan ‘above the fold’ halaman utama anda, apakah yang sepatutnya anda letakkan di bahagian atas laman anda?

Terus kepada Sasaran

Nyatakan dengan jelas dengan segera tentang tujuan laman web anda. Halaman utama dan kawasan ‘above the fold’ anda adalah nadi kepada keseluruhan laman anda. Jika pengunjung berasa keliru, mereka akan cepat beredar dan menutup tab tersebut. Jika anda seorang penulis buku baharu, nyatakan bahawa anda seorang penulis dan pamerkan buku terbaharu anda. Jika anda seorang perancang perkahwinan, nyatakan bahawa anda adalah perancang perkahwinan yang akan memberikan pengunjung perkahwinan yang paling tidak dapat dilupakan. Atau jika anda membina laman untuk hotel kecil anda, nyatakan bahawa anda ialah tempat penginapan dan sarapan (bed and breakfast) terbaik di bandar. (Saya akan menggunakan contoh-contoh ini lagi di bawah.)

Pengunjung anda tidak sepatutnya perlu meneka tentang tujuan laman tersebut. Mereka harus memahaminya serta-merta, hanya selepas itu mereka akan menatal ke bawah untuk melihat butiran lanjut.

Tarik Perhatian Pengunjung Anda Secara Bertujuan

Seterusnya, anda perlu memikirkan tujuan sebenar laman web anda. Apakah sebab utama anda membina laman web tersebut? Apa jua alasannya, anda juga perlu meletakkannya di bahagian ‘above the fold’.

Mari kita ambil beberapa contoh yang saya nyatakan di atas. Bagi penulis buku baharu, anda mungkin mahukan lebih banyak pendedahan. Jika anda mempunyai e-buku percuma, anda boleh meletakkan butang untuk pengunjung memuat turunnya. Bagi perancang perkahwinan, anda mahu orang menghubungi anda mengenai perkhidmatan anda, jadi letakkan nombor telefon anda atau borang hubungan. Atau bagi hotel kecil, letakkan borang tempahan bersama-sama nombor telefon anda.

Bagi Page Builder Sandwich, saya mahu orang ramai mengenali pemalam ini dengan lebih dekat, dan akhirnya menjadi pelanggan. Jadi saya mempunyai butang di sana yang membolehkan pengunjung mencuba demo serta-merta, dan satu lagi butang untuk membeli pemalam tersebut.

Mereka Bentuk ‘Above the Fold’

Kini setelah kita tahu perkara yang perlu diletakkan, sudah tiba masanya untuk memutuskan reka bentuknya. Secara peribadi, saya lebih suka kandungan yang dibahagikan dengan kemas, itulah sebabnya latar belakang pada halaman utama kami kelihatan kemas dan padu. Tetapi ia juga idea yang baik untuk menyertakan imej atau video bersama kandungan ‘above the fold’ anda agar ia kelihatan 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

Mencipta kandungan ‘above the fold’ untuk halaman utama anda bukanlah perkara yang sukar, tetapi ia memerlukan pemikiran dan ujian yang rapi untuk menghasilkan yang terbaik. Jika anda sudah mempunyai laman web yang telah sedia ada, tetapi mendapati kadar lantunan (bounce rate) yang tinggi dalam Google Analytics anda, saya menggalakkan anda untuk mencuba dan memikirkan semula kandungan ‘above the fold’ anda dengan petua 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.

Ketahui Lebih Lanjut Mengenai 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.

Pautan kekal mempunyai pelbagai bentuk dan rupa, tetapi biasanya ia kelihatan seperti di bawah ini. Yang ini berasal daripada YouTube:

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

Anda boleh menampal URL ini dalam editor kandungan untuk membenamkan kandungan tersebut. Jika ia boleh dibenamkan, anda akan melihat URL tersebut ditukar menjadi video atau kandungan sebenar. Jika tidak, ini bermakna anda tidak boleh memasukkan kandungan daripada laman tersebut.

Apakah Laman yang Boleh Saya Benamkan dalam Laman 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 Pemalam Boleh Menambah Lebih Banyak Laman yang Boleh Dibenamkan

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 Menambah Kandungan – Kod Benam Iframe

Jika menampal URL sahaja tidak berkesan, terdapat satu lagi cara untuk membenamkan kandungan. Cuba semak pilihan perkongsian laman yang ingin anda sertakan, selain pautan kekal, anda mungkin juga diberi sedikit “kod benam”. Kod benam kelihatan 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 Menambah Kandungan daripada Laman Lain dari Bahagian Hadapan

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 memudahkan urusan dengan membolehkan anda menyunting laman sebenar anda semuanya dari bahagian hadapan. Apabila anda menggunakan Page Builder Sandwich, anda menulis dan menyunting kandungan laman anda dengan mudah. Membenamkan kandungan daripada laman lain juga menjadi jauh lebih mudah.

Dengan Page Builder Sandwich, hanya tampal sama ada pautan kekal atau kod benam iframe di mana-mana bahagian hadapan laman anda dan ia akan ditukar kepada kandungan yang dibenamkan serta-merta, tidak perlu lagi mengetahui tab mana yang anda perlu tampalkan sesuatu.

Dapatkan Page Builder Sandwich sekarang.