فرمت svg و کاربرد آن در طراحی سایت
فرمت SVG، گرافیک برداری مقیاس‌پذیر و فرمت استاندارد تصاویر برداری بر پایه XML است که می‌تواند در طراحی گرافیکی قالب سایت و طراحی سایت مورد استفاده قرار گیرد.
SVG چیست؟
- SVG مخفف گرافیک برداری مقیاس پذیر (Scalable Vector Graphics) است.
- SVG برای تعریف اشکال گرافیکی مبتنی بر بردار برای وب استفاده می‌شود.
- SVG فایل‌های با نوع XML را برای ذخیره سازی اطلاعات به کارگیری می‌کند.
- گرافیک SVG با بزرگنمایی و یا تغییر اندازه، کیفیت خود را از دست نمی‌دهد.
- هر عنصر و هر صفت در فایل های SVG می تواند متحرک باشد.
- SVG با استانداردهای DOM و XSL ادغام شده است.
مزایای SVG
مزایای استفاده از SVG در مقایسه با فرمت‌های تصویری دیگر (مانند JPEG و GIF ) عبارتند از:
- تصاویر SVG می تواند با هر ویرایشگر متنی ایجاد و ویرایش شود.
- تصاویر SVG را می توان جستجو و فشرده سازی نمود.
- تصاویر SVG قابلیت تغییر اندازه بدون افت کیفیت را دارا هستند.
- تصاویر SVG را می توان با کیفیت بالا در هر وضوح چاپ نمود.
- SVG یک استاندارد متن‌باز است.
- رقیب اصلی SVG در وب فلش است که متکی بر تکنولوژی انحصاری است و کد آن منبع باز نیست.
ایجاد تصاویر SVG
تصاویر SVG را می توان با هر ویرایشگر متن ایجاد کرده، اما اغلب راه راحتر تر برای ایجاد تصاویر SVG استفاده از یک برنامه طراحی، مانند برنامه Inkscape است.
در مثال زیر می‌توانید یک نمونه SVG که درون یک فایل HTML جایگذاری شده است را مشاهده نمایید.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html> <body> <h1>My first SVG</h1> <svg width="100" height="100"> <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" /> </svg> </body> </html> |
آشنایی با Inkscape
Inkscape یک ویرایشگر گرافیکی برداری متن‌بازی شبیه برنامه‌های Adobe Illustrator، CorelDraw و Freehand است که به وسیله‌ی آن می‌توان به طراحی و ویرایش تصاویر برداری( Vector ) پرداخت. آنچه Inkscape را از سایر نرم‌افزارها متمایز می کند، استفاده این برنامه از فرمت فایل SVG، بر مبنای استاندارد W3C می‌باشد. Inkscape بر خلاف ویرایشگرهای گرافیکی Bitmap مانند Photoshop یا Gimp، تصاویر گرافیکی خود را در فرمت وکتور ذخیره می‌کند.
Inkscape می‌تواند به عنوان یک ابزار مناسب و قدرتمند طراحی که با استانداردهای XML, SVG و CSS سازگاری کامل دارد، استفاده شود. این نرم افزار از بسیاری ویژگی های پیشرفته SVG (مانند markers, clones, alpha blending و …) پشتیبانی می‌کند.