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.

Bago sumabak agad, magandang alamin muna kung ano ang tawag sa itaas na bahagi ng iyong front page. May mas magandang tawag dito kaysa sa itaas-na-bahagi-ng-iyong-site.

“Above the Fold”

Tinatawag itong Above the Fold. Bakit? Dahil noong unang panahon kung kailan mayroon pa ang sangkatauhan ng mga bagay na tinatawag na pahayagan, kadalasan itong nakatupi sa kalahati kaya ang itaas na bahagi lamang ang makikita kaagad. Ang itaas na bahagi o “above the fold” na bahaging iyon ay naglalaman ng pinakamahalagang (mga) ulo ng balita sa araw na iyon, at kapag ibinuklat mo ito ay makikita mo ang iba pang hindi gaanong mahalagang mga ulo ng balita. Katulad nito sa mga website, ang itaas na bahagi ng iyong site ang unang bagay na nakikita ng mga tao, pagkatapos kapag nag-scroll ka pababa ay makikita mo ang natitirang bahagi ng site, na kahalintulad ng pagbubuklat ng pahayagan.

Kung mananatili sa halimbawa ng pahayagan, sabihin nating naglalakad ka sa kalsada at nakakita ka ng nagtitinda ng dyaryo. Kapag nakita mo ang pahayagan at kung kawili-wili ang ulo ng balita, baka bilhin mo ang pahayagan upang makita ang iba pang nilalaman nito. Talagang pareho ito sa mga website, kung dadaan ang mga bisita sa iyong site at makitang kawili-wili ang iyong above the fold content, baka mahikayat sila at mag-scroll pababa o tingnan ang natitirang bahagi ng iyong site upang makakita pa nang higit pa.

Pananaliksik ni 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.

May katuturan ito dahil ang itaas na bahagi ng isang website ang unang bagay na iyong nakikita.

Kaya dahil alam mo na kung gaano kahalaga ang above the fold content ng iyong front page, ano ang dapat mong ilagay sa itaas ng iyong site?

Diretso sa Punto

Ilagay agad kung tungkol saan ang iyong site. Ang iyong front page at ang bahaging above the fold ang siyang buhay ng iyong buong site. Kung malito ang iyong mga bisita, mabilis silang aalis at isasara ang tab. Kung ikaw ay isang bagong may-akda ng libro, isulat na ikaw ay may-akda at ipakita ang iyong pinakabagong aklat. Kung ikaw naman ay isang wedding organizer, isulat na ikaw ay isang wedding organizer na magbibigay sa iyong bisita ng pinakahindi malilimutang kasal na mararanasan nila kailanman. O kung gumagawa ka ng site para sa iyong maliit na hotel, isulat na ikaw ang pinakamagandang bed and breakfast na lugar sa bayan. (Gagamitin ko pa ang mga halimbawang ito sa ibaba.)

Hindi na dapat manghula pa ang iyong mga bisita kung tungkol saan ang site. Dapat ay maunawaan nila ito kaagad, saka lamang sila mag-i-scroll pababa upang tingnan ang higit pang mga detalye.

Sadyang Hikayatin ang Iyong mga Bisita

Kasunod nito, kailangan mong pag-isipan ang mismong layunin ng iyong website. Ano ba ang dahilan sa paggawa ng iyong website sa simula pa lamang? Anuman ang dahilan, kailangan mo ring ilagay iyon sa itaas ng fold.

Tingnan natin ang ilang halimbawang binanggit ko sa itaas. Para sa isang bagong may-akda ng libro, malamang na gusto mo ng higit pang exposure. Kung mayroon kang libreng ebook, maaari kang maglagay ng button para mai-download ito ng iyong mga bisita. Para sa wedding organizer, nanaisin mong makipag-ugnayan ang mga tao sa iyo tungkol sa iyong mga serbisyo, kaya ilagay ang numero ng iyong telepono o isang contact form. O para sa maliit na hotel, maglagay ng booking form kasama ang numero ng iyong telepono.

Para sa Page Builder Sandwich, nais kong mas makilala pa ng mga tao ang plugin, at sa kalaunan ay maging customer. Kaya may button ako roon na nagpapahintulot sa mga bisita na subukan agad ang demo, at isa pang button upang bilhin ang plugin.

Pagdidisenyo sa Above the Fold

Ngayong alam na natin kung ano ang ilalagay, oras na para magdesisyon tungkol sa disenyo. Sa personal, mas gusto ko ang malinis at nahahati-hating content, kaya naman may solidong backdrop sa aming front page. Ngunit magandang ideya rin na samahan ang iyong above the fold content ng isang larawan o video upang maging mas buhay ito.

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.

Konklusyon

Ang paggawa ng above the fold content para sa iyong front page ay hindi mahirap, ngunit nangangailangan ito ng kaunting pag-iisip at pagsubok para magawa nang tama. Kung mayroon ka nang site at ayos ka na roon, ngunit may mataas kang bounce rate sa iyong Google Analytics, hinihikayat kita na subukan at muling pag-isipan ang iyong above the fold content gamit ang mga tip sa itaas.

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.

Matuto Nang Higit Pa Tungkol sa 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.

Ang mga permalink ay may maraming hugis at anyo, ngunit karaniwan ay ganito ang hitsura ng mga ito sa ibaba. Ang isang ito ay nagmula sa YouTube:

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

Maaari mong i-paste ang mga URL na ito sa content editor upang i-embed ang content. Kung maaari itong i-embed, makikita mong magiging aktwal na video o content ang URL. Kung hindi, nangangahulugan iyon na hindi ka maaaring magpasok ng content mula sa site na iyon.

Anong mga Site ang Maaari Kong I-embed sa Aking Site?

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

Ang Pag-install ng mga Plugin ay Maaaring Magdagdag ng Mas Maraming Site na Pwedeng I-embed

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

Isa Pang Paraan para Magdagdag ng Content – Mga Iframe Embed Code

Kung ang pag-paste lang ng URL ay hindi gumagana, may isa pang paraan para mag-embed ng content. Subukan at suriin ang mga opsyon sa pagbabahagi ng site na nais mong isama, bukod sa permalink, maaari ka ring bigyan ng maliit na piraso ng “embed code”. Ganito ang hitsura ng mga embed code:

<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.

Gamitin ang Page Builder Sandwich para Magdagdag ng Content mula sa Ibang mga Site mula sa 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.

Pinapadali ng Page Builder Sandwich ang mga bagay-bagay sa pamamagitan ng pagpapahintulot sa iyong i-edit ang iyong aktwal na site mula mismo sa frontend. Kapag ginamit mo ang Page Builder Sandwich, madali mong masusulat at mae-edit ang content ng iyong site. Mas madali rin ang pag-embed ng content mula sa iba pang mga site.

Gamit ang Page Builder Sandwich, i-paste lang ang permalink o ang iframe embed code saanman sa harap ng iyong site at agad itong iko-convert sa naka-embed na content, hindi na kailangang alamin kung saang tab mo kailangang i-paste ang mga bagay.

Kunin ang Page Builder Sandwich ngayon.