یک لحظه...(/)
ما در حال حاضر تصاویر شما را بهینه میکنیم. لطفاً یک لحظه صبر کنید تا بهترین نتایج را برای شما تضمین کنیم.
عالی، ما با موفقیت تصاویر شما را فشرده کردیم.
تصاویر بهینه شدند.
فشردهسازی تصاویر SVG آنلاین
متادیتا را حذف کنید، بردار را حفظ کنید: SVG شما دقیقاً همانطور نمایش داده میشود
در حال بهینهسازی...
فایلهای SVG را با حذف باقیماندههای ویرایشگر فشرده کنید
اگر یک فایل SVG را در Notepad باز کنید، همه چیز را خواهید دید: تگها، اعداد، متن. این همان چیزی است که این فرمت را تشکیل میدهد. هیچ پیکسلی وجود ندارد، هیچ عکسی نیست، فقط دستورالعملهایی برای ترسیم اشکال است. این موضوع اهمیت دارد چون معنای فشردهسازی در اینجا متفاوت است. هیچ چیزی فشرده یا تقریبی نمیشود. فقط متنهای اضافی حذف میشوند و نقاشی دستنخورده باقی میماند.
منبع اصلی حجم فایل از کجاست
تقریباً هیچکدام از حجم فایل مربوط به اثر هنری نیست. اگر یک لوگو را از Illustrator، Figma یا Inkscape خروجی بگیرید، فایل همراه با مدارک ویرایشگر میآید: یک کامنت تولیدکننده، یک DOCTYPE که از سال ۲۰۰۸ دیگر کسی به آن نیاز ندارد، یک اعلامیه XML، یک بلوک متادیتا که سند را با RDF توصیف میکند، نام لایهها و یک بلوک استایل پر از کلاسهایی که هیچ عنصری از آنها استفاده نمیکند. در یک لوگوی واقعی که آزمایش کردیم، همه این موارد تقریباً دو سوم حجم فایل را تشکیل میدادند. خود اشکال بخش کوچکی بودند.
بعد نوبت به اعداد میرسد. ویرایشگرها مختصات را با دقت کامل اعشاری مینویسند، پس یک مستطیل که در ۱۰ قرار دارد و ۱۸۰ عرض دارد، به صورت 10.000000 و 180.00000000 ذخیره میشود. این را برای هر نقطه در هر مسیر ضرب کنید و فقط اعشارها میتوانند از خود نقاشی سنگینتر شوند.
همچنان یک وکتور باقی میماند، پس کیفیتی برای از دست دادن وجود ندارد
این همان بخشی است که بسیاری بیدلیل نگرانش هستند. یک SVG هیچ رزولوشنی ندارد. هر بار در هر اندازهای که نمایش داده شود، از نو ترسیم میشود؛ چه یک فاوآیکون ۱۶ پیکسلی باشد چه یک بیلبورد. حذف یک بلوک متادیتا هیچ تغییری ایجاد نمیکند. فایلی که دریافت میکنید دقیقاً به همان اندازهای که آپلود کردید مقیاسپذیر است، در هر اندازهای کاملاً مشابه دیده میشود و همچنان در برنامهای که ساختهاید قابل ویرایش است.
چه چیزهایی حذف میشوند
پاکسازی بهطور محافظهکارانه طراحی شده است. فقط مواردی را هدف میگیرد که هیچ اثری بر نمایش ندارند.
| حذف میشود | حفظ میشود |
|---|---|
| کامنتهای ویرایشگر و رشتههای تولیدکننده | تمام اشکال، مسیرها و منحنیها |
| بلوک متادیتا و فضای نامهای RDF آن | رنگها، گرادیانها و شفافیت |
| DOCTYPE و اعلامیه XML | عناصر متنی و فونتها |
| تعاریفی که هیچ ارجاعی به آنها نیست | فیلترها، ماسکها و مسیرهای برش در حال استفاده |
| گروهها و لایههای خالی | تبدیلات و viewBox |
| اعشارهای اضافی در مختصات | هر چیزی که ظاهر را تغییر دهد |
چرا کوچکتر شدن SVG مهمتر از عکسهاست
SVG معمولاً یک لوگو یا آیکون است، یعنی در هدر هر صفحه از سایت قرار میگیرد و قبل از هر چیز دیگری بارگذاری میشود. عکسها دیرتر و به صورت تنبل بارگذاری میشوند. اما آیکونها اینطور نیستند. کم کردن چند کیلوبایت از لوگوی هدر برای امتیاز سرعت صفحه ارزش بیشتری نسبت به کم کردن همان مقدار از تصویری در وسط مقاله دارد، چون مرورگر قبل از اینکه بتواند صفحه را نمایش دهد منتظر هدر میماند.
یک نکته مهم قبل از انتشار
پاکسازی، ویژگی id داخلی فایل را کوتاهتر میکند. ارجاعات داخل همان SVG بهروزرسانی میشوند تا مطابقت داشته باشند، بنابراین گرادیانها، ماسکها و مسیرهای برش همچنان کار میکنند و نقاشی دقیقاً مثل قبل نمایش داده میشود. اما چیزی درباره کد خارج از فایل نمیداند. اگر SVG شما در یک اسپریت آیکون قرار دارد که صفحات دیگر به آن اشاره میکنند، یا اگر یک استایلشیت یا اسکریپت به یک عنصر با id خاص دسترسی دارد، این موارد را بعد از جایگزینی فایل تست کنید. برای یک لوگوی ساده یا آیکون خروجی گرفته شده، که اکثر SVGها همین هستند، نیازی به بررسی نیست.
اگر SVG شما یک عکس درون خود دارد
گاهی اوقات یک SVG واقعاً وکتور نیست. اگر عکسی را در صفحه کار Illustrator قرار دهید و به صورت SVG خروجی بگیرید، تصویر به صورت یک رشته base64 طولانی درون XML قرار میگیرد. ممکن است فایل با وجود داشتن فقط یک شکل، دو مگابایت حجم داشته باشد. پاکسازی نشانهگذاری آن بلوک را دست نمیزند، چون اصلاً نشانهگذاری نیست. اگر فایل شما به سختی کوچک شد و از ابتدا یک عکس درونش بود، دلیلش همین است و راهحل این است که عکس را جدا کنید و آن را به صورت JPEG یا PNG فشرده کنید.
هیچ چیزی برای تنظیم وجود ندارد
هیچ گزینهای، هیچ سطح فشردهسازی و هیچ تب پیشرفتهای وجود ندارد. فایل را آپلود کنید و نسخه پاکسازیشده را دریافت کنید. چند فایل همزمان هم به همین صورت کار میکند و میتوانید آنها را یکییکی دانلود کنید یا همه را به صورت یک فایل ZIP دریافت کنید.
چه اتفاقی برای فایلهای شما میافتد
فایلها از طریق یک ارتباط رمزگذاریشده منتقل میشوند، پاکسازی شده و یک ساعت بعد از سرور حذف میشوند. هیچ چیزی نگهداری نمیشود و هیچ استفاده دیگری از آنها نمیشود.
چه چیزی دریافت میکنید
- متادیتای ویرایشگر، کامنتهای تولیدکننده، DOCTYPE و تعاریف بلااستفاده حذف میشوند
- مختصات به دقت معقولی گرد میشوند و نه تا ۹ رقم اعشار
- فایلی که همچنان بینهایت مقیاسپذیر است و همچنان در ویرایشگر شما باز میشود
- نمایش کاملاً یکسان در هر اندازه، تأیید شده با نسخه اصلی
- آپلود گروهی، با دانلود تکی یا کل مجموعه به صورت ZIP
- بدون نیاز به حساب کاربری، بدون نصب، و حذف فایلها از سرور پس از یک ساعت
بعدی چیست؟
با لوگویی کار میکنید که نسخه بیتمپ هم دارد؟ فشردهسازی PNG نسخه شفاف را انجام میدهد و فشردهسازی WebP نسخه مدرن را. و اگر SVG شما درون خود یک عکس داشت، فشردهسازی JPG جایی است که باید آن عکس را بفرستید.
سؤالات متداول
خیر، و اصلاً امکانپذیر نیست. SVG هیچ پیکسلی ندارد و رزولوشن ندارد. فقط مجموعهای از دستورالعملهای ترسیم است که مرورگر هر بار در هر اندازهای که تصویر نمایش داده شود، آن را از نو ترسیم میکند؛ بنابراین روی موبایل دقیقاً به همان اندازه تیز است که روی بیلبورد. پاکسازی فایل فقط متنی را حذف میکند که چیزی را ترسیم نمیکند، مثل کامنتها و متادیتا. اشکال، منحنیها و رنگها دستنخورده باقی میمانند، پس نتیجه در هر اندازهای کاملاً یکسان نمایش داده میشود.
مدارکی که ویرایشگر شما اضافه کرده است. Illustrator، Figma و Inkscape همگی یک کامنت تولیدکننده، اعلامیه XML، DOCTYPE، بلوک متادیتا در RDF، نام لایهها و اغلب یک بلوک استایل شامل کلاسهایی که هیچکس استفاده نمیکند مینویسند. علاوه بر این، مختصات با دقت کامل ذخیره میشوند، پس مقدار ۱۸۰ به صورت 180.00000000 ذخیره میشود. در یک لوگوی خروجی معمولی، همه اینها تقریباً دو سوم حجم فایل را تشکیل میدهند. بخش کوچکی از فایل همان چیزی است که تصویر را ترسیم میکند.
بله. خروجی یک SVG عادی است، بنابراین دقیقاً مانند نسخه اصلی در Illustrator، Figma، Inkscape یا هر ویرایشگر متنی باز میشود. تنها تفاوت این است که بخشی از اطلاعات داخلی ویرایشگر حذف شده، بنابراین ممکن است نام لایهها دقیقاً مثل قبل نباشد. خود اثر هنری دستنخورده و کاملاً قابل ویرایش باقی میماند.
دو دلیل رایج وجود دارد. یا فایل قبلاً بهینه شده بود، که این اتفاق برای SVGهایی که از ابزارهایی با پاکسازی خودکار خروجی گرفته شدهاند یا قبلاً از یک بهینهساز عبور کردهاند رخ میدهد؛ یا فایل حاوی یک عکس جاسازیشده است. این مورد دوم معمولاً باعث تعجب میشود: قرار دادن یک عکس در صفحه کار Illustrator و خروجی گرفتن به صورت SVG، تصویر را به صورت یک بلوک base64 درون XML قرار میدهد. آن بلوک داده تصویر است نه نشانهگذاری، پس پاکسازی نشانهگذاری آن را تغییر نمیدهد. اگر یک SVG دو مگابایتی تقریباً تغییری نکرد، آن را در یک ویرایشگر متنی باز کنید و به دنبال یک رشته خیلی طولانی که با data:image شروع میشود بگردید.
ممکن است، و بهتر است قبل از انتشار بدانید. پاکسازی، ویژگی id داخل فایل را کوتاهتر میکند. ارجاعات داخلی همان SVG بهروزرسانی میشوند تا مطابقت داشته باشند، بنابراین گرادیانها، ماسکها و مسیرهای برش همچنان کار میکنند و تصویر دقیقاً مثل قبل نمایش داده میشود. اما کد خارج از فایل موضوع متفاوتی است: اگر یک استایلشیت عنصری را با id هدف قرار دهد، اگر جاوااسکریپت یک گره خاص را انیمیت کند یا اگر فایل بخشی از یک اسپریت باشد که صفحات دیگر به آن ارجاع میدهند، بعد از جایگزینی فایل آنها را تست کنید. برای یک لوگوی مستقل یا آیکون خروجی گرفته شده، که اکثر SVGها را شامل میشود، جای نگرانی نیست.
بله، و این دو به خوبی با هم کار میکنند و رقیب هم نیستند. این پاکسازی متنی را حذف میکند که اصلاً نباید در فایل باشد. gzip که سرور شما هنگام ارسال فایل اعمال میکند، هر متنی که باقی مانده را فشرده میکند. انجام هر دو کار رایج است و نتیجه ترکیبی از هر کدام به تنهایی کوچکتر است. همچنین ارزش دارد که بررسی کنید سرور شما واقعاً فشردهسازی را برای نوع محتوای image/svg+xml فعال کرده باشد، چون بعضی تنظیمات پیشفرض فقط HTML، CSS و JavaScript را پوشش میدهند.