אתר או דף נחיתה מקצועי בעברית תוך שעה — בלי קוד, בלי מעצב

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

המדריך הזה מיועד לכם אם אתם:

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

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

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

שלב 0: להחליט מה הדף צריך לעשות (5 דקות)

הטעות הראשונה של רוב האנשים היא לפתוח את הצ’אט ולכתוב “תבנה לי אתר”. התוצאה תמיד תהיה גנרית, כי המודל לא יודע מה אתם מוכרים ולמי.

לפני שנוגעים בכלי AI, ענו לעצמכם על שלוש שאלות במשפט אחד כל אחת:

1. מי הגולש? (“אמהות לילדים בגיל הגן באזור השרון”, לא “כולם”).
2. מה הפעולה האחת שאתם רוצים שהוא יעשה? (להשאיר טלפון, להירשם, לשלוח וואטסאפ, לקנות).
3. למה שיעשה את זה דווקא אצלכם? (ניסיון, מחיר, מיקום, גישה ייחודית).

דף נחיתה טוב הוא לא אתר שלם. הוא דף אחד עם חמישה בלוקים, בסדר הזה:

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

אם יש לכם את שלוש התשובות ואת המבנה הזה בראש, שאר השעה תזרום.

שלב 1: לייצר את הטקסטים לפני העיצוב (10 דקות)

זה הטיפ שחוסך הכי הרבה זמן ושרוב המדריכים מדלגים עליו: קודם טקסט, אחר כך עיצוב. כשמבקשים מהמודל לבנות דף ולהמציא את התוכן באותה בקשה, הוא ממלא את הדף בטקסט מזויף (“Lorem ipsum” או משפטים ריקים כמו “אנחנו מובילים בתחומנו”). אחר כך תבזבזו חצי שעה על החלפת טקסטים בתוך קוד.

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

אני בונה דף נחיתה בעברית. הנה הפרטים:

העסק: [סטודיו ליוגה בהרצליה]
קהל היעד: [נשים בגילאי 30-50 שמחפשות שקט ותנועה אחרי יום עבודה]
הפעולה שאני רוצה שיעשו: [להירשם לשיעור ניסיון בחינם דרך טופס]
מה מייחד אותי: [קבוצות קטנות של עד 8, מורה עם 15 שנות ניסיון, מיקום 3 דקות מהרכבת]
המלצות אמיתיות שיש לי: [הדביקו 2-3 משפטים מלקוחות]

כתבי לי את כל הטקסטים לדף, בעברית טבעית ומדוברת, לא שיווקית מוגזמת:
1. כותרת ראשית (עד 8 מילים) + תת-כותרת (משפט אחד)
2. פסקת "הבעיה" (3 משפטים בגוף שני)
3. פסקת "הפתרון" (3 משפטים)
4. 4 יתרונות, כל אחד: כותרת של 2-4 מילים + משפט הסבר
5. טקסט לכפתור הקריאה לפעולה (2-3 מילים)
6. שאלות ותשובות: 4 שאלות שלקוח מהסס באמת שואל

אל תמציאי נתונים או מספרים שלא נתתי לך. אם חסר לך מידע, שאלי אותי.

שימו לב לשורה האחרונה. בלעדיה, המודל ימציא לכם “מעל 500 לקוחות מרוצים” ואתם עלולים להעלות את זה לאוויר בלי לשים לב. תבקשו תמיד שישאל במקום שימציא.

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

שלב 2: הפרומפט שבונה את הדף (15 דקות)

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

• Claude מציג את הדף בתצוגה מקדימה חיה בצד השיחה (Artifacts), כך שרואים כל שינוי מיד. לדעתנו הנוח ביותר למתחילים.
• ChatGPT כותב קוד טוב ומאפשר לערוך אותו בחלון Canvas. את התצוגה המקדימה תצטרכו לפתוח בעצמכם, וזה לוקח עשר שניות (מיד נסביר איך).
• Gemini מייצר קוד באיכות דומה ומתאים אם אתם כבר עובדים בסביבת Google.

זה הפרומפט. העתיקו אותו כמו שהוא, ובסוף הדביקו את הטקסטים משלב 1:

בנה לי דף נחיתה כקובץ HTML אחד ויחיד, עם כל ה-CSS בתוך הקובץ, בלי קבצים חיצוניים ובלי ספריות JavaScript.

דרישות טכניות (חובה):
- השפה עברית: lang="he" ו-dir="rtl" על תגית ה-html
- גופן עברי מ-Google Fonts: Heebo או Assistant, עם fallback ל-Arial
- Mobile-first: הדף חייב להיראות מצוין ברוחב 375 פיקסל לפני שהוא נראה טוב במחשב
- כפתורים בגובה 48 פיקסל לפחות, קלים ללחיצה באצבע
- ניגודיות צבעים גבוהה, טקסט גוף בגודל 18px לפחות
- בלי אנימציות מיותרות, בלי אפקטים שמכבידים

עיצוב:
- צבע ראשי: [#2D6A4F ירוק עמוק] וצבע משני: [#F1FAEE קרם בהיר]
- סגנון: [נקי, מרווח, הרבה אוויר לבן, כמו אתר של סטודיו סקנדינבי]
- לא לשים תמונות סטוק. במקום תמונות, השאר קופסאות placeholder אפורות עם טקסט "תמונה: [תיאור]" שאחליף אחר כך

מבנה הדף לפי הסדר:
1. Hero עם כותרת, תת-כותרת וכפתור ראשי שגולל לטופס
2. סקשן "הבעיה"
3. סקשן "הפתרון"
4. 4 יתרונות בגריד (2x2 בנייד, 4 בשורה במחשב)
5. המלצות, 3 כרטיסים
6. שאלות ותשובות בפורמט אקורדיון (אפשר עם details/summary בלי JavaScript)
7. טופס עם שדות: שם, טלפון, הודעה חופשית, וכפתור שליחה
8. פוטר עם טלפון, כתובת וקישור לוואטסאפ

הנה הטקסטים המדויקים, השתמש בהם מילה במילה, אל תשנה ואל תוסיף:
[הדביקו כאן את כל הטקסטים משלב 1]

כמה דברים בפרומפט שווה להבין, כי הם ההבדל בין “עובד” ל“מקצועי”:

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

“בלי ספריות JavaScript” — מודלים אוהבים להוסיף ספריות חיצוניות שנטענות מהאינטרנט. הן שוברות את הדף כשהכתובת משתנה, ומאטות את הטעינה. לדף נחיתה פשוט הן מיותרות לחלוטין.

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

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

איך רואים את התוצאה? ב-Claude היא מופיעה לבד. ב-ChatGPT או Gemini: לחצו על “העתק קוד”, פתחו את פנקס הרשימות (Notepad בווינדוס, TextEdit במק לאחר מעבר למצב טקסט רגיל), הדביקו, ושמרו בשם index.html. לחיצה כפולה על הקובץ תפתח אותו בדפדפן. זהו. זה כל “הקוד” שתגעו בו.

שלב 3: הבעיות שהאנגלית של המודל לא מכירה

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

מספרי טלפון הפוכים. בטקסט שעובר מימין לשמאל, מספר כמו 050-1234567 לפעמים מוצג עם המקפים במקום הלא נכון. הפתרון: בקשו “עטוף כל מספר טלפון ב-span עם dir=‘ltr’”.

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

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

כפתור וואטסאפ שלא עובד. הפורמט הנכון הוא https://wa.me/972501234567 — קידומת בינלאומית, בלי אפס מוביל, בלי מקפים. המודל לפעמים כותב את המספר בפורמט ישראלי וזה לא יפתח שיחה.

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

פרומפט תיקון מרוכז שאפשר לשלוח מיד אחרי הגרסה הראשונה:

עבור על הדף ותקן בעיות RTL:
1. כל מספרי הטלפון ב-span עם dir="ltr"
2. חצים ואייקונים כיווניים הפוכים לכיוון עברית
3. כל הטקסט בכרטיסים וברשימות מיושר לימין
4. קישור הוואטסאפ בפורמט wa.me עם קידומת 972 ובלי אפס מוביל
5. ודא שה-padding בצד ימין ושמאל של הסקשנים סימטרי
החזר את הקובץ המלא המעודכן.

שלב 4: לבקש שינויים כמו מקצוענים (10 דקות)

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

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

כלל שני: תארו מה אתם רואים, לא מה אתם חושבים שהבעיה. במקום “ה-CSS של ה-hero לא בסדר” (שאתם לא באמת יודעים), כתבו: “בנייד, הכותרת הראשית נחתכת בצד ימין ולא רואים את המילה האחרונה”. המודל מבין תיאורים ויזואליים מצוין.

כלל שלישי: בקשו את הקובץ המלא. אחרי כמה סיבובים, מודלים נוטים להחזיר רק “את החלק שהשתנה”. זה נהדר למתכנתים ומבלבל לכל אחד אחר. סיימו כל בקשה ב“החזר את הקובץ המלא”.

דוגמאות לבקשות שעובדות טוב:

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

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

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

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

טיפ שמעטים מכירים: אחרי שיש לכם דף שאתם מרוצים ממנו, בקשו מהמודל “תבדוק את הדף שבנית כאילו אתה מבקר UX קפדן ותציין 5 בעיות”. תופתעו כמה הוא מוצא בעבודה של עצמו, ואז תבקשו לתקן רק את מה שנראה לכם רלוונטי.

שלב 5: טופס שבאמת מגיע אליכם, ותמונות אמיתיות (10 דקות)

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

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

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

אופציה 2: טופס Google מוטמע. צרו טופס ב-Google Forms, לחצו “שלח” ובחרו באפשרות הטמעה (הסימן <>), העתיקו את הקוד, ובקשו מהמודל להחליף את הטופס שלו בקוד שהדבקתם. התשובות יגיעו לגיליון Google. לא הכי יפה, אבל עובד תוך שתי דקות.

אופציה 3: שירות טפסים. יש שירותים שנותנים לכם כתובת מיוחדת: אתם מכניסים אותה לשדה ה-action של הטופס, והם שולחים לכם כל שליחה למייל. חפשו “form backend” או “form endpoint” בכלי ה-AI ותקבלו רשימה עדכנית. ברוב השירותים יש מסלול חינמי שמספיק לעשרות פניות בחודש.

תמונות. החליפו את ה-placeholders בתמונות שלכם. שתי דרכים: או שתעלו את התמונות לאותה תיקייה שבה נמצא הקובץ ותבקשו מהמודל “החלף את ה-placeholder הראשון בתמונה בשם hero.jpg שנמצאת באותה תיקייה”, או שתשתמשו בתמונות שיצרתם בכלי AI (יש לנו על זה מדריך נפרד ב-/guides). בכל מקרה, כווצו את התמונות לפני ההעלאה: תמונה של 4 מגה מהטלפון תהפוך דף מהיר לדף שנטען שמונה שניות.

שלב 6: להעלות לאוויר בחינם (10 דקות)

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

גרירה ושחרור (Netlify Drop וכדומה). יש שירותי אחסון שמציעים דף שבו אתם גוררים תיקייה עם index.html ומקבלים כתובת חיה תוך שניות. זו הדרך המהירה ביותר. הכתובת תיראה משהו כמו שם-אקראי.netlify.app, ואפשר לשנות אותה בהגדרות.

GitHub Pages. דורש פתיחת חשבון ב-GitHub וכמה קליקים יותר, אבל נותן כתובת יציבה ואפשרות לעדכן את הדף בקלות. אם תלכו בדרך הזו, בקשו מהמודל “תסביר לי צעד-צעד איך להעלות קובץ HTML אחד ל-GitHub Pages, בלי להשתמש בשורת פקודה”. הוא ידע.

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

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

טעויות נפוצות

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

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

להשאיר את ה-placeholders. יותר דפים ממה שתאמינו עלו לאוויר עם קופסה אפורה שכתוב עליה “תמונה: צוות הסטודיו”. עברו על הדף פעם אחרונה ממש לפני הפרסום.

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

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

לא לשמור גרסאות. לפני כל סיבוב שינויים גדול, שמרו את הקובץ בשם חדש (index-v2.html). כשהמודל שובר משהו, ותמיד בסופו של דבר הוא שובר, יש לכם לאן לחזור.

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

סיכום וצ’קליסט התחלה

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

צ’קליסט לשעה שלכם:

• כתבתי במשפט אחד: מי הגולש, מה הפעולה, למה אצלי
• יצרתי את הטקסטים בשיחה נפרדת, ובדקתי שאין בהם נתונים מומצאים
• הרצתי את פרומפט הבנייה עם דרישות RTL, גופן עברי ו-mobile-first
• העברתי את פרומפט תיקוני ה-RTL (טלפונים, חצים, וואטסאפ, יישור)
• ביקשתי תיקונים אחד-אחד, וכל פעם “החזר את הקובץ המלא”
• החלפתי את הטופס בפתרון שבאמת מגיע אליי (וואטסאפ / Google Forms / שירות טפסים)
• החלפתי את כל ה-placeholders בתמונות אמיתיות ומכווצות
• העליתי לאוויר ובדקתי בטלפון אמיתי, כולל שליחת טופס ניסיון
• שני אנשים שלא מכירים את העסק הבינו תוך 10 שניות מה אני מציע

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