फोटोशॉप में फॉन्ट (एंटी) अलियासिंग


20

मैं फ़ोटोशॉप डिज़ाइनिंग वेबसाइटों के लिए फ़ोटोशॉप का उपयोग कर रहा हूं और जब भी मैं लाइव ब्राउज़र पूर्वावलोकन के साथ फ़ोटोशॉप डिज़ाइन की तुलना करता हूं, तो फोंट को अलग तरीके से प्रस्तुत किया जाता है।

एरियल

मूल रूप से किसी भी एंटी-एलियासिंग विधि को मैं फ़ोटोशॉप में चुनता हूं, पाठ हमेशा बोल्ड टेक्स्ट की छाप देता है । इसलिए मुझे हमेशा एंटीअलियासिंग (सामान्य 12px / 14px पाठ के लिए) बंद करने के लिए मजबूर किया जाता है।

क्या कोई विधि है जो मैं फ़ोटोशॉप में उसी तरह के फॉन्ट रेंडरिंग को प्राप्त कर सकता हूं जैसे कि विंडोज़ जो क्लियरटाइप के साथ उपयोग करता है?

यदि नहीं, तो क्या कोई फोंट है जो एरियल से बेहतर है जब एंटी-एलियासिंग बंद है?


5
मैंने आधिकारिक फ़ोटोशॉप फीडबैक साइट, फीडबैक. photoshop.com/photoshop_family/topics/… रिज़ॉर्ट वोट पर यह मुद्दा पूछा है !

जवाबों:


18

दो कारण हैं ClearType पाठ इतना कुरकुरा है।

  1. यह सबपिक्सल रेंडरिंग का उपयोग करता है । मुझे नहीं लगता कि फ़ोटोशॉप इसका समर्थन करता है।
  2. यह पिक्सेल ग्रिड में लाइनों को फिट करने के लिए आक्रामक संकेत का उपयोग करता है

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

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

क्या आपको वास्तव में Photoshop में ClearType- स्टाइल रेंडरिंग की आवश्यकता है? यदि आप अपने वेब डिज़ाइन में उपयोग के लिए पाठ वाले किसी भी ग्राफिक्स का निर्यात करते हैं, तो उन्हें सबपिक्सल रेंडरिंग नहीं करनी चाहिए क्योंकि यह कुछ डिस्प्ले (CRT, घुमाया हुआ फोन) के लिए उपयुक्त नहीं है। और अगर आप पाठ का निर्यात नहीं कर रहे हैं, लेकिन सिर्फ इसे देख रहे हैं, तो फ़ोटोशॉप का प्रतिपादन ठीक लगता है।


सीआरटी आबादी है जिस तरह से उनकी देखभाल के लिए बहुत कम .....
Pacerier

13

फोटोशॉप एक वेब डिजाइनिंग प्रोग्राम नहीं है। ब्राउज़र में एक जैसा दिखने वाला टेक्स्ट प्राप्त करने के लिए ग्राफिक (jpg, gif आदि) में आपको दोनों प्रोग्राम्स में एक ही फॉन्ट का उपयोग करना होगा। कुछ फोंट सभी ब्राउज़रों द्वारा उपयोग नहीं किए जाते हैं।

आपके पाठ के आकार के आधार पर, एक अच्छा मध्य आकार का फ़ॉन्ट ताहोमा, हेल्वेटिका, ट्रेबुचेट या जॉर्जिया हो सकता है। कुछ अच्छे विचारों के लिए इस वेबसाइट को देखें : http://www.snaphow.com/10-most-popular-web-fonts-used-in-web-safe-design/

बड़े-बड़े फॉन्ट ऐसे हैं, जहां एंटी-अलियासिंग की बात होने लगती है।

यदि आप किसी पृष्ठ पर पाठ के साथ विलय करने के लिए पाठ प्राप्त करने का प्रयास कर रहे हैं, तो मैं सुझाव देता हूं कि अपने लक्ष्यों को प्राप्त करने के लिए सीएसएस स्थिति का उपयोग करें। CSS आपको अपने वेबपेज को छवियों के ओवरटॉप से ​​पाठ डालने की अनुमति देता है, और पृष्ठ को रेंडर करने के लिए सापेक्ष और निरपेक्ष स्थिति का उपयोग करता है। यहाँ एक उदाहरण और ट्यूटोरियल है: http://css-tricks.com/text-blocks-over-image/


1
"फोटोशॉप एक वेब डिजाइनिंग प्रोग्राम नहीं है।" वास्तव में????
फर्रे

3
@ फर: सच। यह एक रेखापुंज ग्राफिक्स संपादक है। सिर्फ इसलिए कि आप इसके साथ वेब डिज़ाइन भी कर सकते हैं इसका मतलब यह नहीं है कि यह मूल रूप से इसके लिए डिज़ाइन किया गया था। आप राजमार्ग पर भी ट्रैक्टर चला सकते हैं, लेकिन यह कार नहीं बनाती है।
इल्मरी करोनें

@IlmariKaronen फ़ोटोशॉप वेबसाइट डिजाइन करने के लिए एक अच्छा उपकरण है, इसका उपयोग वेबसाइट बनाने के लिए नहीं किया जाता है । मेरे पास कोई भी वेब डिज़ाइन नहीं है जिसमें रैस्टर ग्राफिक्स का संपादन शामिल नहीं था ...
16

2
Thats सबसे दुर्भाग्यपूर्ण राय मैं हाल ही में पढ़ा है में से एक है। यदि फोटोहॉप का उद्देश्य वेबसाइटों (साथ ही कई अन्य चीजों) को डिजाइन करना नहीं है, तो आप उन्हें डिजाइन करने के लिए क्या उपयोग करते हैं? आपको कुछ गंभीर वेब डिज़ाइन ब्लॉग और साइटों पर नज़र डालनी चाहिए, हर कोई अपनी वेबसाइटों को डिज़ाइन करने के लिए फ़ोटोशॉप का उपयोग करता है।
जोस टॉमस टोचीनो

@ TheOm3ga - वास्तव में, यह वास्तव में सच नहीं है। कुछ अपने बेहतर वर्कफ़्लो के लिए पटाखे पसंद करते हैं (हालांकि परिवार कल्याण का पाठ प्रतिपादन भयानक है ), अन्य लोग HTML प्रोटोटाइप पर जोर देते हैं। लेकिन फोटोशॉप सार्वभौमिक विकल्प नहीं है।
बजे जिमी ब्रेक-मैके

6

दुर्भाग्य से फ़ोटोशॉप किसी भी तरह के सबपिक्सल रेंडरिंग का समर्थन नहीं करता है। और न ही कोई अन्य एडोब सॉफ्टवेयर- ड्रीमविवर के अपवाद के साथ । (वैसे यह ड्रीमविवर की तकनीक नहीं है, क्योंकि यह सिर्फ HTML को प्रस्तुत करता है और फिर ऑपरेटिंग होने के लिए पाठ को पारित करता है।)

सुझाए गए वर्कफ़्लो हो सकता है कि आप फ़ोटोशॉप में अपना डिज़ाइन बनाएं और स्लाइस करें और फिर इसे ड्रीमविवर में खोलें। यदि डिज़ाइन को और सुधार की आवश्यकता है, तो आप फ़ोटोशॉप में एक साथ खोली गई फ़ाइल को बदल सकते हैं, ड्रीमविवर में दृश्य को बदल सकते हैं, सहेज सकते हैं और ताज़ा कर सकते हैं। ड्रीमविवर में अंतिम, वास्तविक प्रतिलिपि जोड़ें। आप फ़ोटोशॉप को पटाखों से भी बदल सकते हैं; या यहां तक ​​कि पटाखे में वायरफ्रेमिंग शुरू करें → फ़ोटोशॉप में जारी रखें → ड्रीमविवर के माध्यम से प्रकाशित करें। (यह स्पष्ट है कि क्रिएटिव सूट संस्करण आमतौर पर बंडलों में क्यों खरीदा जाता है, है ना?)

यदि ब्राउजर (एस) की तुलना में ड्रीमविवर के पूर्वावलोकन में डिजाइन अलग दिखता है, तो यह एक और, दुर्भाग्यपूर्ण, मामला है (और मैं केवल टाइपोग्राफी के बारे में बात नहीं कर रहा हूं, लेकिन पूरे के रूप में प्रतिपादन)। जितनी जल्दी आप फ़ोटोशॉप से ​​लाइव डेमो तक बढ़ा सकते हैं - यह ड्रीमविवर के माध्यम से हो या बेहतर नहीं हो। मैं चाहता हूँ कि फ़ोटोशॉप में सबपिक्सल रेंडरिंग शक्तियां होंगी (लेकिन साथ ही उम्मीद है कि इसे CS6 में पेश नहीं किया जाएगा, या कम से कम उम्मीद है कि मैं तब तक समृद्ध हो जाऊंगा)!

बस एक साइड नोट: ClearType 10 या इतने पेटेंट के साथ सुरक्षित है, इसलिए वास्तव में एक ही प्रतिपादन संभावित नहीं है। यह भी ध्यान देने योग्य है कि ओएस एक्स डिफ़ॉल्ट रूप से अलग-अलग रेंडरिंग (क्वार्ट्ज) का उपयोग करता है और इसलिए लिनक्स वितरण में ग्राफिकल इंटरफेस करते हैं।


5

HTML और CSS में डिज़ाइन। यदि आप इसे फ़ोटोशॉप मॉक-अप में वापस लाना चाहते हैं, तो स्क्रीन ने इसे ब्राउज़र से बाहर निकाल दिया, फिर इसे अपने फ़ोटोशॉप दस्तावेज़ में वापस लाएं।

फोटोशॉप में सेटिंग प्रकार एक दर्द है, सामान्य रूप से।


5

एक संभावित कार्य-आस-पास "तेज" एंटी-अलियासिंग विधि का उपयोग करने और पाठ छेद पर 0-गहराई वाली आंतरिक चमक सेट करने के लिए हो सकता है:

यहां छवि विवरण दर्ज करें

इस नमूने के लिए मैंने सफेद रंग, 85% अपारदर्शिता, "स्क्रीन" मिश्रण मोड, 0 चोक, 0 आकार का उपयोग किया। सुश्री स्पष्ट-प्रकार के रूप में अच्छी नहीं है, लेकिन यह कम बोल्ड दिखती है ...

(पहली पंक्ति = कोई एंटी-एलियासिंग, अंतिम पंक्ति = आंतरिक चमक के बिना तेज एंटी-अलियासिंग)


बहुत दिलचस्प दृष्टिकोण! पाठ को संपादन योग्य भी रखता है।
kontur

@onetrickpony, दूसरी पंक्ति के लिए स्टाइल क्या है?
पेसरियर
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.