साइन-अप फ़ॉर्म के सबसे सही तरीके

साइन अप करने, लॉग इन करने, और किसी भी परेशानी के साथ अपने खाते की जानकारी मैनेज करने में अपने उपयोगकर्ताओं की मदद करें.

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

यहां एक बेहद आसान साइन-अप फ़ॉर्म का उदाहरण दिया गया है, जिसमें सभी सबसे सही तरीकों के बारे में बताया गया है:

चेकलिस्ट

अगर हो सके, तो साइन-इन करने से बचें

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

सबसे अच्छा साइन-अप फ़ॉर्म, कोई साइन-अप फ़ॉर्म नहीं है!

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

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

साइन-इन को साफ़ तौर पर बताएं

साफ़ तौर पर बताएं कि आपकी साइट पर खाता कैसे बनाना है, उदाहरण के लिए लॉगिन या साइन इन करके बटन पर क्लिक करें. ऐसे आइकॉन या शब्दों का इस्तेमाल करने से बचें जिनमें साफ़ तौर पर जानकारी न दी गई हो ("शुरू हो जाएं!", नेविगेशन मेन्यू में लॉगिन को न छिपाएं. उपयोगिता विशेषज्ञ स्टीव क्रुग का जवाब वेबसाइट को इस्तेमाल करने का तरीका: मुझे ऐसा मत लगना चाहिए! अगर आपको अपनी वेब टीम के अन्य सदस्यों को शामिल करने के लिए, Analytics का इस्तेमाल करके के विकल्प.

Android फ़ोन पर, मॉकअप ई-कॉमर्स वेबसाइट के दो स्क्रीनशॉट दिख रहे हैं. बाईं ओर वाले आइकॉन में, साइन-इन करने के लिंक के लिए आइकॉन का इस्तेमाल किया जाता है. इस आइकॉन को समझना मुश्किल होता है; दाईं ओर वाला बस यह कहता है 'साइन इन करें'
साइन इन को साफ़ तौर पर बताएं. आइकॉन अस्पष्ट हो सकता है, लेकिन वह साइन in बटन या लिंक साफ़ तौर पर बताया गया हो.
Gmail में साइन इन के स्क्रीनशॉट: एक पेज, जिसमें 'साइन इन करें' बटन दिख रहा है. क्लिक करने पर, उस फ़ॉर्म पर ले जाया जाता है जिसमें 'खाता बनाएं' लिंक भी मौजूद है.
खाता बनाने के लिए, Gmail के साइन इन पेज पर एक लिंक दिया गया है.
अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है यहां दिखाई गई विंडो से बड़े विंडो आकार पर, Gmail साइन इन करें लिंक और किसी खाता बटन.

पक्का करें कि उन उपयोगकर्ताओं के खाते लिंक किए जाएं जो आइडेंटिटी प्रोवाइडर के ज़रिए साइन अप करते हैं, जैसे कि Google और तो आपको ईमेल और पासवर्ड का इस्तेमाल करके भी साइन अप करना होगा. अगर आपके पास किसी उपयोगकर्ता के ईमेल पते का ऐक्सेस है, तो यह आसान है और दो खातों से मैच करता है. नीचे दिया गया कोड दिखाता है कि Google साइन-इन करने वाले उपयोगकर्ता का ईमेल डेटा कैसे ऐक्सेस किया जाए.

// auth2 is initialized with gapi.auth2.init()
if (auth2.isSignedIn.get()) {
  var profile = auth2.currentUser.get().getBasicProfile();
  console.log(`Email: ${profile.getEmail()}`);
}

साफ़ तौर पर बताएं कि खाते की जानकारी कैसे ऐक्सेस की जा सकती है

उपयोगकर्ता के साइन इन करने के बाद, उसे खाते की जानकारी ऐक्सेस करने का तरीका साफ़ तौर पर बताएं. खास तौर पर, यह पासवर्ड बदलने या रीसेट करने का तरीका साफ़ तौर पर बताया गया हो.

ग़ैर-ज़रूरी चीज़ें हटाएं

साइन-अप फ़्लो में, आपका काम मुश्किलों को कम करना और उपयोगकर्ता को ध्यान में रखकर काम करना है. ग़ैर-ज़रूरी चीज़ें हटाएं. यह ध्यान भटकाने और लालच देने का समय नहीं है!

साइन अप करने की प्रोसेस पूरी करने से उपयोगकर्ताओं का ध्यान न भटकाएं.

साइन-अप करते समय, जितनी कम हो सके उतनी कम जानकारी मांगें. उपयोगकर्ता का अतिरिक्त डेटा इकट्ठा करना, जैसे कि नाम और पता और जब उपयोगकर्ता को वह डेटा देने का साफ़ तौर पर फ़ायदा दिखता हो. ध्यान रखें कि डेटा का हर वह आइटम जिसके बारे में आप जानकारी देते हैं और स्टोर करते हैं, उस पर लागत और कानूनी जवाबदेही लगती है.

अपने इनपुट को दो बार न बढ़ाएं, ताकि यह पक्का किया जा सके कि उपयोगकर्ताओं को उनके संपर्क की जानकारी सही मिले. इससे रफ़्तार कम हो जाएगी फ़ॉर्म पूरा भरा गया. फ़ॉर्म के फ़ील्ड के अपने-आप भरे जाने का कोई मतलब नहीं. इसके बजाय, पुष्टि करने का मैसेज भेजें उपयोगकर्ता द्वारा अपनी संपर्क जानकारी दर्ज करने के बाद, खाता बनाना जारी रखें उन्हें जवाब नहीं देना चाहिए. यह एक सामान्य साइन-अप पैटर्न है: उपयोगकर्ताओं को इसकी आदत है.

हो सकता है कि आप उपयोगकर्ताओं को हर बार साइन इन करने पर एक कोड भेजकर पासवर्ड के बिना साइन-इन करने पर विचार करना चाहें नया डिवाइस या ब्राउज़र खोलें. Slack और Medium जैसी साइटें इसका वर्शन इस्तेमाल करती हैं.

medium.com पर बिना पासवर्ड के साइन इन करें.

फ़ेडरेटेड लॉगिन की तरह ही, इसका एक अतिरिक्त फ़ायदा यह भी है कि आपको उपयोगकर्ता पासवर्ड मैनेज करने की ज़रूरत नहीं पड़ती.

सेशन की अवधि चुनें

उपयोगकर्ता की पहचान के लिए आप चाहे जो भी तरीका अपनाएं, आपको सेशन के बारे में सोच-समझकर फ़ैसला लेना होगा अवधि: उपयोगकर्ता कितने समय तक लॉग इन रहता है और किस वजह से उन्हें लॉग आउट किया जा सकता है.

इस बात पर ध्यान दें कि आपके उपयोगकर्ता, मोबाइल का इस्तेमाल करते हैं या डेस्कटॉप. वे डेस्कटॉप पर शेयर कर रहे हों या डिवाइसों को शेयर कर रहे हों.

पासवर्ड का सुरक्षित सुझाव देने और उसे सेव करने में पासवर्ड मैनेजर की मदद करें

पासवर्ड के सुझाव देने और उसे सेव करने में तीसरे पक्ष और पहले से मौजूद ब्राउज़र पासवर्ड मैनेजर की मदद की जा सकती है, ताकि उपयोगकर्ताओं को पासवर्ड चुनने, याद रखने या टाइप करने की ज़रूरत नहीं होती. पासवर्ड मैनेजर इन डिवाइसों पर बेहतर तरीके से काम करते हैं मॉडर्न ब्राउज़र, कई प्लैटफ़ॉर्म पर काम करने वाले ऐप्लिकेशन, और वेब ऐप्लिकेशन पर खातों को सिंक करना नए डिवाइसों के लिए.

इस वजह से, साइन-अप फ़ॉर्म को सही तरीके से कोड करना बेहद ज़रूरी हो जाता है. खास तौर पर, सही कोड का इस्तेमाल करना अपने-आप पूरे होने वाले मान. साइन-अप फ़ॉर्म के लिए नए पासवर्ड के लिए autocomplete="new-password" का इस्तेमाल करें और जहां भी संभव हो, अन्य फ़ॉर्म फ़ील्ड में अपने आप पूर्ण मान सही करें, जैसे autocomplete="email" और autocomplete="tel". आप अलग-अलग name और id का इस्तेमाल करके भी पासवर्ड मैनेजर की मदद कर सकते हैं form एलिमेंट के लिए, साइन-अप और साइन-इन फ़ॉर्म में दी गई वैल्यू. इसके अलावा, किसी भी input, select के लिए और textarea एलिमेंट शामिल हैं.

आपको सही type एट्रिब्यूट का भी इस्तेमाल करना चाहिए का इस्तेमाल करें. ज़्यादा जानकारी के लिए, पेमेंट और पता फ़ॉर्म सबमिट करने के सबसे सही तरीके देखें.

पक्का करें कि उपयोगकर्ता सुरक्षित पासवर्ड डालें

सबसे अच्छा विकल्प पासवर्ड के सुझाव देने के लिए पासवर्ड मैनेजर को चालू करना है. साथ ही, आपको इसके लिए प्रोत्साहित करना चाहिए उपयोगकर्ताओं को ब्राउज़र और तीसरे पक्ष के ब्राउज़र मैनेजर के सुझाए हुए मज़बूत पासवर्ड स्वीकार करने होंगे.

हालांकि, कई उपयोगकर्ता अपने पासवर्ड डालना चाहते हैं, इसलिए आपको पासवर्ड से जुड़े नियम लागू करने होंगे ताकत. अमेरिका के नैशनल इंस्टिट्यूट ऑफ़ स्टैंडर्ड्स ऐंड टेक्नोलॉजी के बारे में बताया गया है असुरक्षित पासवर्ड से बचने का तरीका जानें.

पासवर्ड को हैक या चोरी होने की अनुमति न दें

पासवर्ड के लिए कोई भी नियम चुनें, लेकिन आपको ऐसे पासवर्ड को अनुमति नहीं देनी चाहिए जो बिना अनुमति के सार्वजनिक किए गए हों सुरक्षा के उल्लंघन.

किसी उपयोगकर्ता के ज़रिए पासवर्ड डालने के बाद, आपको यह जांच करनी होगी कि यह पहले से बनाया गया कोई पासवर्ड नहीं है डिवाइस हैक हो गया है. क्या मुझे Pwned साइट मिली है, यह पासवर्ड के लिए एपीआई उपलब्ध कराती है की जांच कर रहे हैं या आप खुद इसे सेवा के रूप में चला सकते हैं.

Google के Password Manager में आपको यह देखने की सुविधा भी मिलती है कि आपका कोई मौजूदा पासवर्ड हैक किया गया है.

अगर आप उपयोगकर्ता के बताए गए पासवर्ड को अस्वीकार करते हैं, तो उन्हें साफ़ तौर पर बताएं कि पासवर्ड को अस्वीकार क्यों किया गया है. समस्याओं को इनलाइन दिखाएं और उन्हें ठीक करने का तरीका बताएं, जैसे ही उपयोगकर्ता ने कोई वैल्यू डाली हो—न कि साइन-अप फ़ॉर्म सबमिट करने के बाद अपने सर्वर से जवाब मिलने का इंतज़ार करें.

साफ़ तौर पर बताएं कि पासवर्ड अस्वीकार क्यों किया गया है.

पासवर्ड चिपकाने की अनुमति न दें

कुछ साइटें, पासवर्ड इनपुट में टेक्स्ट चिपकाने की अनुमति नहीं देती हैं.

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

पासवर्ड को कभी भी सादे टेक्स्ट में सेव या ट्रांसमिट न करें

पासवर्ड को साल्ट और हैश करें और अपना हैशिंग एल्गोरिदम खुद बनाने की कोशिश न करें!

ज़बरदस्ती पासवर्ड अपडेट न करें

उपयोगकर्ताओं को मनचाहे तरीके से पासवर्ड अपडेट करने के लिए मजबूर न करें.

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

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

आपको उपयोगकर्ताओं को उनके खाते के लॉगिन इतिहास का ऐक्सेस भी देना चाहिए, ताकि उन्हें बताया जा सके कि वे कहां लॉगिन करने की प्रोसेस शुरू हो जाती है.

Gmail खाता गतिविधि पेज
Gmail खाता गतिविधि पेज.

पासवर्ड बदलने या रीसेट करने की प्रोसेस को आसान बनाना

उपयोगकर्ताओं को साफ़ तौर पर बताएं कि उन्हें अपने खाते का पासवर्ड कहां और कैसे अपडेट करना है. कुछ साइटों पर, यह मुश्किल है.

निश्चित रूप से, आपको उपयोगकर्ताओं के लिए अपना पासवर्ड भूल जाने पर उसे रीसेट करने की प्रक्रिया को भी आसान बनाना चाहिए. Open Web Apps Security Project में, खोए हुए डेटा को मैनेज करने के तरीके के बारे में ज़्यादा जानकारी दी गई है पासवर्ड.

आपके कारोबार और उपयोगकर्ताओं को सुरक्षित रखने के लिए, यह खास तौर पर ज़रूरी है कि पासवर्ड भी सेव कर सकते हैं. इसे आसान बनाने के लिए, आपको /.well-known/change-password आपके जो आपके पासवर्ड मैनेजमेंट पेज पर रीडायरेक्ट करती हो. इससे पासवर्ड मैनेजर, आपके उपयोगकर्ताओं को सीधे उस पेज पर ले जाते हैं जहां वे आपकी साइट के लिए अपना पासवर्ड बदल सकते हैं. इस सुविधा में अब Safari, Chrome में लागू किया गया है और अन्य ब्राउज़र पर भी उपलब्ध कराया जा रहा है. पासवर्ड बदलने में उपयोगकर्ताओं की मदद करना में एक लोकप्रिय URL जोड़कर आसानी से पासवर्ड बदलें इसे लागू करें.

अगर उपयोगकर्ता ऐसा चाहते हैं, तो आपको उनके लिए अपना खाता मिटाने की प्रक्रिया को आसान भी बनाना चाहिए.

तीसरे पक्ष के आइडेंटिटी प्रोवाइडर की मदद से, लॉगिन करने की सुविधा दें

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

WordPress का लॉगिन पेज
WordPress का लॉगिन पेज, जिसमें Google और Apple के लॉगिन के विकल्प हैं.

इस तरीके के कई फ़ायदे हैं. फ़ेडरेटेड लॉगिन का इस्तेमाल करके खाता बनाने वाले उपयोगकर्ताओं के लिए, उन्हें पासवर्ड मांगने, उनसे संपर्क करने या उन्हें सेव करने की ज़रूरत नहीं होती.

फ़ेडरेटेड लॉगिन से, पुष्टि की गई प्रोफ़ाइल की अतिरिक्त जानकारी भी ऐक्सेस की जा सकती है, जैसे डालें—इसका मतलब है कि उपयोगकर्ता को वह डेटा डालने की ज़रूरत नहीं है और आपको ऐसा करने की ज़रूरत नहीं है पहचान की पुष्टि खुद करें. फ़ेडरेटेड लॉगिन की सहायता से, उपयोगकर्ता उस समय बहुत आसानी से नया डिवाइस.

अपने वेब ऐप्लिकेशन में 'Google साइन इन' को इंटिग्रेट करना में, साइन अप करने के विकल्पों में फ़ेडरेटेड लॉगिन को जोड़ने का तरीका बताया गया है. कई अन्य आइडेंटिटी प्लैटफ़ॉर्म उपलब्ध हैं.

खाता स्विच करने की प्रक्रिया को आसान बनाएं

कई उपयोगकर्ता एक ही ब्राउज़र का इस्तेमाल करके, डिवाइस शेयर करते हैं और खातों के बीच स्वैप करते हैं. उपयोगकर्ता ऐक्सेस करते हैं या नहीं फ़ेडरेटेड लॉगिन हो या न हो, तो आपको खाता स्विच करने की प्रक्रिया को आसान बनाना चाहिए.

Gmail, खाता स्विच करने की सुविधा का इस्तेमाल दिखा रहा है
Gmail पर खाता स्विच करना.

बहु-स्तरीय पुष्टि (MFA) की सुविधा दें

बहु-स्तरीय पुष्टि (MFA) की सुविधा का मतलब यह पक्का करना है कि उपयोगकर्ता एक से ज़्यादा तरीकों से पुष्टि कर रहे हों. उदाहरण के लिए, उपयोगकर्ता से पासवर्ड सेट करने के लिए कहने के साथ, आप पुष्टि को भी लागू कर सकते हैं ईमेल या एसएमएस के ज़रिए भेजे जाने वाले एक बार इस्तेमाल होने वाले पासकोड का इस्तेमाल करके या ऐप्लिकेशन पर आधारित एक बार इस्तेमाल होने वाले पासवर्ड का इस्तेमाल करके कोड, सुरक्षा कुंजी या फ़िंगरप्रिंट सेंसर भी हो सकता है. एसएमएस ओटीपी इस्तेमाल करने के सबसे सही तरीके और WebAuthn की मदद से मज़बूत पुष्टि करने की सुविधा चालू करना बहु-स्तरीय पुष्टि (MFA) की सुविधा को लागू करने का तरीका बताया गया है.

अगर आपकी साइट निजी या संवेदनशील जानकारी.

उपयोगकर्ता नामों का ध्यान रखें

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

अगर आपकी साइट पर उपयोगकर्ता नामों का इस्तेमाल करना ज़रूरी है, तो उन पर ग़ैर-ज़रूरी नियम लागू न करें. साथ ही, उपयोगकर्ताओं को न रोकें उपयोगकर्ता नाम अपडेट न करें. आपको अपने बैकएंड पर, हर उपयोगकर्ता खाते के लिए एक यूनीक आईडी जनरेट करना होगा, उपयोगकर्ता नाम जैसे निजी डेटा के आधार पर आइडेंटिफ़ायर न हो.

साथ ही, उपयोगकर्ता नाम के लिए autocomplete="username" का इस्तेमाल करना न भूलें.

अलग-अलग तरह के डिवाइसों, प्लैटफ़ॉर्म, ब्राउज़र, और वर्शन पर टेस्ट करें

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

आंकड़े लागू करना और उपयोगकर्ताओं पर असल में निगरानी की सुविधा चालू करना

आपको फ़ील्ड डेटा के साथ-साथ लैब डेटा भी चाहिए का इस्तेमाल करें. Analytics और उपयोगकर्ता को रीयल टाइम में मॉनिटर करने की सुविधा (RUM) आपके उपयोगकर्ताओं के असल अनुभव का डेटा देती है, जैसे कि साइन-अप पेज में कितना समय लगता है लोड होता है, उपयोगकर्ता कौन से यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट के साथ इंटरैक्ट करते हैं (या नहीं करते हैं) और इसे पूरा करने में उपयोगकर्ताओं को कितना समय लगता है साइन-अप करें.

छोटे-छोटे बदलावों से, साइन-अप फ़ॉर्म को पूरा होने की दर पर काफ़ी असर पड़ सकता है. Analytics और RUM आपको बदलावों को ऑप्टिमाइज़ करने और प्राथमिकता देने में मदद मिलती है. साथ ही, आपकी साइट पर ऐसी समस्याओं के लिए नज़र रखी जा सकती है जो जांच के दौरान खतरा हुआ.

सीखते रहें

Unस्प्लैश पर @ecowarriorprincess ने फ़ोटो अपलोड की.