קובצי SVG.

מה נלמד אתכם.

• מה הוא קובץ SVG?
• ההיסטוריה של קובץ SVG
• בשביל מה משתמשים בקובצי SVG?
• יתרונות וחסרונות של קובצי SVG
• איך לפתוח קובץ SVG
• איך ליצור ולערוך קובץ SVG
• קובצי SVG: שאלות נפוצות

מה הוא קובץ SVG?

הפורמט Scalable Vector Graphics‏ (SVG) הוא פורמט קבצים של וקטור שידידותי לאינטרנט. בניגוד לקובצי רסטר שמבוססים על פיקסלים, כמו קובצי JPEG, קובצי וקטור מאחסנים את התמונות באמצעות נוסחות מתמטיות שמבוססות על נקודות וקווים בפריסת רשת. כלומר, הגודל של קובצי וקטור כמו SVG יכול להשתנות בצורה משמעותית ללא פגיעה באיכות הקובץ, לכן הקבצים האלה אידיאליים ליצירה של סמלי לוגו וגרפיקות מקוונות מורכבות.

יכולות התאמת הגודל הן רק חלק מהיתרונות שבזכותם קובצי SVG פופולריים כל כך בקרב מעצבי אינטרנט. קובצי SVG נכתבים באמצעות קוד XML, כלומר, הם מאחסנים את כל הנתונים הטקסטואליים כמלל ולא כצורות. התכונה הזאת מאפשרת למנועי חיפוש כמו Google לקרוא גרפיקות של SVG ולזהות בהן מילות מפתח, יכולת שעשויה לעזור לאתר להשיג דירוג גבוה יותר בתוצאות החיפוש.

אפשר לזהות בקלות קובץ SVG לפי הסיומת שלו, ‎.svg

ההיסטוריה של קובץ SVG.

ההיסטוריה של קובצי SVG מתחילה בשנות ה-90 המאוחרות של המאה ה-20, כאשר חברת World Wide Web Consortium‏ (W3C) הזמינה מפתחים להציע סוג חדש של פורמט לגרפיקת וקטור. הוגשו שש הצעות מתחרות שעזרו לחברת W3C לבנות פורמט חדש ולבסוף ליצור את הפורמט SVG.

קובצי SVG לא זכו לפופולריות עם השקתם. התמיכה שניתנה בהם הייתה יחסית מצומצמת עד 2017, כאשר אנשים התחילו להבין את יתרונות השימוש בקובצי SVG בדפדפני אינטרנט מודרניים. קובצי SVG נמצאים בשימוש נפוץ לשמירת תמונות דו ממדיות באתרי אינטרנט מאחר שרוב הדפדפנים ויישומי הציור של קובצי וקטור יכולים לעבוד איתם בקלות.

יתרונות וחסרונות של קובצי SVG.

כדאי להבין את היתרונות והחסונות של קובצי SVG לפני ששומרים את התמונות בפורמט הקבצים הזה.

יתרונות של קובצי SVG.

• בניגוד לקובצי רסטר (שמורכבים מפיקסלים), גרפיקות של וקטור, כמו קובצי SVG, תמיד שומרות על הרזולוציה שלהן – לא משנה כמה מרחיבים או מצמצמים את התמונה המקורית. לא צריך לדאוג שהאיכות של תמונות SVG תיפגע בדפדפנים מסוימים או בעקבות שינוי הגודל כדי להתאימן למיקומים שונים.
• קובצי SVG בסיסיים בדרך כלל קטנים יותר מאשר תמונות רסטר, שמורכבות מפיקסלים צבעוניים רבים לעומת קובצי SVG, שמשתמשים באלגוריתמים מתמטיים.
• מאחר שקובצי SVG מתייחסים לטקסט כמו לטקסט (ולא כמו לעיצוב), קוראי מסכים יכולים לסרוק בקלות את המילים שכלולות בתמונות SVG. התכונה הזאת יכולה לעזור בצורה משמעותית לאנשים שזקוקים לעזרה בקריאה של דפי אינטרנט. גם מנועי חיפוש יכולים לקרוא את הטקסט בתמונת SVG ולהוסיף אותו לאינדקס.

חסרונות של קובצי SVG.

• קובצי SVG הם פתרון נהדר לגרפיקות באינטרנט, כגון סמלי לוגו,איורים ותרשימים. אבל החוסר בפיקסלים מהווה אתגר בהצגה של תמונות דיגיטליות באיכות גבוהה. קובצי JPEG בדרך כלל טובים יותר להצגה של תמונות מפורטות.
• רק דפדפנים מודרניים יכולים לתמוך בתמונות SVG. ייתכן שהשימוש בקובצי SVG בדפדפן Internet Explorer 8 ובדפדפנים ישנים אחרים לא יהיה אפשרי.
• הקוד שנוסף לתמונות SVG עלול להיות קשה להבנה אם אין לכם ניסיון בפורמט הקבצים הזה.

איך לפתוח קובץ SVG.

כיום, בדפדפנים Chrome, ‏Edge, ‏Safari, ‏Firefox ובכל הדפדפנים הפופולריים האחרים אפשר לפתוח קובצי SVG – הן במחשבי Mac והן במחשבי Windows. פשוט הפעילו את הדפדפן ולחצו על File (קובץ)

פתחו כדי לבחור את הקובץ שברצונכם להציג. הקובץ יוצג בדפדפן שבחרתם.

גם פתיחה של תמונת SVG עם תוכנה מובנית במחשב היא פעולה פשוטה. לחצו לחיצה כפולה על שם הקובץ. כעת תופיע רשימה של תוכנות שבאמצעותן ניתן לפתוח את התמונה – לחלופין, התמונה תיפתח בתוכנה התואמת.

איך ליצור ולערוך קובץ SVG.

כאשר משתמשים ב-Adobe Photoshop יש לבצע את השלבים הבאים:

1. לאחר שיצרתם את התמונה ב-Photoshop, יש ללחוץ על File (קובץ) > Export (לייצא) > Export As (לייצא בתור).
2. יש ללחוץ על התפריט הנפתח Format (פורמט) בתוך התיבה שמופיע ולבחור באפשרות SVG.
3. בחרו באפשרות Export All (לייצא הכול) ושמרו את הקובץ.

עצה מועילה: מאחר שהיישום Photoshop הוא עורך של גרפיקות מסוג רסטר, אנשים מעדיפים לרוב ליצור ולערוך קובצי SVG ב-Adobe Illustrator, עורך של גרפיקות מסוג וקטור.