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.
Now you can download the Lite version of Page Builder Sandwich from the 
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 
يسعدني أن أعلن أنه بدءًا من الإصدار 2.4، يمكنك الآن تحرير المحتوى الخاص بك مباشرة في الواجهة الأمامية باستخدام لغة Markdown!
سنة جديدة سعيدة للجميع!
في الأسبوع الماضي، أطلقنا الإصدار 2.1 الذي أصلح الكثير من الأخطاء وأضاف نافذة محرر روابط ووردبريس إلى Page Builder Sandwich.
