ऑटोमैटिक भरना

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

जानकारी ऑटोमैटिक भरने की सुविधा कैसे काम करती है?

ऑटोमैटिक भरने की सुविधा के बारे में शुरुआती जानकारी में, आपने इनके बारे में बुनियादी बातें पहले ही जान ली हैं ऑटोमैटिक भरना. हालांकि, ब्राउज़र में जानकारी ऑटोमैटिक भरने की सुविधा क्यों दी जाती है?

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

ब्राउज़र को कैसे पता चलता है कि किस डेटा को ऑटोमैटिक भरना है? उदाहरण के तौर पर दिए गए फ़ॉर्म पर नज़र डालें फ़ील्ड में खोजें.

<label for="name">Name</label>
<input name="name" id="name">

अगर इस फ़ॉर्म फ़ील्ड को सबमिट किया जाता है, तो ब्राउज़र इस वैल्यू (वह डेटा जो आपने डाला है) को स्टोर करते हैं और name एट्रिब्यूट (नाम) की वैल्यू. कुछ ब्राउज़र अलग-अलग प्लैटफ़ॉर्म पर डेटा सेव करते और भरते समय id एट्रिब्यूट का इस्तेमाल किया जा सकता है.

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

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

सही विकल्प का इस्तेमाल करके, ब्राउज़र को जानकारी ऑटोमैटिक भरने की सुविधा के सबसे अच्छे विकल्प ऑफ़र करने में मदद की जा सकती है autocomplete एट्रिब्यूट के लिए वैल्यू. autocomplete के लिए कई वैल्यू हो सकती हैं. यहां पतों का एक उदाहरण दिया गया है.

क्या आपके ब्राउज़र में पहले से ही आपका पता सेव है? बढ़िया! आपके बाद पता फ़ॉर्म में पहली फ़ील्ड के साथ इंटरैक्ट करते हैं, तो ब्राउज़र आपको एक सूची दिखाता है सेव किए गए पते में से. कोई एक विकल्प चुनें और ब्राउज़र सभी फ़ील्ड भर देगा पते से संबंधित होता है. ऑटोमैटिक भरने की सुविधा की मदद से, फ़ॉर्म जल्दी और आसानी से भरे जा सकते हैं.

हर पते के फ़ॉर्म में एक जैसे फ़ील्ड नहीं होते और फ़ील्ड का क्रम भी अलग-अलग होता है. autocomplete के लिए सही वैल्यू का इस्तेमाल करने पर, यह पक्का होता है कि ब्राउज़र अपने-आप जानकारी भर गया है फ़ॉर्म के लिए सही मान. यहां country, postal-code, और कई वगैरह.

पक्का करें कि उपयोगकर्ता तेज़ी से साइन इन कर सकें और सुरक्षित पासवर्ड इस्तेमाल कर सकें

कई लोगों को पासवर्ड याद रखने में परेशानी होती है. सबसे आम पासवर्ड है '123456' के बाद, याद रखने में आसान दूसरे कॉम्बिनेशन आते हैं. जानें कि क्या वे सुरक्षित और यूनीक पासवर्ड हैं?

जनरेट करने, सेव करने, और अपने-आप भरने की सुविधा देने के लिए, ब्राउज़र में पासवर्ड मैनेजर पहले से मौजूद होते हैं आपके लिए पासवर्ड हैं. जानें कि ईमेल अपने-आप भरने की सुविधा से, ब्राउज़र की मदद कैसे की जा सकती है और पासवर्ड मैनेज करना.

किसी ईमेल फ़ील्ड के लिए autocomplete="email" का इस्तेमाल किया जा सकता है, ताकि उपयोगकर्ताओं को जानकारी अपने-आप भरने की सुविधा मिले एक ईमेल पते का विकल्प होता है.

यह एक साइन-अप फ़ॉर्म है. इसलिए, लोगों को इसे भरने का विकल्प नहीं मिलना चाहिए इस्तेमाल किया गया पासवर्ड. autocomplete="new-password" का इस्तेमाल करके यह पक्का किया जा सकता है कि सभी ब्राउज़र आपको नया पासवर्ड जनरेट करने का विकल्प देना चाहिए.

साइन-इन फ़ॉर्म पर, autocomplete="current-password" का इस्तेमाल करके ब्राउज़र में, पहले सेव किए गए पासवर्ड भरने का विकल्प देने के लिए वेबसाइट.

आपके पास कई वेबसाइटों पर दो तरीकों से पुष्टि करने की सुविधा को सेट अप करने का विकल्प होता है. इसके अलावा पासवर्ड के साथ, एक बार इस्तेमाल होने वाला कोड एसएमएस या दो तरीकों से पुष्टि करने वाले ऐप्लिकेशन के साथ भेजा जाता है.

क्या यह बढ़िया नहीं होगा कि आपको मैसेज (एसएमएस) में मिला कोड सुझाया गया हो का विकल्प भी चुना जा सकता है. मान? Safari 14 या उसके बाद के वर्शन पर, autocomplete="one-time-code" लक्ष्य हासिल किया है. Android डिवाइस पर, Chrome पर WebOTP का इस्तेमाल किया जा सकता है एपीआई JavaScript के साथ ऐसा नहीं करते.

एसएमएस ओटीपी फ़ॉर्म की मदद से, वेब पर फ़ोन नंबर की पुष्टि करने के तरीके के बारे में ज़्यादा जानें सबसे सही तरीके के बारे में जानें.

उपयोगकर्ताओं को क्रेडिट कार्ड की जानकारी भरने में मदद करें

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

autocomplete एट्रिब्यूट का इस्तेमाल फिर से किया जा सकता है, ताकि यह पक्का किया जा सके कि ब्राउज़र सही ऑटोमैटिक भरने के विकल्प.

क्रेडिट कार्ड नंबर cc-number और क्रेडिट कार्ड की समयसीमा खत्म होने के लिए कुछ वैल्यू दी गई हैं तारीख cc-exp और अन्य सभी जानकारी ज़रूरी है क्रेडिट कार्ड से पेमेंट करने के लिए.

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

पेमेंट को फिर से सबमिट करने से बचने में उपयोगकर्ताओं की मदद करने के बारे में ज़्यादा जानें डेटा.

पक्का करें कि आपके सभी फ़ील्ड में जानकारी ऑटोमैटिक भरने की सुविधा काम कर रही हो

पतों, खाते की जानकारी, और क्रेडिट कार्ड की जानकारी के अलावा, ऐसे कई फ़ील्ड मौजूद हैं जहां ब्राउज़र, जानकारी ऑटोमैटिक भरने की सुविधा में उपयोगकर्ताओं की मदद कर सकते हैं.

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

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

ब्राउज़र को यह समझने में मदद करें कि किसी फ़ील्ड में मौजूद जानकारी अपने-आप नहीं भरी जानी चाहिए

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

<label for="one-time-code">One-time code</label>
<input autocomplete="off" type="text" name="one-time-code" id="one-time-code">

एक बार में यूनीक वैल्यू डालते समय, जानकारी ऑटोमैटिक भरने की सुविधा काम की नहीं होती जैसे कि एक बार इस्तेमाल होने वाले कोड फ़ील्ड. यह वैल्यू हर बार अलग होती है और ब्राउज़र को वैल्यू सेव नहीं करनी चाहिए या ऑटोमैटिक भरने का विकल्प नहीं देना चाहिए. Google Analytics 4 पर माइग्रेट करने के लिए, ऑटोमैटिक भरने की सुविधा को रोकने के लिए, ऐसे फ़ील्ड के लिए autocomplete="off".

autocomplete="off" के लिए एक और इस्तेमाल का उदाहरण हनीपॉट फ़ील्ड है (पिछला मॉड्यूल). भले ही फ़ील्ड दिखाई देता है, तो ब्राउज़र इसे शेष फ़ील्ड के साथ ऑटोमैटिक रूप से भर सकते हैं. जानकारी ऑटोमैटिक भरने की सुविधा चालू की जा रही है बंद है, ताकि यह पक्का किया जा सके कि उपयोगकर्ता की पहचान बॉट के तौर पर नहीं हो रही है. ऐसा इसलिए है, क्योंकि अपने-आप पूरा हो जाएगा.

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

देखें कि आपको कितना समझ आया है

जानकारी ऑटोमैटिक भरने की सुविधा के बारे में सही जानकारी पाएं

संसाधन

• अपने-आप पूरा होना एट्रिब्यूट के बारे में ज़्यादा जानें.
  • पेमेंट और पते का फ़ॉर्म सबसे सही तरीके