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.
Перш ніж зануритися в тему, варто спершу дізнатися, як називається верхня частина вашої головної сторінки. Для неї є краща назва, ніж «верхня частина вашого сайту».
«Above the Fold»
Вона називається Above the Fold («вище згину»). Чому? Тому що в давні часи, коли людство користувалося штуками під назвою «газети», їх зазвичай складали навпіл, тож одразу було видно лише верхню частину. Ця верхня частина, або частина «вище згину», містила найважливіші заголовки дня, а коли ви її розгортали — бачили решту менш важливих заголовків. Так само і на вебсайтах: верхня частина вашого сайту — це перше, що бачать люди, а коли ви гортаєте вниз, то бачите решту сайту, немов розгортаєте газету.
Продовжуючи приклад із газетою, уявімо, що ви йдете вулицею і бачите продавця газет. Якщо заголовок на газеті вас зацікавить, ви можете просто купити її, щоб прочитати решту. З вебсайтами практично те саме: якщо відвідувачі завітають на ваш сайт і знайдуть контент першого екрана цікавим, вони можуть цим зацікавитися й прокрутити сторінку вниз або переглянути решту сайту, щоб дізнатися більше.
Дослідження Нільсена
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.
Це цілком логічно, оскільки верхня частина вебсайту — це перше, що ви бачите.
Отже, знаючи, наскільки важливий контент на першому екрані вашої головної сторінки, що ж варто розмістити у верхній частині вашого сайту?
Переходьте одразу до суті
Одразу поясніть, про що ваш сайт. Ваша головна сторінка та зона першого екрана — це основа всього вашого сайту. Якщо відвідувачі відчують себе розгубленими, вони швидко підуть і закриють вкладку. Якщо ви автор-початківець, напишіть про це та покажіть свою останню книгу. Якщо ви весільний організатор, напишіть, що ви весільний організатор, який подарує відвідувачу найбільш незабутнє весілля в його житті. Або якщо ви створюєте сайт для свого невеликого готелю, напишіть, що ви найкращий готель типу «ліжко та сніданок» у місті. (Нижче я частіше використовуватиму ці приклади.)
Ваші відвідувачі не повинні здогадуватися, про що цей сайт. Вони мають зрозуміти це миттєво, і лише тоді вони прокрутять сторінку вниз, щоб дізнатися більше деталей.
Цілеспрямовано залучайте відвідувачів
Далі вам потрібно подумати про реальну мету вашого вебсайту. Для чого ви взагалі його створили? Якою б не була причина, її також потрібно розмістити на першому екрані.
Розглянемо кілька прикладів, про які я згадував вище. Для автора нової книги ви, ймовірно, захочете більше уваги. Якщо у вас є безкоштовна електронна книга, ви можете розмістити кнопку для її завантаження. Якщо ви весільний організатор, ви захочете, щоб люди зверталися до вас щодо ваших послуг — додайте свій номер телефону або контактну форму. А для невеликого готелю додайте форму бронювання разом із номером телефону.
У випадку з Page Builder Sandwich я хочу, щоб люди ближче познайомилися з плагіном і згодом стали клієнтами. Тому я розмістив там кнопку, яка дозволяє відвідувачам одразу спробувати демо-версію, та ще одну кнопку для покупки плагіна.
Дизайн першого екрана
Тепер, коли ми знаємо, що розміщувати, час визначитися з дизайном. Особисто я надаю перевагу чистому, розділеному на секції контенту, звідси й суцільний фон на нашій головній сторінці. Але також чудовою ідеєю буде доповнити контент першого екрана зображенням або відео, щоб зробити його більш живим.
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.
Висновок
Створити контент для першого екрана головної сторінки нескладно, але щоб зробити все правильно, потрібні роздуми й тестування. Якщо у вас вже є сайт і вас усе влаштовує, але в Google Analytics високий показник відмов, я закликаю вас спробувати переосмислити контент першого екрана, скориставшись наведеними вище порадами.
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.