सामग्री पर जाएं
Mera News

प्रकाशक गाइड, अध्याय 3

पॉप-अप और सहमति

पिछली समीक्षा नवंबर 2026

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

Google क्या चाहता है

Google घुसपैठी इंटरस्टिशियल को ऐसे पेज एलिमेंट बताता है जो पाठक की कंटेंट तक नज़र रोकते हैं, और चेतावनी देता है कि इनसे सर्च में प्रदर्शन ख़राब हो सकता है। उसका मार्गदर्शन स्पष्ट है:

  • पूरे पेज को न ढकें।
  • पाठक को सहमति या इनपुट के लिए किसी अलग पेज पर न भेजें। अगर हर URL एक ही सहमति पेज पर रीडायरेक्ट होता है, तो उस पेज को छोड़कर बाक़ी सब सर्च नतीजों से बाहर हो सकते हैं।
  • पूरे पेज के इंटरस्टिशियल की जगह ऐसे बैनर इस्तेमाल करें जो स्क्रीन का एक छोटा हिस्सा घेरें।
  • हर तरह के प्रचार वाले डायलॉग पर यही सावधानी बरतें, जिनमें न्यूज़लेटर प्रॉम्प्ट और ऐप इंस्टॉल प्रॉम्प्ट भी शामिल हैं।

ऐप इंस्टॉल के लिए Google ब्राउज़र में समर्थित विकल्पों की ओर इशारा करता है, जैसे Safari में Smart App Banners, या सही स्टोर से जोड़ने वाला सादा HTML बैनर।

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

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

सहमति पर यूरोपीय नियामकों ने क्या कहा है

European Data Protection Board (EDPB) ने सहमति पर दिशानिर्देश और अपनी कुकी बैनर टास्कफ़ोर्स की एक रिपोर्ट प्रकाशित की है। टास्कफ़ोर्स की रिपोर्ट शिकायतें निपटाने के लिए तय एक न्यूनतम सीमा दर्ज करती है, और राष्ट्रीय नियम अब भी लागू हैं, इसलिए इन बिंदुओं को आधार रेखा मानें।

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

ऐसा प्रॉम्प्ट बनाएं जिसे सब इस्तेमाल कर सकें

ऐसा बैनर जो पेज को न रोके

एक छोटा बैनर पाठक को आगे बढ़ने देता है, जो Google को पसंद है। उसे अब भी WCAG 2.2 पर खरा उतरना होगा। सफलता मानदंड 2.4.11, Focus Not Obscured (Minimum), तब विफल हो जाता है जब कोई स्टिकी बैनर कीबोर्ड फ़ोकस वाले आइटम को पूरी तरह छिपा दे। बैनर की ऊंचाई के बराबर स्क्रॉल पैडिंग जोड़ें:

html {
  scroll-padding-bottom: 96px; /* the banner's height */
}

बैनर को ओवरले करें, या उसकी जगह आरक्षित करें, ताकि वह लेख को नीचे न धकेले और लेआउट शिफ़्ट न बढ़ाए।

मोडल डायलॉग

अगर प्रॉम्प्ट को पाठक को रोकना ही है, तो उसे W3C पैटर्न के अनुसार असली मोडल डायलॉग के रूप में बनाएं।

<div role="dialog" aria-modal="true"
     aria-labelledby="consent-title" aria-describedby="consent-text">
  <h2 id="consent-title">Your privacy choices</h2>
  <p id="consent-text">Choose whether this site may use cookies for advertising.</p>
  <button type="button">Reject all</button>
  <button type="button">Accept all</button>
  <button type="button">Choose settings</button>
</div>
  • डायलॉग खुलने पर फ़ोकस को उसके अंदर ले जाएं।
  • Tab और Shift + Tab डायलॉग के भीतर के कंट्रोल में घूमते हैं और हर सिरे पर लौट आते हैं।
  • Escape डायलॉग बंद करता है। इसे कोई विकल्प न चुनना मानें, स्वीकार करना कभी नहीं।
  • बंद होने पर फ़ोकस उस एलिमेंट पर लौटाएं जिसने उसे खोला था। अगर डायलॉग पेज लोड पर खुला था, तो फ़ोकस को कंटेंट की शुरुआत पर ले जाएं।

मोबाइल पर

  • बैनर को स्क्रीन के नीचे टिकाएं, और हेडलाइन को उसके ऊपर दिखती रखें।
  • बटनों को पूरी चौड़ाई में ऊपर-नीचे रखें ताकि हर एक पर टैप करना आसान हो, स्वीकार और अस्वीकार समान आकार के हों।
  • टेक्स्ट छोटा रखें और ब्योरा दूसरी परत में ले जाएं।
  • लेआउट को 320 CSS पिक्सेल चौड़ाई पर और टेक्स्ट 200% तक बड़ा करके जांचें। बटन बगल में स्क्रॉल किए बिना पहुंच में रहने चाहिए।

डेस्कटॉप पर

  • नीचे की पट्टी या कोने का पैनल इस्तेमाल करें, और लेख को खुला छोड़ें।
  • हर कंट्रोल को कीबोर्ड से काम करने लायक़ बनाएं, दिखने वाले फ़ोकस इंडिकेटर के साथ।
  • टेक्स्ट का कंट्रास्ट अनुपात कम से कम 4.5:1 रखें, या बड़े टेक्स्ट के लिए 3:1।

चेकलिस्ट

  • अपना होमपेज और एक लेख नए ब्राउज़र प्रोफ़ाइल के साथ फ़ोन और डेस्कटॉप पर लोड करें। गिनें कि कंटेंट के ऊपर क्या-क्या दिखता है।
  • हर वह पूरे पेज का ओवरले हटाएं जो कानून के तहत ज़रूरी नहीं है।
  • किसी अलग सहमति पेज पर जाने वाला हर रीडायरेक्ट हटाएं।
  • पक्का करें कि सहमति चाहने वाला कोई टैग पाठक के सहमत होने से पहले न चले।
  • जहां स्वीकार का विकल्प है, वहां इनकार का विकल्प भी रखें, बराबर वज़न के बटन के रूप में।
  • पहले से टिक किए बॉक्स और स्क्रॉल को सहमति गिनने वाला हर लॉजिक हटाएं।
  • हर पेज पर गोपनीयता विकल्प बदलने के लिए एक स्थायी लिंक या आइकन जोड़ें।
  • बिना माउस के बैनर में Tab से घूमें, और पक्का करें कि फ़ोकस दिखता रहे और उसके पीछे कभी गायब न हो।
  • मोडल को स्क्रीन रीडर के साथ टेस्ट करें, Escape और फ़ोकस की वापसी समेत।
  • कस्टम ऐप इंस्टॉल पॉप-अप की जगह एक छोटा बैनर लगाएं।

स्रोत