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

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

דוגמאות של דפים בין מכשירים

אילו גדלי תמונה פועלים בצורה הטובה ביותר?

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

מציאת הגדלים הטובים ביותר עבור הדף תלויה בגורמים הבאים:

  • יחסגובה-רוחב: קשר הגומלין בין הגובה והרוחב של תמונות

  • פריסת עמודה: הסוג ומספר העמודות בעמוד

  • פריסת webpart: הפריסה שבחרת עבור ה-web part שבו התמונה נמצאת בשימוש

יחס גובה-רוחב

יחס גובה-רוחב הוא קשר הגומלין בין רוחב וגובה של תמונות. הוא מבוטא בדרך כלל כשני מספרים, כגון 3:2, 4:3 או 16:9. הרוחב הוא תמיד המספר הראשון. כדוגמה, יחס של 16:9 עשוי להיות 1600 פיקסלים ברוחב על-ידי 900 פיקסלים בגובה. לחלופין, ייתכן שהוא 1920 x 1080, 1280 x 720 או כל שילוב אחר של רוחב/גובה שניתן לחשב כדי שווה ל-16:9. באפשרותך למצוא מחשבונים של יחס גובה-רוחב באופן מקוון ובחלק מכלי עריכת התמונות שיעזרו לך לקבוע את יחסי הגודל של התמונות שלך. 

דוגמאות ליחס גובה-רוחב של 16:9 ו-4:3.

ברוב המקרים, תמונות ברכיבי web part מודרניים פועלות בצורה הטובה ביותר בכל הפריסות והמכשירים כאשר יש להם יחס גובה-רוחב של 16:9 או 4:3, בהתאם לפריסה.

פריסות עמודה

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

פריסה

רוחב בפיקסלים

עמודה ברוחב מלא

1920

עמודה אחת

1204

שתי עמודות

586 לכל עמודה

שלוש עמודות

380 לכל עמודה

עמודה שמאלית אחת-שלישית

380 עבור העמודה הימנית; 792 עבור העמודה הימנית

עמודה שמאלית אחת-שלישית

792 עבור העמודה הימנית; 380 עבור העמודה הימנית

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

גובה התמונות הממוקם בתוך פריסות עמודות אחרות תלוי ביחס הגובה-רוחב שלך. להלן קווים מנחים של גובה/רוחב עבור 16:9 ו-4:3 יחס גובה-רוחב (מעוגל כלפי מעלה/מטה לפיקסל הקרוב ביותר). פעולה זו שימושית לשמור את התמונות שלך ברוחב ובגובה שמקשקשים כראוי עבור מכשירים ניידים, לדוגמה.

יחס גובה-רוחב

פריסה

16 x 9

רוחב x גובה בפיקסלים

4 x 3

רוחב x גובה בפיקסלים

עמודה אחת

1204 x 677

1204 x 903

שתי עמודות

586 x 330

586 x 439

שלוש עמודות

380 x 214

380 x 285

עמודה שמאלית אחת-שלישית

380 x 446 עבור העמודה הימנית; 792 x 446 עבור העמודה הימנית

380 x 594 עבור העמודה הימנית; 792 x 594 עבור העמודה הימנית

עמודה שמאלית אחת-שלישית

792 x 446 עבור העמודה הימנית; 380 x 446 עבור העמודה הימנית

792 x 594 עבור העמודה הימנית; 380 x 594 עבור העמודה הימנית

פריסות Web part

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

שקול תמונה זו הכוללת יחס גובה-רוחב מקורי של 16:9:

דוגמה של 16_9 image

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

Web part של הגיבור

יחסי הגודל הבאים עבור פריסות אריחים ושכבות הם:

  • אריחים: הגובה של ה-web part משתנה כדי לעקוב אחר יחס גובה-רוחב של 8:3 ותמונות בתוך קנה המידה של ה-web part ליחס גובה-רוחב של 4:3.

  • שכבות: שכבה בודדת מקנה מידה ליחס גובה-רוחב של 8:3 ותמונות בתוך כל שכבה ליחס גובה-רוחב ליד 16:9.

  • במכשירים ניידים, נעשה שימוש בפריסת קרוסלת ב-16:9.

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

דוגמה של תמונות web part של גיבור בשכבות ובפריסות אריחים

Web part של תוכן מסומן

16:9 הוא יחס הגובה-רוחב עבור מסחרחרת, סרט שקופיות ופריסות כרטיסים.

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

דוגמאות של תמונת web part של תוכן מסומן

Web part של תמונה

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

להלן דוגמה המציגה סימוני חיתוך של תמונה (קווים כחולים) ב-4:3

תמונה המציגה סימוני חיתוך ב-4:3

Web part של גלריית תמונות

יחסי הגודל הבאים משמשים בפריסות שונות:

  • פריסת לבנים מכבדת את יחס הגובה-רוחב של כל התמונות המוצגות: 16:9, 1:1, 4:3 וכן הלאה. 

  • אריחים, כרטיסים: 4:3

להלן דוגמה של תמונה המוצגת בפריסה ' אריחים ' (למעלה) ובפריסת הלבנים (למטה)

דוגמה של אריחים ופריסות לבנים עבור web part של גלריית תמונות

Web part של חדשות -

בהתאם לפריסה, תמונות ב-web part של חדשות יכולות להיות 4:3, 16:9 או 21:9. להלן דוגמה של תמונות בכתבה העליונה ובפריסת קרוסלה.

דוגמאות לתמונות של פריסות חדשות

אזור כותרת הדף

התמונות מתחפשות בצורה הטובה ביותר כאשר הן מתאימות לרוחב או ל-16:9, וכאשר הן בגודל של 1 MB לפחות. בנוסף, הקפד להגדיר נקודת מוקד לשמירה על החלק החשוב ביותר של התמונה בתצוגה, במיוחד כאשר התמונה נמצאת בשימוש בתמונות ממוזערות, בפריסות חדשות ובתוצאות חיפוש.

דוגמה (תמונה מקורית 16:9) עם ערכת נקודות מוקד ברמקול.

דוגמה של תמונת 16:9 באזור כותרת העמוד.

תמונה ממוזערת של עמוד

תמונות ממוזערות של עמודים מוצגות במקומות כגון תוצאות חיפוש, תוצאות תוכן מסומנות, רשומות חדשות ועוד. כברירת מחדל, התמונה הממוזערת מגיעה מאזור כותרת העמוד או מ-web part הנמצא בסדר הראשון בעמוד (כגון החלק הימני העליון של פריסת עמוד). ניתן לעקוף את ברירת המחדל ולשנות את התמונה הממוזערת של העמוד. כאשר תעשה זאת, מומלץ להשתמש בתמונה עם יחס גובה-רוחב של 16:9.

דוגמה (תמונה מקורית 16:9)

דוגמה של תמונה ממוזערת של עמוד ב-web part של תוכן מסומן

Web part של קישורים מהירים 

ה-web part של קישורים מהירים כולל שש פריסות שונות. להלן יחסי גודל מומלצים:

  • סרט שקופיות, רשת, לחצן: 16:9

  • דחוס, רשימה, אריחים: 1:1, 4:3

להלן דוגמה של תמונה המוצגת בפריסה קומפקטית (למעלה) ובפריסה של שקופיות (למטה)

דוגמאות של תמונות בפריסות של קישורים מהירים

עצות: 

המלצות על תמונה של כותרת האתר

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

רכיב

תיאור

המלצה

רוחב x גובה בפיקסלים

סמל האתר

סמל גדול יותר שעשוי להיות בלתי מרובע ושקוף בהתאם לעיצוב שהועלה

192 x 64 

עיצוב: PNG, JPEG, SVG (SVG אינם מותרים באתרים המחוברים לקבוצה)

תמונה ממוזערת של סמל אתר

תמונה ממוזערת של סמל ריבוע שנעשה בה שימוש אם אף סמל אתר אינו מועלה או מופיע במקומות שבהם נדרשת תבנית ריבוע

רכיב זה נדרש.

64 x 64 

עיצוב: PNG, JPEG, SVG (SVG אינם מותרים באתרים המחוברים לקבוצה)

סמל אתר פריסה מורחב

פריסת הכותרת המורחבת כוללת רוחב סמל אתר מורחב.

300 x 64p

עיצוב: JPEG, PNG, SVG

תמונת רקע של פריסה מורחבת

תמונת רקע חדשה שניתן להשתמש בה עם הכותרת המורחבת.

2560 x 164

עיצוב: JPEG, PNG

זקוק לעזרה נוספת?

מעוניין באפשרויות נוספות?

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

קהילות עוזרות לך לשאול שאלות ולהשיב עליהן, לתת משוב ולשמוע ממומחים בעלי ידע עשיר.

האם מידע זה היה שימושי?

עד כמה אתם מרוצים מאיכות השפה?
מה השפיע על החוויה שלך?
בלחיצה על 'שלח', אתה מאפשר למשוב שלך לשפר מוצרים ושירותים של Microsoft. מנהל ה-IT שלך יוכל לאסוף נתונים אלה. הצהרת הפרטיות.

תודה על המשוב!

×