تسمع عن صور Svg فما هي ؟ ومتى تستخدمها ؟

SVG (Scalable Vector Graphics)

هي صور ليست كالصور العادية التي تم انشاءها من عدد من المربعات صغيرة(بيكسل) بل هي عبارة عن اشكال هندسية ومعادلات رياضية تحدد طريقة ربط تلك الاشكال ويتم بناء هذه الصور باستخدام لغة الترميز xml خاصيتها انها..? https://t.co/GwSnkZYasA

لاتفقد جودتها مهما كبرتها وهذا أمر جد مفيد خاصة عندما تريد بناء تصميم توافقي responsive فمثلا تريد عرض logo الموقع في نسخة ويب بحجم كبير وبحجم صغير في نسخة الجوال فلن تلاحظ فرق بين الصورتين رغم اختلاف حجمهما

بعض الاستخدامات:

• تستخدم svg ايضا في بناء fonts فكما تعلم ان الخطوط..?

يمكنك تكبيرها وتصغيرها وتغيير لونها كما تشاء فهي في الاصل رسومات svg ،كذلك الايقونات المستخدمة في الويب مثل @fontawesome

• يمكنك تعديل او اعادة بناء صورة svg او تغيير نصوص داخلها كما تشاء عن طريق تعديل محتوى ملف xml سواء يدويا او برمجيا او عن طريق برامج تصميم..?

- تستخدم svg في بناء animations وبما انها لاتتأثر بتكبير او تصغير فإنها خيار ممتاز لبناء انيمشن متوافقة مع كل الاحجام مثلا loading icon الذي يظهر عند تحميل صفحة ويمكنك حتى انشاء انميشن معقدة.

• يتم استخدام svg بكثرة في الويب لانها ليست مثل الصورة العادية..?

في التحميل بل اسرع لأنها تتشكل من ربط للاشكال كما شرحنا وهذا اسرع من تحميل الملايين من المربعات صغيرة بيكسل للصور العادية png/jpg ، لذلك تخيل لديك موقع فيه عديد من صور وتقوم بتغييرها الى svg فإن سرعة تحميلها تزيد بشكل كبير!..?