דחיסת משקל תמונות לאתר אינטרנט – איך להפחית גודל תמונה? ולמה זה חשוב?

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

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

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

קצת רקע על תמונות באתרי אינטרנט

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

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

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

כאשר הלקוח שלכם לא יכול לראות את התוכן באתר, הוא פשוט עשוי לעזוב את האתר. לכן, כל המטרה לשמה הקמתם את האתר עשויה להיות לשווא.

למה חשוב לדחוס תמונות באתר אינטרנט?

יש הרבה סיבות שאפשר למנות אותם מבחינת החשיבות מדוע לדחוס תמונות באתר אינטרנט. הנה כמה מהם:

1. שיפור יחס המרה

יחס המרה הוא תוצאת חלוקה של מספר אנשים שהמירו (רכשו, השאירו פרטים) במספר אנשים שצפו באותו עניין. למשל, אם נכנסו לעמוד המוצר 100 אנשים ורק 3 קנו, אז יחס המרה הוא 3/100 כלומר 3%. מספיק שלקוח אחד נוסף רוכש, ויחס ההמרה עלה ל-4%. בשורה התחתונה, זה רווח נוסף לבעל העסק.

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

2. התאמה למהירות אינטרנט נמוכה

נכון להיום (2019) כמות הגולשים שנכנסים לאתר ומשתמשים בטלפונים חכמים הם לפחות 50% מכלל הגולשים. בחלק מהמקרים השיעור גבוהה עוד יותר, כמו למשל תכנים מותאמים לגלישה מסלולר או אפילו אפליקציות שונות.

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

חיסכון במשקל תמונה, מסייע להגיע לאוכלוסיה של לקוחות חדשים.

3. חיסכון בנפח אחסון

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

כמו שיש לכם שירותי ענן כמו Dropbox, Google Drive, One Drive ואחרים – ברגע שהתמונות גדולות, הרי שצריך לרכוש יותר נפח.

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

4. חיסכון בנפח תעבורה (רוחב פס)

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

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

5. פגיעה בקידום אתרים

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

מנועי חיפוש כמו גוגל או בינג, משתמשים במהירות האתר כדי לדרג אתרי אינטרנט. אתר אינטרנט איטי יותר, יופיע מתחת לאתר מהיר יותר ממנו אם שאר הגורמים זהים (דומים).

6. פגיעה בקמפיינים שיווקיים

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

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

7. הגדולים עושים את זה

אם כל זה לא מספיק לכם.. אז גם החברות הגדולות מבצעות דחיסת תמונות. אז הנה כמה מהם:

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

אז איך להפחית, להקטין או לדחוס משקל תמונות?

יש 3 דרכים שונים להקטנת או דחיסת משקל תמונות:

1. הקטנת מימדי תמונה – במקום להשתמש ב-1000 על 1000 פיקסלים, משתמשים ב-500 על 500 פיקסלים (פי 4 קטן יותר). פשוט מאוד, משתמשים בתוכנה לעריכת תמונות כדי להקטין את הנפח שלה.
2. עריכת תמונה – הסרת רקע או יצירת רקע לבן או בצבע אחר שהוא שוקל מעט מאוד ובכך, משקל כל התמונה קטן. גם במקרה כזה אפשר להשתמש בכלים ותוכנות לעריכת תמונות כדי להסיר רקע או מסגרת מסויימת.
3. הקטנת איכות התמונה – ניתן להקטין את האיכות של התמונה לפי הפרמרטים שמודדים את האיכות של התמונה. כמו הפיכת תמונה למטושטשת יותר, לא מבריקה, שינוי סוג קובץ וכד'. יש כלים שונים שמאפשרים דחיסה או צמצום איכות התמונה. לעיתים, לא רואים פגיעה מהותית באיכות התמונה.

כמובן שאפשר להשתמש בשילוב של הדרכים האלו ואפילו בכולם ביחד כי להקטין את המשקל.

בכמה ריאלי להקטין משקל תמונה?

הדבר משתנה בהתאם לסוג השיטה שבוחרים לצמצם את משקל התמונה. למשל, אם אתם רוכשים תמונה או מורידים במאגרי תמונות שונים, אתם יכולים להגיע ממשקל של 5-6 מגה בייט לתמונה, ולהקטין אותה לכיוון ה-100 קילובייט – המשמעות היא חיסכון של כ-95% !!

כלים להפחתת משקל תמונות

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

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

• Squoosh – כלי של גוגל כרום המאפשר הקטנת נפח תמונה, סיומת ואיכות. ניתן גם לקבוע איזו איכות לערוך. מומלץ מאוד, אנחנו משתמשים בו. (קישור).
• ShortPixel – כלי נחמד שמקטין משקל תמונות, ויש לו גם תוסף לוורדפרס. (קישור).
• TinyPNG – כלי חינמי שמקטין קבצי תמונה עם סיומת PNG, יש גם TinyJPG לתמונות עם סיומת זו. (קישור).
• Compressor.io – כלי נוסף שיכול להקטין את נפח התמונות. (קישור).