SVG چیه؟
SVG به تصویر مبتنی بر بردار است که در فرمت XML ایجاد میشود و برخلاف سایر فرمتهای تصویر، از پیکسل تشکیل نشده است، بلکه شامل داده های برداری یا همان وکتور است.
SVG به طراحان وب کمک میکند تا مشکلات استفاده از تصایر پیکسلی را تا حد زیادی کاهش بدهند، در ادامه مزایای استفاده از SVGرا گفته ایم.
مستقل از رزولوشن
دیگر مهم نیست اندازه تصویر چقدر باشد، یا کاربر چقدر روی تصویر زوم کند و یا حتی اینکه کیفیت صفحه نمایش کاربر چه اندازه باشد. در همه این موارد SVGحالت با کیفیت و خوبش را حفظ میکند.
سازگار با CSS
از اونجایی که SVG هم مثل HTML به زبان نشانه گذاری است، میتواند class و id داشته باشد و از این طریق به آن در فایل CSS استایل بدهیم. پس میتوانیم بر روی ترسیمات برداری از طریق CSS کارهای زیادی انجام بدهیم، که این کار برای ترسیمات Raster امکان پذیر نیست.
سازگار با جاوا اسکریپت
همانطور که SVG با CSS سازگاری دارد، بنابراین میتواند تعامل خوبی هم با جاوا اسکریپت برقرار کند و مواردی مثل انیمیشن را به راحتی توی سایت پیاده سازی کند ،در نتیجه میتونیم تجربه کاربری و تعامل خوبی را به راحتی برای کاربر ایجاد کنیم.
درخواستهای HTTP کمتر
هر زمان که بواسطه تگ <img> از تصویری به صورت عادی در یک صفحه وب استفاده میکنیم مرورگر برای ترسیم تصویر یک درخواست http به سرور میفرستد تا تصویر را از سرور گرفته و نمایش بدهد. اگر از روش خطی برای SVG استفاده کنیم SVG بصورت مستقیم در فایل html قرار دارد و دیگر نیازی به یک درخواست جداگانه برای تصویر ما ندارد.
مزایای دیگر
ویرایش ساده و حجم کمتر
طراحی واکنشگرای ساده تر