שימוש בתבניות JPG, GIF, PNG ו- SVG באינטרנט

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

תמונות GIF

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

פורמט ה- GIF אינו מתאים לתמונות צילום או תמונות עם צבעי שיפוע. מכיוון שלפורמט ה- GIF יש מספר מוגבל של צבעים, שיפועי הצילום והצילום יסתיימו בפסים ובפיקסלציה כאשר הם נשמרים כקובץ GIF.

תמונות JPG

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

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

instagram viewer

תמונות PNG

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

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

תמונות SVG

SVG מייצג Scalable Vector Graphic. בניגוד לפורמטים מבוססי רסטר שנמצאים ב- JPG, GIF ו- PNG, קבצים אלה משתמשים בווקטורים כדי ליצור קבצים קטנים מאוד שניתן לעבד בכל גודל ללא אובדן איכות של עלייה בגודל הקובץ. הם נוצרו לאיורים כמו אייקונים ואפילו לוגואים.

הכנת תמונות למשלוח באינטרנט

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

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