संस्करण ३.०: पेज बिल्डरले कसरी काम गर्नुपर्छ भन्ने पुनर्विचार

लेखक

मा

,

version-3-0-rethinking-how-a-page-builder-should-workहामीले पेज बिल्डर स्यान्डविच (Page Builder Sandwich) सार्वजनिक गरेको १० महिना भइसकेको छ। अहिले हामीसँग करिब ६,००० सक्रिय इन्स्टलहरू छन्, र यो हाम्रो लागि ठूलो उपलब्धि हो। यसका कारण हामीले राम्रा र नराम्रा दुवै किसिमका थुप्रै प्रतिक्रियाहरू पनि पाएका छौं। यद्यपि, साझा धारणा यो छ कि अन्य पेज बिल्डरहरूको तुलनामा लेआउटहरू बनाउन र आफ्नो सामग्री सिर्जना गर्न कति सजिलो छ भन्ने कुरा मानिसहरूलाई मन परेको छ।

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

निष्क्रिय इन्टरफेस

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

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

अन्त्यमा, हामीले हालसालै तपाईंका मनपर्ने प्लगइनहरूका लागि सर्टकोड म्यापिङ. तपाईंको सर्टकोड सम्पादन अनुभवलाई अझ रमाइलो बनाउन आवश्यक पर्ने टेक्स्ट फिल्ड, नम्बर स्लाइडर, चेकबक्स, र अतिरिक्त नयाँ विकल्प प्रकारहरू सिर्जना गर्न यो सुविधाले हामीलाई बाध्य बनायो। सुरुमा, यो राम्रो विचार थियो, र हो, यसले तपाईंको लागि सर्टकोडहरू व्यवस्थापन गर्न सजिलो बनायो। तर फेरि, यो सुविधा हाम्रो “बटनहरू मात्र” भएको इन्टरफेसबाट विचलित भयो। पछाडि फर्केर हेर्दा, सर्टकोड विशेषताहरू परिवर्तन गर्न केवल बटनहरू प्रयोग गर्न साँच्चै असम्भव थियो। अब, नवीनतम संस्करणमा, हामी २ प्रकारका नियन्त्रणहरूमा पुग्यौं: बटनहरू र सर्टकोड फिल्डहरू।

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

पेज बिल्डरले आदर्श रूपमा कसरी काम गर्नुपर्छ भनेर परिभाषित गर्दै

तुरुन्तै अगाडि बढेर परिवर्तन गर्नुको सट्टा, हामीले सम्पूर्ण पेज बिल्डर अनुभवलाई हेर्नका लागि सय कदम पछाडि हट्यौं। हामी इन्टरफेसमा नयाँ जीवन ल्याउन चाहन्थ्यौं। साँचो भन्नुपर्दा, हामी वर्षैपिच्छे यसलाई फेरि बनाइरहन चाहँदैनथ्यौं। यो थकाइलाग्दो छ र यसले निश्चित रूपमा वर्डप्रेस समुदायलाई महत्त्वपूर्ण मद्दत पुर्‍याउँदैन। यस पटक, हामीले कामहरू बिस्तारै र होसियारीपूर्वक गर्ने निर्णय गर्‍यौं। हामीले पेज बिल्डर स्यान्डविचको प्रत्येक पक्ष र यसलाई के ले राम्रो पेज बिल्डर बनाउँछ भन्ने कुराको अध्ययन गर्‍यौं, र अन्ततः सम्पूर्ण सम्पादन अनुभवलाई केही मुख्य अवधारणाहरूमा रूपान्तरण गर्‍यौं।

आवश्यक अवधारणा #१: कुराहरू सम्पादन गर्न आफ्नो सामग्रीमा सिधै टाइप गर्ने

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

* यसलाई सम्बोधन गर्न सर्टकेक यूआई (Shortcake UI) जस्ता अरूले बनाएका प्लगइनहरू छन्, तर त्यो फरक कुरा हो।

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

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

यो त्यस्तो क्षेत्र हो जहाँ अन्य धेरै पेज बिल्डरहरू राम्रो परिणाम दिन सक्दैनन्। तीमध्ये धेरैले तपाईंलाई सबै कुरा सम्पादन गर्न टेक्स्ट फिल्ड भित्र टाइप गर्न बाध्य पार्छन्। फेरि भन्नुपर्दा, वास्तविक फ्रन्टएन्ड पेज बिल्डरहरूमा यस्तो हुनु हुँदैन। पाठ सिधै टाइप र सम्पादन गर्नु संस्करण २ देखि नै पेज बिल्डर स्यान्डविचको बलियो पक्ष रहेको छ, र हामीले संस्करण ३ मा पनि यो कायमै रहेको सुनिश्चित गरेका छौं।

आवश्यक अवधारणा #२: द्रुत समायोजनका लागि माउसको सदुपयोग गर्ने

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

उदाहरणका लागि, पृष्ठ सम्पादनमा माउसलाई उपकरणको रूपमा प्रयोग गर्दा, विशेष गरी मार्जिन, प्याडिङ र आकार जस्ता दृश्य गुणहरू समायोजन गर्दा उत्कृष्ट भिजुअल प्रतिक्रिया प्राप्त हुन्छ। अब, आफ्ना तत्वहरू समायोजन गर्नु एक स्वाभाविक अनुभव बन्दछ।

PBS संस्करण ३ मा, तपाईंले आफ्नो माउस प्रयोग गरेर धेरै कुराहरू समायोजन गर्न सक्नुहुनेछ। तपाईं व्यक्तिगत तत्वहरू बीचको मार्जिन/खाली ठाउँ, आफ्ना स्तम्भहरू भित्रको प्याडिङ, साथै छविहरू, आइकनहरू र नक्साहरूको आकार समायोजन गर्न सक्नुहुन्छ। हामीले संख्यात्मक मानहरू परिवर्तन गर्न अनुमति दिने बटनहरूलाई स्लाइडरहरूले प्रतिस्थापन गरेका छौं।

आवश्यक अवधारणा #३: पाठ स्टाइल गर्न सजिलो हुनुपर्छ

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

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

यसलाई समाधान गर्न, हामीले सामान्यतया प्रयोग हुने वर्ड प्रोसेसरहरू हेर्यौं। हामीले याद गर्यौं कि तिनीहरूमा प्रायः स्क्रिनको माथितिर पाठ ढाँचाबद्ध गर्न प्रयोग हुने धेरै बटनहरूको पङ्क्ति हुन्छ र संस्करण ३ को लागि उही लेआउट कपी गर्‍यौं। अब हामीसँग तपाईंको स्क्रिनको शीर्ष भागमा सधैं उपस्थित हुने सबै पाठ स्टाइलिङ बटनहरूको पङ्क्ति छ। यसले स्टाइलिङलाई साँच्चै छिटो र पाठ सम्पादनमा तपाईंको दोस्रो स्वभावको नजिक बनाउँछ।

आवश्यक अवधारणा #४: उन्नत स्टाइलिङ विकल्पहरू लचिलो भए पनि बुझ्न सजिलो हुनुपर्छ

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

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

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

हामीले केही हप्ताअघि हाम्रो सर्टकोड म्यापिङ प्रणाली प्रस्तुत गरेका थियौं, र यसको कारणले हामीले सयौं प्लगइनहरूबाट सयौं सर्टकोडहरू म्याप गरेका छौं। हामीले वर्डप्रेस प्लगइन डाइरेक्टरीमा फेला पर्ने सबैभन्दा लोकप्रिय प्लगइनहरूलाई प्राथमिकता दिएका छौं, त्यसैले तपाईंले तिनीहरूलाई आफ्नै साइटहरूमा भेट्ने सम्भावना छ। संस्करण ३ मा यो अझ बलियो भएको छ, र हामी भविष्यमा पनि यसलाई सुधार गर्न जारी राख्नेछौं।

निष्कर्ष

हामीले माथिका सबै आवश्यक गुणहरू लिएका छौं र तिनीहरूलाई पेज बिल्डर स्यान्डविच संस्करण ३ मा निर्माण गरेका छौं। यो हामीले वर्डप्रेसका लागि अहिलेसम्म बनाएको उत्कृष्ट पेज बिल्डर हो। यो प्रयोग गर्न पहिलेभन्दा अझ सहज र स्वाभाविक छ, यसले छिटो काम गर्छ, प्रयोग गर्न सजिलो छ, र पहिलेभन्दा अझ मैत्रीपूर्ण छ।

यदि आवश्यक पेज बिल्डर सुविधाका बारेमा तपाईंका केही विचारहरू छन् भने, तल टिप्पणी गरेर हामीलाई जानकारी दिनुहोस्।