למה צילומי המסך שלכם שוקלים 2 MB, ואיך לכווץ אותם ב-60–90%

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

למה צילום מסך הוא קובץ של 2 MB

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

PNG שומר כל פיקסל בדיוק. מסך מודרני צפוף — צילום חלון מלא על תצוגת Retina או 4K יכול להיות ברוחב 2,000 פיקסלים ומעלה, ו-PNG מתעד בנאמנות כל אחד ממיליוני הפיקסלים האלה במלוא הדיוק. לא אכפת לו ש-60% מהמסגרת הם אותו גוון של כמעט-לבן. הוא לא זורק כלום, כי זריקה היא לא מה שהוא עושה. אז צילום מסך של עמוד הגדרות כמעט ריק — כמעט כלום ויזואלית — עדיין שוקל 1.5 עד 2.5 MB, כי הבד עצום גם כשהתוכן דליל.

המהלך: המרה ל-WebP

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

מספרים אמיתיים מצילומי מסך על הדיסק שלי:

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

"הטקסט לא ייצא מטושטש?"

זה הפחד, והוא הוגן, כי כנראה ראיתם צילום מסך JPG עם טקסט מטושטש ומוקף הילה והנחתם שכל הפורמטים בעלי האובדן עושים את זה. WebP טוב יותר בקצוות מ-JPG — טוב יותר בצורה משמעותית. בהגדרת איכות שפויה, טקסט על צילום מסך WebP נשאר חד. הגדלתי ל-400% בחיפוש אחר ארטיפקטים סביב אותיות ויצאתי בידיים ריקות על צילומי ממשק רגילים.

החריגה הכנה: אם תורידו את האיכות חזק כדי לרדוף אחרי קובץ זעיר, בסופו של דבר תראו את הטקסט מתרכך. הפתרון הוא פשוט לא לעשות את זה. הגדרת איכות בינונית כבר משיגה לכם את הניצחון של 60–90% עם הטקסט שלם. אין שום סיבה להיכנס לטווח שבו זה נשבר.

מתי הכיווץ לא עוזר

שני מקרים שבהם אני משאיר את ה-PNG בשקט.

אם צילום המסך חוזר לתוך כלי עיצוב כדי לסמן, להעיר או להרכיב עליו, אני משאיר אותו lossless. המעבר בעל האובדן של WebP הוא דלת חד-כיוונית, ואני לא רוצה לצרוב דחיסה לתוך משהו שאני עומד לערוך ולייצא מחדש. תשלחו את ה-WebP, שמרו את קובץ ה-PNG המקורי — אותו כלל תמיד.

ואם צילום מסך כבר קטן — חיתוך זעיר, כפתור בודד, משהו שכבר מתחת ל-100 KB בערך — ההמרה בקושי מזיזה את המחט. הניצחון של 60–90% מגיע מקבצים שהם ענקיים כי הבד ענק. חיתוך קטן כבר פתר את הבעיה הזאת. אל תוסיפו שלב בשביל כלום.

איך אני עושה את זה בפועל

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

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