מדריך וויקס למתחילים · פרק המקטעים

מקטעים ופריסה — איך בונים עמוד מסודר במקום פזורת אלמנטים

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

7 דק׳ זמן קריאה · עודכן אוגוסט 2026

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

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

בקצרה

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

מה זה מקטע ולמה כל עמוד בנוי מהם

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

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

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

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

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

  • מוסיפים מקטע בעורך יש כפתור Add Section (הוספת מקטע) שמופיע בין מקטע למקטע כשמרחפים עם העכבר על הגבול ביניהם. לחיצה עליו פותחת מבחר של פריסות-מקטע מוכנות — פתיחה, גלריה, טופס, המלצות — ואתם בוחרים את זו שהכי קרובה למה שאתם צריכים.
  • משכפלים מקטע קיים אם כבר יש לכם מקטע שאתם אוהבים — סמנו אותו ובחרו Duplicate (שכפול). נוצר עותק זהה ממש מתחתיו, עם אותו ריווח, אותו יישור ואותם צבעים. זו הדרך המהירה ביותר לשמור על אחידות: משכפלים ומחליפים תוכן, במקום לבנות מקטע חדש שנראה קצת אחרת.
  • משנים את הסדר כשמסמנים מקטע מופיעים חצים למעלה ולמטה (או אפשר לגרור). מזיזים את המקטע השלם למעלה או למטה בערימה — וכל האלמנטים שבתוכו נעים איתו כגוש אחד.
קיצור-דרך אל תבנו מקטע חדש כשאתם צריכים אחד שדומה לקיים. שכפלו את הקיים והחליפו רק את הטקסט והתמונה. כך כל המקטעים בעמוד שומרים על אותו "קצב" ויזואלי, והעמוד נראה מתוכנן ולא מורכב מחתיכות.

ריווח, יישור וגבולות — מה שומר על עמוד מסודר

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

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

יישור הוא הקו-המדומה שהאלמנטים "נשענים" עליו. כשכותרת, פסקה וכפתור מתחילים כולם מאותו קו — העין קולטת סדר גם בלי לחשוב על זה. כשכל אחד מתחיל במקום אחר, זה מרגיש רשלני גם אם התוכן מצוין. וויקס מציג קווי-עזר (Snap lines) שקופצים כשאלמנט מתיישר עם שכניו — שימו לב אליהם.

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

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

מה קורה למקטע כשעוברים לטלפון

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

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

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

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

סדר המקטעים בעמוד הבית — מה קודם ומה אחרון, ולמה הכיוון קובע

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

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

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

  • מקטע פתיחה — מי אתם + הצעת-הערך + כפתור בולט (בצד ימין).
  • על העסק — הסבר קצר שבונה הקשר.
  • שירותים / מוצרים — מה אתם מציעים, ברור ומחולק.
  • אמון — המלצות, ניסיון, לקוחות.
  • יצירת קשר — טלפון, טופס, כפתור — למי שהשתכנע.
דוגמה מספרה בפתח-תקווה בונה עמוד בית: מקטע עליון עם תמונת-סלון וכותרת "תספורת שתרצו לחזור אליה" וכפתור Book Now בצד ימין. מתחת — מקטע שירותים (תספורת, צבע, טיפולים). מתחת — מקטע המלצות. בתחתית — מקטע קשר עם טלפון וטופס. עברו לטלפון, ווידאו שהכותרת מופיעה לפני התמונה, ושהכפתור לא נדחק לתחתית המקטע.

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

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

מקורות

נכון ל-11/08/2026.

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