स्केलेबल व्हेक्टर ग्राफिक्स वापरण्याचे फायदे
स्केलेबल व्हेक्टर ग्राफिक्स, किंवा एसव्हीजी, वेबसाइट डिझाइनमध्ये आज महत्वाची भूमिका निभावतात. आपण सध्या आपल्या वेब डेव्हलपेटच्या कामात एसव्हीजी वापरत नसल्यास, आपण असे काही कारणे का सुरू करायला हवीत, तसेच आपण जुन्या ब्राऊझरसाठी वापरू शकता अशा फॉलबॅक वापरू शकता जे या फायलींचे समर्थन करत नाहीत.
ठराव
एसव्हीजीचा सर्वात मोठा फायदा म्हणजे स्वतंत्रता आहे. SVG फाईल्स पिक्सल-आधारित रास्टर प्रतिमा ऐवजी सदिश ग्राफिक्स असल्यामुळे त्यास कोणत्याही प्रतिमा दर्जा न गमावता त्यांचे आकार बदलले जाऊ शकतात. हे विशेषतः उपयोगी आहे जेव्हा आपण प्रतिसाद वेबसाइट तयार करीत आहात जे चांगल्या दिसण्यासाठी आणि स्क्रीन आकार आणि डिव्हाइसेसच्या विस्तृत श्रेणीवर चांगले काम करण्याची आवश्यकता आहे.
आपल्या संवेदनशील वेबसाइटच्या बदलत्या आकार आणि लेआउट गरजा पूर्ण करण्यासाठी SVG फाइल्स कडील वर किंवा खाली केली जाऊ शकतात आणि आपल्याला त्या ग्राफिक्सची तडजोड केलेली गुणवत्ता कुठल्याही पायरीची चिंता करण्याची आवश्यकता नाही.
फाईलचा आकार
प्रतिसाद वेबसाइटवर रास्टर प्रतिमा (JPG, PNG, GIF) वापरून आव्हानांपैकी एक म्हणजे त्या प्रतिमांचा फाईल आकार. कारण रेसर प्रतिमा अशा सदिशांसारख्या मार्गांवर मोजल्या जात नाहीत म्हणून, आपण आपल्या पिक्सेल-आधारित प्रतिमांना त्या सर्वात मोठ्या आकारात वितरित करणे आवश्यक आहे ज्यावर ते प्रदर्शित केले जाईल. याचे कारण असे की आपण नेहमी प्रतिमा कमी करू शकता आणि त्याची गुणवत्ता टिकवून ठेवू शकता, परंतु त्या प्रतिमा मोठ्या आकारासाठी खरे नाहीत अंतिम परिणाम असा की आपण अनेकदा अशा चित्रे ठेवत असतो जी एखाद्या व्यक्तीच्या स्क्रीनवर दर्शविलेल्यापेक्षा मोठ्या आहेत, ज्याचा अर्थ त्यांना खूप मोठी फाईल डाउनलोड करण्यास भाग पाडले जात आहे.
एसव्हीजी या आव्हानाला संबोधित करते वेक्टर ग्राफिक्स स्केल करण्यायोग्य असल्यामुळे, त्या छायाचित्रे किती मोठ्या प्रदर्शनाची आवश्यकता असू शकतात याची पर्वा न करता आपल्याजवळ खूप लहान फाइल आकार असू शकतात. याचा शेवटी साइटच्या एकूण कार्यक्षमतेवर आणि डाउनलोड गतीवर सकारात्मक परिणाम होईल.
सीएसएस शैली
SVG कोड एका पृष्ठाच्या HTML वर थेट जोडता येतो. यास "इनलाइन एसव्हीजी" म्हणून ओळखले जाते. इनलाइन एसव्हीजी वापरण्याचा एक फायदा हा आहे की, ग्राफिक्स प्रत्यक्षात आपल्या कॉम्प्यूटरवर आधारित ब्राउझरद्वारे काढलेला असल्याने, प्रतिमा फाईल प्राप्त करण्यासाठी HTTP विनंती करण्याची आवश्यकता नाही. आणखी एक फायदा म्हणजे इनलाइन एसव्हीजी सीएसएससह स्टाइल करता येते.
एसव्हीजी चिन्हाचा रंग बदलण्याची गरज आहे का? ती प्रतिमा संपादन सॉफ्टवेअरमध्ये उघडण्यासाठी आणि निर्यात करण्यास आणि फाइल पुन्हा अपलोड करण्याऐवजी, आपण सी.व्ही.एस.च्या काही ओळी सोबत फक्त एसव्हीजी फाइल बदलू शकता.
आपण एसव्हजी ग्राफिक्सवरील इतर सीएसएस स्टेशन्स वापरु शकता हेव्हर स्टेटसवर किंवा विशिष्ट डिझाइन गरजेसाठी. आपण एका पृष्ठावर काही हालचाल आणि परस्परसंवादाला जोडण्यासाठी त्या ग्राफिक्सला चेतन करू शकता.
अॅनिमेशन
कारण इनलाइन SVG फाइल्स सीएसएससह स्टाईल करता येतात, आपण त्यावरील CSS अॅनिमेशन वापरू शकता. सीएसएस रुपांतरण आणि संक्रमणे एसव्हीजी फाइल्सना काही जीवन जोडण्यासाठी दोन सोपे मार्ग आहेत. आजच्या वेबसाइटवरील फ्लॅश वापरुन येणार्या डाउनसाइडवर न सोडता आपण पेजवर समृद्ध फ्लॅश सारखी अनुभव मिळवू शकता.
एसव्हीजीचे वापर
SVG सारखे शक्तिशाली आहे, हे ग्राफिक्स आपण आपल्या वेबसाइटवर वापरत असलेले प्रत्येक इतर प्रतिमा स्वरूपन बदलू शकत नाही. ज्या गहन रंगीत खोलीची आवश्यकता आहे ते फोटो अजूनही JPG किंवा कदाचित PNG फाईल असण्याची आवश्यकता आहे, परंतु चिन्हांसारखी साधी प्रतिमा SVG म्हणून कार्यवाही करण्यायोग्य आहेत.
एसव्हीजी अधिक जटिल स्पष्टीकरणासाठी योग्य असू शकते, जसे की कंपनीचा लोगो किंवा आलेख आणि चार्ट. सर्व ग्राफिक्स स्केलेबल करण्यापासून, सीएसएससह स्टाइल करण्यास सक्षम असणं, आणि या लेखात सूचीबद्ध केलेले इतर लाभ यांचा फायदा होईल.
जुने ब्राउझरसाठी समर्थन
आधुनिक वेब ब्राउझरमध्ये एसव्हीजीसाठी सध्याचे समर्थन उत्तम आहे या एक्सप्लोरर (आवृत्ती 8 आणि त्याखालील) आणि अँड्रॉइडच्या काही जुन्या आवृत्त्या या जुन्या आवृत्त्या आहेत. सर्व सर्व, ब्राउझिंग लोकसंख्येपैकी खूपच कमी टक्केवारी अजूनही या ब्राउझरचा वापर करते, आणि तो नंबर कमी होण्याची शक्यता आहे याचा अर्थ असा की एसव्हीजी आज वेबसाइट्सवर अतिशय सुरक्षितपणे वापरला जाऊ शकतो.
आपण SVG साठी फॉलबॅक देऊ इच्छित असल्यास, आपण फिलामेंट ग्रुप मधून ग्रम्पिकॉन सारखे साधन वापरू शकता. हे संसाधने आपल्या SVG प्रतिमा फायली घेईल आणि जुन्या ब्राऊझरसाठी PNG फॉलबॅक तयार करेल.
1/27/17 रोजी जेरेमी गिरर्ड द्वारा संपादित