इलस्ट्रेटर SVG फ़ाइल में फ़ॉन्ट प्रकार का संरक्षण

Question

नमस्ते, मैं इलस्ट्रेटर के लिए नया हूं और एक ऐसी छवि बनाई है जो "स्किया-रेगुलर" फ़ॉन्ट का उपयोग करती है। लेकिन जब मैं उस छवि को .svg प्रारूप में सहेजता हूं , तो वह फ़ॉन्ट प्रकार बदल देती है। और जब मैं ब्राउज़र में .svg प्रारूप फ़ाइल खोलता हूं तो फ़ॉन्ट पूरी तरह से अलग होता है। क्या कोई मुझे बता सकता है कि मैं क्या गलत कर रहा हूं। मैंने नोटपैड ++ में .svg फ़ाइल को भी खोला है और यह फ़ॉन्ट-परिवार = "'स्किया-रेगुलर' के साथ-साथ बू को भी कहता है कि फॉन्ट स्किआ रेग्युलर नहीं है। किसी भी मदद की सराहना की जाएगी।"

संदर्भ के लिए छवि भी संलग्न है

Answer 1

यदि आप यह सुनिश्चित करना चाहते हैं कि पाठ में हर मामले में एक ही उपस्थिति होगी -

सबसे पहले, आप svg के रूप में सहेजने से पहले पाठ का विस्तार कर सकते हैं

दूसरे, सहेजे जाने वाले संवाद के फ़ॉन्ट भाग में आप "रूपांतरित रूपरेखा" दबा सकते हैं

Comments

दूसरा भाग स्पष्ट है। क्या आप पहले भाग की व्याख्या कर सकते हैं, मैं पाठ का "विस्तार" कैसे करूँ?

— रिजवान ६०६

@ Rizwan606 आप एक चयन उपकरण और प्रेस मेनू ऑब्जेक्ट के साथ पाठ का चयन करें और वहां आप विस्तार (यह पाठ को आकृतियों में बदल देगा) को दबाते हैं, वैकल्पिक रूप से आप पाठ का चयन करते हैं और फिर राइट क्लिक करें और बनाएँ आउटलाइन

— Ilan

इस उत्तर को स्पष्ट करने के लिए, आपको दोनों करने की आवश्यकता नहीं है। या तो विधि स्वतंत्र रूप से काम करेगी।

— साइमन वुडसाइड

File (निर्यात की गई फ़ाइल प्रकारों के लिए उन्नत सेटिंग्स) → एसवीजी → फ़ॉन्ट "आउटलाइन में बदलें।"

— Константин Ван

Answer 2

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

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

यह फोंट को रूपरेखा में बदलने की आवश्यकता के बिना आपकी समस्या को हल करेगा।

उम्मीद है की यह मदद करेगा!

Comments

बिलकुल ऐसा ही है! जब आप फ़ाइल> सहेजें और SVG का चयन करते हैं, तो Illustrator फोंट के लिए पोस्टस्क्रिप्ट नामों का उपयोग करता है। आप "MyriadPro-Regular" के बजाय "Myriad Pro" के साथ समाप्त होते हैं जैसा कि आप उम्मीद कर सकते हैं और आपके ब्राउज़र ने पोस्टस्क्रिप्ट नाम के साथ काम नहीं किया है जिस तरह से Illustrator करता है। वर्कअराउंड फ़ाइल> एसवीजी को बचाने के लिए निर्यात करें क्योंकि यह पोस्टस्क्रिप्ट नाम के बजाय उचित पारिवारिक नाम का निर्यात करेगा।

— माइकल थॉम्पसन

जब मैं फ़ाइल> एक्सपोर्ट का चयन करता हूं तो @Michael Thompson, SVG विकल्पों में से एक नहीं है। मैं का उपयोग कर रहा हूँ CS5। क्या यह पहले / बाद के संस्करणों में एक विकल्प है?

— मैक्स स्ट्रैकेनबर्ग

@MaxStarkenburg: निर्यात मेनू संस्करणों के बीच बेतहाशा परिवर्तन करता है। नए संस्करणों में एसवीजी को बचाने / निर्यात करने के तीन तरीके हैं: फ़ाइल> इस रूप में सहेजें> (एसवीजी प्रकार चुनें); फ़ाइल> निर्यात> निर्यात के रूप में ...> (एसवीजी प्रकार चुनें) और फ़ाइल> स्क्रीन के लिए निर्यात> (एसवीजी प्रारूप जोड़ें)।

— माइकल थॉम्पसन

Answer 3

जैसा कि आपने उल्लेख किया है, टाइपफेस एक फ़ॉन्ट फ़ाइल का एक संदर्भ है जो उस सिस्टम के लिए उपलब्ध हो सकता है (या नहीं हो सकता है) जो svg को खोलने का प्रयास करता है। समाधान आपके प्रकार को पथों में परिवर्तित करना है ताकि फ़ाइल के भीतर घटता स्पष्ट रूप से संग्रहीत हो।

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

Comments

हां, मैं उसी कंप्यूटर पर परीक्षण कर रहा हूं जिस पर मैं svg फाइल बना रहा हूं। और अगर आप गलत हैं तो कृपया मुझे सही कर सकते हैं। मैंने आपके उत्तर का पहला भाग लिया क्योंकि मुझे फ़ॉन्ट-पारिवारिक संपत्ति में स्किया रेगुलर की फॉन्ट .ttf फाइल को विशिष्ट पथ देना है?

— रिजवान ६०६

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

— 21

ध्यान दें कि इस प्रकृति के लोगो और वितरित मामले (pdfs आदि) के लिए जहां टाइपफेस मायने रखता है, फ़ॉन्ट को एम्बेड करना या पथ में परिवर्तित करना एक अच्छा विचार है। इसलिए इस संदर्भ को हल करना एक अच्छा समाधान नहीं हो सकता है क्योंकि आप 3 पार्टियों पर भरोसा करते हैं कि पहले से ही उचित टाइपफेस स्थापित किए गए हैं

— क्षितिज

Answer 4

वेब के लिए संग्रह:

1. गूगल फोंट का उपयोग करें।
2. अधिकतम दो फ़ॉन्ट परिवारों का उपयोग करना।

निर्यात: फोंट: (पाठ: एसवीजी, सबकोन्जोन्टो: कोई नहीं)। गुण svg: (शैली तत्व)।

परिणामी फ़ाइल की शैलियों के भीतर, इसे संपादित करें:

1. लाइन "@import" संलग्न करें।
2. सभी फ़ॉन्ट-आकार में "px" संलग्न करें।
3. फ़ॉन्ट का नाम बदलें।

परिणाम:

<style type="text/css">
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,300,700);
body {}

.st0{fill:#868686;}
.st1{font-family:'Roboto Condensed';}
.st2{font-size:14.414px;}
.st3{letter-spacing:55px;}
.st4{fill:#1D1D1B;}
.st5{font-family:'Roboto Condensed'; font-weight: 700;}
.st6{letter-spacing:51px;}
.st7{letter-spacing:45px;}
.st8{letter-spacing:40px;}

Comments

यह जवाब बहुत ही पेचीदा है। मैं यह भी नहीं बता सकता कि क्या यह एक एसवीजी फ़ाइल या किसी अन्य समाधान को संदर्भित करता है ...

— जिगगंजर

Answer 5

संभावना है कि आपके पीसी में स्थानीय रूप से उपलब्ध फ़ॉन्ट परिवार (Skia-Regular) फ़ॉन्ट फ़ाइल नहीं है। इसलिए जब आप अपने ब्राउज़र पर अपनी एसवीजी फ़ाइल खोलते हैं, तो यह डिफ़ॉल्ट सिस्टम फ़ॉन्ट का उपयोग करता है जो कि टाइम्स न्यू रोमन है। कई वर्कअराउंड हैं:

1. Google फ़ॉन्ट्स API का संदर्भ देने के लिए @import का उपयोग करें (लेकिन पकड़ यह है कि आप अपनी SVG छवियों को अपनी वेबसाइट पर कैसे एम्बेड करते हैं, इस पर निर्भर करता है, यदि आप इनलाइन SVG और ऑब्जेक्ट टैग SVG का उपयोग कर रहे हैं)
2. अपने फोंट को पथ में परिवर्तित करें (जो आपके फ़ाइल आकार को बढ़ाता है और धुंधले पाठ में परिणाम देता है क्योंकि आपने ClearType रेंडरिंग खो दिया है)
3. नैनो का उपयोग करके अपने एसवीजी फ़ाइल में फोंट एम्बेड करें

आप एसवीजी में कस्टम फोंट का उपयोग करने पर अधिक पढ़ सकते हैं: https://css-tricks.com/using-custom-fonts-with-svg-in-an-image-tag/