सीएसएस के साथ प्रिंटिंग से एक वेब पेज को कैसे ब्लॉक करें

वेब पेज एक स्क्रीन पर देखने के लिए हैं । हालांकि कई प्रकार के संभावित डिवाइस हैं जिनका उपयोग साइट (डेस्कटॉप, लैपटॉप, टैबलेट, फोन, पहनने योग्य, टीवी इत्यादि) देखने के लिए किया जा सकता है, उनमें सभी में किसी प्रकार की स्क्रीन शामिल है। कोई अन्य तरीका है कि कोई आपकी वेबसाइट देख सकता है, एक तरीका जिसमें स्क्रीन शामिल नहीं है। हम आपके वेब पृष्ठों से भौतिक प्रिंट का जिक्र कर रहे हैं।

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

सीएसएस के साथ प्रिंटिंग से एक वेब पेज को कैसे ब्लॉक करें

लोगों को अपने वेब पृष्ठों को प्रिंट करने से रोकने के लिए सीएसएस का उपयोग करना आसान है। आपको बस "print.css" नामक 1 लाइन स्टाइलशीट बनाने की आवश्यकता है जिसमें सीएसएस की निम्न पंक्ति शामिल है।

शरीर {प्रदर्शन: कोई नहीं; }

यह एक शैली आपके पृष्ठों के "बॉडी" तत्व को प्रदर्शित नहीं होने के लिए बदल देगी - और चूंकि आपके पृष्ठों पर सब कुछ शरीर तत्व का एक बच्चा है, इसका मतलब है कि पूरा पृष्ठ / साइट प्रदर्शित नहीं होगी।

एक बार जब आप अपनी "print.css" स्टाइलशीट प्राप्त कर लेंगे, तो आप इसे अपने HTML में प्रिंट स्टाइलशीट के रूप में लोड करेंगे। यहां बताया गया है कि आप यह कैसे करेंगे - बस अपने HTML पृष्ठों में "हेड" तत्व में निम्न पंक्ति जोड़ें।

<लिंक rel = "स्टाइलशीट" प्रकार = "टेक्स्ट / सीएसएस" href = "print.css" मीडिया = "प्रिंट" />

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

एक समय में एक पेज ब्लॉक करें

यदि आपको अपनी साइट पर बहुत से पृष्ठों को अवरुद्ध करने की आवश्यकता नहीं है, तो आप अपने एचटीएमएल के सिर में चिपकाए गए निम्नलिखित शैलियों के साथ पृष्ठ-दर-पृष्ठ आधार पर प्रिंटिंग को अवरुद्ध कर सकते हैं।

<शैली प्रकार = "पाठ / सीएसएस"> @media प्रिंट {body {display: none}}

इस इन-पेज शैली में आपकी बाहरी स्टाइल शीट के अंदर किसी भी शैलियों की तुलना में अधिक विशिष्टता होगी, जिसका अर्थ है कि पृष्ठ बिल्कुल प्रिंट नहीं होगा, जबकि इस लाइन के बिना अन्य पृष्ठ सामान्य रूप से प्रिंट करेंगे।

अपने अवरुद्ध पृष्ठों के साथ फैनसीर प्राप्त करें

क्या होगा यदि आप प्रिंटिंग को अवरुद्ध करना चाहते हैं, लेकिन नहीं चाहते कि आपके ग्राहक निराश हो जाएं? यदि वे एक खाली पृष्ठ प्रिंटिंग देखते हैं, तो वे परेशान हो सकते हैं और सोच सकते हैं कि उनका प्रिंटर या कंप्यूटर टूटा हुआ है और यह नहीं पता कि आपने अनिवार्य रूप से अक्षम मुद्रण किया है!

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

और पृष्ठ के बहुत नीचे, आपकी सभी सामग्री लिखे जाने के बाद उस टैग को बंद करें:

फिर, "noprint" div को बंद करने के बाद, दस्तावेज़ मुद्रित होने पर उस संदेश के साथ एक और div खोलें जिसे आप प्रदर्शित करना चाहते हैं:

यह पृष्ठ ऑनलाइन देखा जाना है और मुद्रित नहीं किया जा सकता है। कृपया इस पृष्ठ को http://webdesign.about.com/od/advancedcss/qt/block_print.htm पर देखें

Print.css नामक अपने प्रिंट सीएसएस दस्तावेज़ का एक लिंक शामिल करें:

<लिंक rel = "स्टाइलशीट" प्रकार = "टेक्स्ट / सीएसएस" href = "print.css" मीडिया = "प्रिंट" />

और उस दस्तावेज़ में निम्नलिखित शैलियों को शामिल किया गया है:

#noprint {प्रदर्शन: कोई नहीं; } # प्रिंट {प्रदर्शन: ब्लॉक; }

अंत में, अपने मानक स्टाइलशीट में (या अपने दस्तावेज़ के सिर में एक आंतरिक शैली में), लिखें:

# प्रिंट {प्रदर्शन: कोई नहीं; } #noprint {प्रदर्शन: ब्लॉक; }

इससे यह सुनिश्चित होगा कि प्रिंट संदेश केवल मुद्रित पृष्ठ पर दिखाई देता है, जबकि वेब पेज केवल ऑनलाइन पृष्ठ पर दिखाई देता है।

उपयोगकर्ता अनुभव पर विचार करें

प्रिंटिंग वेब पेज आमतौर पर एक खराब अनुभव है क्योंकि आज की साइटें अक्सर मुद्रित पृष्ठ पर अच्छी तरह से अनुवाद नहीं करती हैं। यदि आप प्रिंट शैलियों को निर्देशित करने के लिए पूरी तरह से अलग स्टाइल शीट बनाना नहीं चाहते हैं, तो आप इस आलेख के चरणों का उपयोग किसी पृष्ठ पर प्रिंटिंग "बंद" करने के लिए कर सकते हैं। प्रिंटिंग वेबसाइटों पर भरोसा करने वाले उपयोगकर्ताओं पर होने वाले प्रभाव से अवगत रहें (शायद क्योंकि उनके पास खराब दृष्टि और ऑन-स्क्रीन टेक्स्ट पढ़ने का संघर्ष है) और निर्णय लें जो आपकी साइट के दर्शकों के लिए काम करेगा।

जेनिफर क्रिनिन द्वारा मूल लेख। जेरेमी गिरार्ड द्वारा संपादित।