אחד המרכיבים החשובים במהירות עליית אתרים או באנרים שנבנים באנימייט (פלאש) או באנרים שנבנים בפורמט html5 הוא נפח התמונות.
כשבוחנים זמן עלייה של אתר בכל אחד מהכלים המצויים באינטרנט, כמו google speed test מוצגים האלמנטים השונים שמאטים את קצב עליית האתר. אחד מאותם רכיבים הוא תמונות.
תמונות בפורמט jpg, png או gif, שמשמשות אותנו באתרים, מעובדות בתוכנות כמו פוטושופ או GIMP או מועלות לאתרים כפי שהן לאחר שנרכשו באתרי תמונות, או הורדו בחינם מאתרי תמונות כמו www.freeimages.com.
ראשית, חשוב לוודא שהתמונות, יהיה מקורן אשר יהיה, יעובדו בתוכנה באופן כזה שהתוצר הסופי הוא במידות המדויקות שבהן ייעשה שימוש בתמונה. לצורך העניין, תמונה באתר רספונסיבי, שמידותיה הן 979 פיקסלים לרוחב ו-734 פיקסלים לגובה לא צריכה להיות גדולה יותר בשום מקרה. כמובן שצריך לוודא שרזולוצית התמונה תהיה 72 פיקסלים לאינץ'.
כאשר שומרים את הקובץ בפוטושופ, ישנו בכל אחד מהמקרים דו שיח בשמירת הקובץ המאפשר להפחית את משקלו כבר בתוכנה. למשל, פורמט jpg מוצע לשמירה במספר דרגות של איכות, כאשר ירידה באיכות מפחיתה גם את נפח הקובץ.
בבנייה של באנרים בפורמט html5 ישנה חשיבות רבה לעקרון, המוזכר מעלה, הנוגע להתאמת התמונות למידה המקסימלית שאליה יגיעו ולא יותר מכך. כאשר מימדי הבאנר ממש קטנים, רצוי לשמור רק בפורמט gif שנפחו בהתאם להרכב הפיקסלים, הוא בדרך כלל נמוך יותר משני הפורמטים האחרים.
בקמפיין באנרים בגוגל, למשל, לא ניתן להעלות באנרים שנפחם הכולל של כל הקבצים עולה על 150kb. כאשר מאחסנים קמפיין כזה על שרת רגיל, או על שרת של חברה המספקת שרותי cdn כמו http://www.expim.co.il/, ככל שנפח הקבצים גדול יותר, נפח התעבורה עולה, ויש לכך השלכות כספיות עבור הלקוח המשלם על אאותם שרותים.
בזאת לא סיימנו. גם לאחר אופטימיזציה של נפח התמונות, יש עדיין מה לכווץ. לעזרתנו מגיעים שני מנועי כיווץ המוצעים לשימוש חופשי בשני אתרים:
האתרים האלה, במקרים מסוימים התלויים במידע המצוי בקבצים, מפחיתים עד 90% מנפח הקובץ! בהחלט כלי עזר הכרחי בבניית אתרים ובאנרים.
לסיכום: הקפדה על כיווץ תמונות באתרי אינטרנט חשובה מאוד ומשפרת את זמן הטעינה של הדפים, ובבאנרים יש לכך חשיבות עליונה, ורצוי להקפיד על כך טרם בניית הבאנר.
