למה להשתמש קבצי SVG במקום JPG

היתרונות של SVG

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

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

SVG האם טכנולוגיית וקטור

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

SVG מבוסס טקסט

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

SVG האם XML ועובד בתוך תבניות שפה אחרות

זה חוזר לקוד מבוסס טקסט. ניתן ליצור את תמונת הבסיס ב- SVG ולהשתמש ב- CSS כדי ללטש אותה. כן, אתה יכול לקבל תמונה שהיא למעשה קובץ SVG, אבל אתה יכול גם קוד SVG ישירות לתוך הדף ולערוך אותו בעתיד. אתה יכול לשנות את זה עם CSS באותה הדרך היית משנה טקסט בדף, וכו 'זה חזק מאוד וזה עושה לעריכה קלה.

SVG נערך בקלות

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

תמונות JPG יכול להיות כבד

אם אתה רוצה את התמונה שלך לגדול בגודל פיזי, זה יהיה גם לגדול בגודל הקובץ. עם SVG, פאונד הוא עדיין פאונד לא משנה כמה גדול אתה עושה את זה. ריבוע כי הוא 2 אינץ 'רחב ישקול זהה ריבוע כי הוא 100 אינץ' רחב. גודל הקובץ אינו משתנה, וזה מעולה מנקודת מבט ביצועי הדף!

אז מה עדיף?

אז מה הוא פורמט טוב יותר - SVG או JPG? זה תלוי בתמונה עצמה. זה כמו לשאול "מה עדיף, פטיש או מברג?" זה תלוי מה שאתה צריך להשיג! הדבר נכון גם לגבי תבניות תמונה אלה. אם אתה צריך להציג תמונה, אז JPG היא הבחירה הטובה ביותר עבורך. אם אתה מוסיף סמל, סביר להניח ש- SVG בחירה טובה יותר. תוכל ללמוד עוד מתי מתאים להשתמש בקובצי SVG כאן .

מאמר מקורי מאת ג'ניפר קרינין. בעריכת ג'רמי ג'ירארד ב -6 / 6/17