संस्करण 3.0: एक पेज बिल्डर को कैसे काम करना चाहिए, इस पर पुनर्विचार

द्वारा लिखित

में

,

version-3-0-rethinking-how-a-page-builder-should-workPage Builder Sandwich को सार्वजनिक रूप से जारी किए हमें 10 महीने हो चुके हैं। अब हमारे पास लगभग 6,000 सक्रिय इंस्टॉल हैं, और यह हमारे लिए काफी बड़ी उपलब्धि है। हमें इसके कारण बहुत सारा फ़ीडबैक भी मिला है, अच्छा और बुरा दोनों। हालाँकि आम सहमति यह है कि अन्य पेज बिल्डरों की तुलना में लोग लेआउट बनाने और अपनी सामग्री तैयार करने में इसकी सरलता का आनंद ले रहे हैं।

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

पुराना इंटरफ़ेस

PBS के पिछले संस्करणों में, हम चाहते थे कि सब कुछ बटन के रूप में हो। क्यों? क्योंकि बटनों का उपयोग करना आसान होता है। आप बस… उन पर क्लिक करते हैं। इंस्पेक्टर (ऊपर की छवि में साइडबार) के पुराने संस्करणों में, किसी बटन पर क्लिक करने से मान बढ़ जाता था, और फिर shift+क्लिक करने से वह घट जाता था। यह सुनने में काफी आसान लगता है। लेकिन कैरोसेल, टैब, मैप और अन्य नए तत्वों व फ़ीचर्स के जुड़ने के साथ, वे सभी बटन विभिन्न डिज़ाइनों वाले अलग-अलग आइकन का मिश्रण बन गए, और एक शानदार इंटरफ़ेस के बजाय कुछ हद तक चित्रलिपि की तरह दिखने लगे। यह अनुभवी उपयोगकर्ताओं के लिए कोई समस्या नहीं थी, लेकिन यदि आप PBS में नए हैं तो इसे देखना काफी डराने वाला है।

इसके बाद, इंस्पेक्टर में कुछ समस्याएं सामने आने लगीं। मूल विचार सब कुछ इंस्पेक्टर के अंदर सरल और उपलब्ध कराना था। और सब कुछ से, मेरा मतलब सब कुछ था – टेक्स्ट को हेडिंग में बदलने से लेकर बैकग्राउंड रंग, फ़ॉन्ट रंग बदलने तक, जो भी आप कहें। हालाँकि, अपनी वर्तमान स्थिति में, इंस्पेक्टर में अब बहुत सारे विकल्प हैं जिनके कारण आपको लगातार ऊपर और नीचे स्क्रॉल करने के लिए माउस व्हील का उपयोग करना पड़ता है। उस इंस्पेक्टर से काफी अलग जिसे मैंने पहले उपयोगकर्ताओं के लिए बनाने की उम्मीद की थी।

अंत में, हमने हाल ही में आपके पसंदीदा प्लगइन्स के लिए शॉर्टकोड मैपिंग. इस फ़ीचर के लिए हमें आपके शॉर्टकोड संपादन अनुभव को अधिक सुखद बनाने के लिए टेक्स्ट फ़ील्ड, नंबर स्लाइडर, चेकबॉक्स और अतिरिक्त नए विकल्प प्रकार बनाने की आवश्यकता थी। शुरुआत में, यह एक अच्छा विचार था, और हाँ, इसने आपके लिए शॉर्टकोड का उपयोग करना आसान बना दिया। लेकिन फिर से, यह फ़ीचर हमारे “केवल बटन” वाले इंटरफ़ेस से भटक गया। अतीत पर नज़र डालें, तो शॉर्टकोड विशेषताओं को बदलने के लिए केवल बटनों का उपयोग करना वास्तव में असंभव था। अब, नवीनतम संस्करण में, हमारे पास 2 प्रकार के नियंत्रण रह गए: बटन और शॉर्टकोड फ़ील्ड।

कुछ और भी कारण थे जिन्होंने हमें यह निर्णय लेने पर मजबूर किया कि हमारा इंटरफ़ेस अब प्रभावी नहीं रहा (या हमारी ज़रूरतों के अनुकूल नहीं रहा), लेकिन उपरोक्त बिंदु प्रमुख हैं। हालाँकि एक बात हमेशा पक्की थी: हम जानते थे कि हमें इंटरफ़ेस को अपडेट करना होगा।

यह परिभाषित करना कि किसी पेज बिल्डर को आदर्श रूप से कैसे काम करना चाहिए

सीधे कूद पड़ने और तुरंत बदलाव करने के बजाय, हमने पूरे पेज बिल्डर अनुभव पर नज़र डालने के लिए सौ कदम पीछे लिए। हम इंटरफ़ेस में एक नई जान फूंकना चाहते थे। सच कहें तो, हम इसे साल-दर-साल दोबारा नहीं बनाते रहना चाहते थे। यह थका देने वाला है और निश्चित रूप से वर्डप्रेस समुदाय के लिए कोई महत्वपूर्ण मदद नहीं लाता है। इस बार, हमने चीजों को धीमे और सावधानीपूर्वक करने का फैसला किया। हमने Page Builder Sandwich के हर पहलू का अध्ययन किया है और यह भी देखा कि क्या चीज़ इसे एक अच्छा पेज बिल्डर बनाती है, और अंततः पूरे संपादन अनुभव को कुछ मुख्य अवधारणाओं में ढाला है।

आवश्यक अवधारणा #1: चीज़ों को संपादित करने के लिए सीधे अपनी सामग्री में टाइप करना

पेज बिल्डर इंस्टॉल करने का एक मुख्य कारण वर्डप्रेस के बैकएंड टेक्स्ट एडिटर की सीमाओं से बाहर निकलना है। ऐसा नहीं है कि बैकएंड एडिटर अच्छा नहीं है, लेकिन अपने वेबपेज बनाते समय, यह आपको तुरंत यह नहीं दिखाता कि आपकी साइट के विज़िटर्स को आपका वेबपेज कैसा दिखेगा, और न ही यह आपको एक-कॉलम लेआउट से बाहर अपनी सामग्री को लेआउट करने की अनुमति देता है। आप वहाँ केवल अपना टेक्स्ट और कुछ छवियां ही देख सकते हैं, लेकिन कोई भी विस्तृत सामग्री (जैसे संपर्क फ़ॉर्म) नहीं। आप शॉर्टकोड जोड़ सकते हैं, हाँ, लेकिन वे अपने रेंडर किए गए रूप में दिखाई नहीं देंगे*।

* इसे हल करने के लिए दूसरों द्वारा शॉर्टकेक यूआई (Shortcake UI) जैसे प्लगइन्स बनाए जा रहे हैं, लेकिन यह अलग बात है।

यहीं पर फ्रंट एंड पेज बिल्डर्स काम आते हैं। वे संपादन अनुभव को बैकएंड से बाहर निकालकर फ्रंट एंड में लाते हैं, जहाँ आप अपनी साइट को उसी तरह संपादित करते हैं जैसे आपके विज़िटर्स इसे वास्तव में देखेंगे. जैसा कि पिपिन इसे कहेंगे: जो आप देखते हैं वही आपको मिलता है (WYSIWYG)।

फ्रंटएंड एडिटर होने की एक और अच्छी बात यह है कि यह आपको अपने टेक्स्ट को सीधे संपादित करने की अनुमति देता है। हेडिंग और पैराग्राफ में टाइप करना वेबसाइट निर्माण में सामान्य वर्ड प्रोसेसर का उपयोग करने की आसानी प्रदान करता है। बटनों और टैब लेबलों को भी बस उन पर क्लिक करके और टाइप करके बदला जा सकना चाहिए।

यह वह क्षेत्र है जहाँ अधिकांश अन्य पेज बिल्डर्स खरा नहीं उतरते। उनमें से अधिकांश आपको सब कुछ संपादित करने के लिए टेक्स्ट फ़ील्ड के अंदर टाइप करने के लिए मजबूर करते हैं। फिर से कहें तो, वास्तविक फ्रंटएंड पेज बिल्डरों में ऐसा नहीं होना चाहिए। सीधे टेक्स्ट टाइप करना और संपादित करना संस्करण 2 से ही Page Builder Sandwich की एक मज़बूत विशेषता रही है, और हमने यह सुनिश्चित किया है कि इसे संस्करण 3 में भी बरकरार रखा जाए।

आवश्यक अवधारणा #2: त्वरित बदलावों के लिए माउस का उपयोग करना

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

पहली बात तो यह कि पेज संपादन में माउस को एक टूल के रूप में उपयोग करने पर बेहतरीन विज़ुअल फ़ीडबैक मिलता है, विशेष रूप से मार्जिन, पैडिंग और साइज़ जैसे विज़ुअल गुणों को समायोजित करने में। अब, अपने तत्वों में बदलाव करना एक स्वाभाविक अनुभव बन जाता है।

PBS संस्करण 3 में, आप अपने माउस का उपयोग करके कई चीजों को समायोजित करने में सक्षम होंगे। आप अलग-अलग तत्वों के बीच मार्जिन/दूरी, अपने कॉलम के भीतर पैडिंग, साथ ही छवियों, आइकन और मैप्स के आकार को समायोजित कर सकते हैं। हमने उन बटनों को भी स्लाइडर्स से बदल दिया है जो आपको संख्यात्मक मान बदलने की अनुमति देते हैं।

आवश्यक अवधारणा #3: टेक्स्ट को स्टाइल करना आसान होना चाहिए

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

चूँकि हम अक्सर टेक्स्ट को स्टाइल करते हैं, इसलिए वे बटन जो हमें स्टाइल बदलने की अनुमति देते हैं, बहुत सुलभ होने चाहिए। उन्हें किसी पॉप-अप बॉक्स के अंदर छिपा नहीं होना चाहिए जिसे हमें पहले खोलना पड़े। अधिकांश पेज बिल्डर इस बीमारी से पीड़ित हैं। अपने यूज़र इंटरफ़ेस को ‘अव्यवस्था-मुक्त’ का लेबल दिलाने के लिए, सबसे अधिक उपयोग किए जाने वाले विकल्पों को भी सामने से छिपा दिया जाता है।

इसे हल करने के लिए, हमने सबसे अधिक उपयोग किए जाने वाले वर्ड प्रोसेसर्स पर एक नज़र डाली। हमने देखा कि उनमें आम तौर पर स्क्रीन के शीर्ष के पास टेक्स्ट को फ़ॉर्मेट करने के लिए बहुत सारे बटनों की एक पंक्ति होती है और संस्करण 3 के लिए उसी लेआउट की नकल की गई है। अब हमारे पास हमेशा आपकी स्क्रीन के शीर्ष पर सभी टेक्स्ट स्टाइलिंग बटनों की एक पंक्ति मौजूद होती है। यह स्टाइलिंग को वास्तव में तेज़ बनाता है और टेक्स्ट संपादन को आपके स्वभाव के बिल्कुल अनुकूल बना देता है।

आवश्यक अवधारणा #4: उन्नत स्टाइलिंग विकल्प लचीले लेकिन समझने में आसान होने चाहिए

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

आवश्यक अवधारणा #5: शॉर्टकोड समर्थन

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

हमने कुछ सप्ताह पहले अपने शॉर्टकोड मैपिंग सिस्टम को पेश किया था, और इसके कारण हमने सैकड़ों प्लगइन्स से सैकड़ों शॉर्टकोड मैप किए हैं। हमने वर्डप्रेस प्लगइन डायरेक्टरी में पाए जाने वाले सबसे लोकप्रिय प्लगइन्स को प्राथमिकता दी है, इसलिए संभावना है कि आप अपनी साइटों में उनका सामना करेंगे। यह संस्करण 3 में केवल और अधिक मजबूत हुआ है, और हम आगे भी इसमें सुधार करना जारी रखेंगे।

निष्कर्ष

हमने ऊपर दिए गए उन सभी आवश्यक गुणों को लिया है और उन्हें Page Builder Sandwich संस्करण 3 में शामिल किया है। यह वर्डप्रेस के लिए अब तक का हमारा बनाया हुआ सबसे बेहतरीन पेज बिल्डर है। यह अधिक सहज और उपयोग करने में अधिक स्वाभाविक है, यह अधिक तेज़ी से काम करता है, उपयोग में आसान है, और पहले से कहीं अधिक अनुकूल है।

यदि किसी आवश्यक पेज बिल्डर फ़ीचर पर आपके कोई विचार हैं, तो नीचे टिप्पणी करके हमें बताएं।