सुंदर लैंडिंग पृष्ठ युक्तियाँ और उदाहरण

लैंडिंग पेज के विषय के आसपास सैकड़ों मजाकिया लेख लिखे गए हैं। हम सभी मूल तथ्यों को जानते हैं - कि ये वे पृष्ठ हैं जो एक बैनर विज्ञापन या प्रचारक लिंक पर क्लिक करने के बाद एक आगंतुक तक पहुँचते हैं, और यह कि वे व्यवसाय के लिए ग्राहकों तक पहुँचने में महत्वपूर्ण विपणन भूमिका निभाते हैं। हालाँकि, जब लैंडिंग पृष्ठ को स्वयं डिजाइन करना आता है, तो यह प्रतीत होता है कि प्रलेखन से कैसे-कैसे गुजरने के बाद आपको उम्मीद से कहीं अधिक नाजुक स्थिति होगी। यही कारण है कि आज, हमने प्रेरणा के लिए वास्तविक लैंडिंग पृष्ठ के उदाहरणों का एक संग्रह साझा करने के लिए चुना है.

एक बहुत ही विद्वान वर्गीकरण के अनुसार, आप विकिपीडिया में मिल सकते हैं, लैंडिंग पृष्ठ दो प्रमुख श्रेणियों में आते हैं: संदर्भ और लेन-देन। यदि उन्हें संदर्भ कहा जाना है, तो पृष्ठों को ऐसी जानकारी प्रदर्शित करनी होगी जो आगंतुक (पाठ, मल्टीमीडिया) के लिए आकर्षक और प्रासंगिक हो। "ट्रांसेक्शनल" लैंडिंग पृष्ठ वे हैं जो तत्काल बिक्री का लक्ष्य रखते हैं या कम से कम मजबूत बिक्री लीड पर कब्जा करने में हैं.

जैसा कि आप शायद मेरे साथ सहमत होंगे, सभी लैंडिंग पृष्ठ दोनों मानदंडों को पूरा करते हैं: वे आगंतुक को प्रस्ताव पर सूचित करते हैं और साथ ही उसकी ओर से कार्रवाई के लिए उकसाते हैं। अन्यथा हमें किसी भी लैंडिंग पृष्ठ पर कॉल-टू-एक्शन की आवश्यकता नहीं होगी, क्या हम?

Www में किसी भी लैंडिंग पृष्ठ को लॉन्च करने से पहले स्पष्ट होने की आवश्यकता है, वांछित आगंतुकों की कार्रवाई की प्रकृति है। क्या न्यूज़लेटर बढ़ना आपका लक्ष्य है? फिर "साइनअप अब हमारे न्यूज़लेटर के लिए" संदेश के साथ एक सीटीए डिज़ाइन करें। क्या आपके पास आगंतुकों से परीक्षण खरीद का लक्ष्य है? ऐसा बोलो। सामान्यतया, आवश्यक नुस्खा यह है कि आपके लैंडिंग पृष्ठ को इस प्रस्ताव को स्पष्ट रूप से और मोहक तरीके से व्यक्त किया जाए.

लैंडिंग पृष्ठ डिजाइन करने के लिए टिप्स

लैंडिंग पृष्ठ को डिज़ाइन करते समय शुरू करने के लिए कुछ त्वरित सुझाव:

1. एआईडीए सिद्धांत का उपयोग करें

यह उन घटनाओं की एक श्रृंखला है जो हम चाहते हैं कि एक बार लीड होने के बाद प्रचारित उत्पाद या सेवा को प्रदर्शित करने वाले मंच पर पहुंचे। मुख्य रूप से, चरण हैं:

1. जागरूकता - आगंतुक का ध्यान आकर्षित करना
2. ब्याज - जो ग्राहक को लाभ पर प्रकाश डालकर जगाया जा सकता है
3. इच्छा - ग्राहकों को इस विचार में प्रेरित करें कि वे चाहते हैं उत्पाद या सेवा
4. कार्य - खरीद प्रक्रिया का प्रदर्शन करने वाले ग्राहक

2. बहुत अधिक विचलित नहीं; एक रास्ता छोड़ दो

विचार सरल है। यदि लैंडिंग पृष्ठ में CTA बटन को छोड़कर लगभग कोई नेविगेशन विकल्प नहीं है, तो आगंतुक अपने निकास को बाध्य करेंगे। ऐसा मत सोचो कि यदि आप कोई नेविगेशन प्रदान नहीं करते हैं, तो उन्हें छोड़ने का कोई रास्ता नहीं मिलेगा - वे, शायद ब्राउज़र को बंद करके भी। और ये आगंतुक करेंगे नहीं वापस लौटें.

3. इसे ब्लिंक टेस्ट पास करें

आमतौर पर, एक लैंडिंग पृष्ठ को प्रविष्टि के पहले 3 सेकंड में आगंतुक का ध्यान आकर्षित करना होता है। यदि मेहमान झपकी लेता है, और यह स्पष्ट रूप से नहीं देख सकता है कि उसे पृष्ठ पर क्या मिलना चाहिए या उसने जो कुछ देखा, उसके साथ दिलचस्पी नहीं है, तो वह खाली हाथ उछालने की संभावना है।.

4. झूठी उम्मीदें न बनाएँ

लैंडिंग पृष्ठ को मूल विज्ञापन या इसके विपरीत दिए गए संकेतों के अनुरूप होना चाहिए। आगंतुकों को लैंडिंग पृष्ठ पर खोजना होगा कि उनके द्वारा पहले क्लिक किए गए विज्ञापन में क्या वादा किया गया था.

जैसा कि हमने वादा किया है, चलो बी 2 बी और बी 2 सी के कुछ अच्छी तरह से डिज़ाइन किए गए और प्रभावी लैंडिंग पृष्ठ पर जाएं। हम उनकी ताकत और अपरिहार्य कमजोरियों का पता लगाएंगे। नीचे दी गई गैलरी में निम्नलिखित के लिए देखें: दृश्य संचार, ब्रांडिंग और विश्वास संकेतक, सामग्री प्रभावशीलता, कॉल-टू-एक्शन.

शोकेस: सुंदर लैंडिंग पृष्ठ

99Designs

यह डिजाइनरों और छात्रों की ओर लक्षित लैंडिंग पृष्ठ का संस्करण है। 99Designs में दूसरे पक्ष के लिए एक लैंडिंग पृष्ठ भी है: जिन व्यवसायों को डिजाइन की आवश्यकता होती है। इस एक के रूप में, यह समर्थन के मामले में बहुत प्रभावी है (बोल्ड प्रशंसापत्र देखें) और सही मायने में दर्शकों की भाषा में आंकड़े और विश्वास संकेतक (समुदाय के सदस्यों की संख्या, उनके द्वारा अर्जित की गई धनराशि) की भाषा बोलते हैं। एकल CTA बटन के चमकीले लाल शेड पर ध्यान दें - यह आमतौर पर बचने के लिए कुछ है, लेकिन इस विशेष मामले में यह परेशान नहीं है, क्योंकि यह लोगो के रंग से मेल खाता है.

123RF

123RF छवि स्लाइडर और चार माध्यिका बक्सों के साथ इस लैंडिंग पृष्ठ में उद्देश्य का स्पष्ट विवरण देता है। आप एक पल में समझते हैं कि सेवा क्या है और आप इसका उपयोग कैसे कर सकते हैं (खोज, साइन अप, भुगतान-जैसा-आप-जाओ, खरीद प्रतिलेखन)। हल्के भूरे रंग की पृष्ठभूमि विनीत है और हाइलाइट को सार पर रखता है, जो कि छवि है। मुझे व्यक्तिगत रूप से क्या लगता है कि वे इसमें सुधार कर सकते हैं, स्टॉक फोटोग्राफी श्रेणियों की सूची है, यह थोड़ा भरवां है। और CTA क्लिक करने योग्य बक्से के लिए थोड़ा बहुत सूक्ष्म है.

Favomatic

मुझे इस लैंडिंग पृष्ठ के डिज़ाइन से बिल्कुल प्यार है। इसके विपरीत, प्रत्येक खंड में अच्छे नारे हैं और यह आपको सब कुछ पढ़ने के लिए मजबूर किए बिना बहुत सारी जानकारी लाता है (छोटा फ़ॉन्ट यह सब करता है)। इसमें नेविगेशन है, लेकिन स्क्रॉल करके एक ऊर्ध्वाधर, जो बाउंसिंग दरों को काफी कम करता है.

BiznessApps

मजबूत कॉल-टू-एक्शन, जोर दिया नारा और एंडोर्समेंट्स की एक प्रभावशाली सूची - यह लैंडिंग पृष्ठ के लिए सही संयोजन है और इस पृष्ठ में यह है। इसके अलावा, इसमें न्यूनतम मात्रा में पाठ शामिल है और एक डेमो वीडियो का उपयोग करता है, क्योंकि यह एक ज्ञात तथ्य है कि लोग पढ़ने की तुलना में एक छोटी फिल्म देखना पसंद करते हैं। प्रपत्र एक ऐसा तत्व है जिस पर वे थोड़ा सुधार कर सकते हैं। आमतौर पर, आपको प्राप्त करने से पहले आपको पहले देना चाहिए, इसलिए यदि फ़ॉर्म सबमिट करने के बदले में आगंतुक मुफ्त उपचार प्राप्त कर सकते हैं, तो "संदेश भेजें" बटन कुछ ऐसा कह सकता है जैसे "अपना मुफ्त सामान प्राप्त करें!"

Brusheezy

एक और प्रमाण कम अधिक है। यह लैंडिंग पृष्ठ एकल आइकन और प्रमुख हेडर के साथ बहुत साफ दिखता है। दो कॉल-टू-एक्शन को नोटिस करें, ऊपर और नीचे - यह पृष्ठ को ओवरक्राउड किए बिना संदेश को लगातार बनाने के लिए एक मूर्खतापूर्ण तरीका है। उत्पाद की विशेषताओं के बजाय ग्राहकों के लिए लाभ को उजागर करना एक और घमंड है.

भागने

यह पृष्ठ थोड़ा भीड़ भरा हो सकता है, लेकिन यह ऐप्स के लिए लैंडिंग पृष्ठ की परंपरा में है। हालांकि, पृष्ठ को खंडों में विभाजित करने का निर्णय सभी तत्वों के माध्यम से नेविगेट करना आसान बनाता है। यदि आप परिणाम से खुश नहीं हैं, तो आप वह सब कुछ पा सकते हैं जो आप ढूंढ रहे हैं: सुविधाएँ, लाभ, प्रशंसापत्र और यहां तक ​​कि धनवापसी की गारंटी भी। अंतिम एक काफी जोखिम भरा है, क्योंकि यह सेवा की गुणवत्ता पर सवाल उठा सकता है, और यह सभी तरह से नीचे रखने के लिए एक अच्छा विचार था।

PageLines

मिनिमलिज्म यहां की प्रमुख अवधारणा है। मुझे व्यक्तिगत रूप से पसंद है कि यह पृष्ठ आपको तुरंत सब कुछ नहीं बताता है, लेकिन आपको खोजने के लिए आमंत्रित करता है। हालाँकि, मुझे ऐसा आनंद नहीं मिल रहा है, लेकिन यह एक ऐसा वीडियो है जो अपने आप शुरू हो जाता है (एक फीचर जिसे मैं आमतौर पर टालता हूं) - भले ही एंड्रयू पॉवर्स न केवल निपुण हो, बल्कि सुंदर भी हो! इसके अलावा, तथ्य यह है कि तत्काल CTA नहीं है, वेबसाइट के लिए एक खामी हो सकती है.

पिको

यह लैंडिंग पृष्ठ सरल है फिर भी शक्तिशाली है। "लाल चिन्ह" से बड़ा "नमक और काली मिर्च है जो समग्र रूप में दिखाई देता है। पैराग्राफ व्यवस्था एक अखबार के लेआउट से मिलती-जुलती है और सीएमएस के उद्देश्य के लिए काफी विचारोत्तेजक है। सीटीए बटन थोड़ा कमजोर हैं, हालांकि, और निचले दाएं कोने में महिला एक हल्के डिस्ट्रेक्टिन का कारण बनती है; उसके चेहरे पर बहुत अधिक आश्चर्य के साथ, क्या वह ऐसी दिखती है जैसे वह किसी व्यावसायिक मामले पर बातचीत करने में सक्षम है?

Shoeboxed

प्रत्येक अनुभाग के लिए वर्णनात्मक लाइनें वर्णनात्मक भाषा के उपयोग का एक उदाहरण हैं। आप संदेश को एक दूसरे विभाजन में समझते हैं, क्योंकि आपकी दृष्टि की रेखा जल्दी से पहली पंक्ति को स्कैन करती है और सीटीए बटन पर आती है। यदि आप अभी भी झिझक रहे हैं, तो मजबूत समर्थन के साथ-साथ मदद करने के लिए एक प्रशंसापत्र है - क्या आप फोर्ब्स और टेक क्रंच में चित्रित कंपनी पर भरोसा नहीं करेंगे? मैं.

Squarespace

प्रोफेशनल लुकिंग लैंडिंग पेज, यह है। एक बोल्ड नारा, सीटीए बटन जिसे आप क्लिक करने और एक बहुत अच्छे विज्ञापन का विरोध नहीं कर सकते, यह सफलता का संयोजन है। मुझे यह भी पसंद है कि वे अपने उपयोग के संदर्भ को पृष्ठ के केंद्र में रखते हैं, जिस तरह से उनके पृष्ठ दिखते हैं और इन -ोग्राफिक जैसे संकेत मिलते हैं। पृष्ठ का 3-तत्व संरचना एक और मजबूत बिंदु है.

संपादक की टिप्पणी: इस पोस्ट के द्वारा लिखा गया है लौरा मोइसी Hongkiat.com के लिए। लॉरा के पास संचार विज्ञान में स्नातक की डिग्री है और वह डिजाइन और लेखन के अपने जुनून का पीछा करते हुए ज्यादातर समय बिताती है। वह 123ContactForm के लिए काम करता है, जो एक ऑनलाइन फॉर्म और सर्वे बिल्डर है जो उपयोगकर्ताओं को किसी भी वेब पेज के लिए सुंदर रूप बनाने में मदद करता है.