עברית באפליקציה שנבנתה בכלי AI: למה היא מוצגת הפוך, ואיך מתקנים
בקצרה: כשעברית מוצגת הפוך באפליקציה שנבנתה בכלי AI, כמעט תמיד הסיבה היא שלא אמרו לדף, או לחלק ממנו, שהוא בעברית ושהכיוון שלו מימין לשמאל. הכלים בונים על רכיבים מוכנים שנכתבו קודם לאנגלית, ובתיעוד של חמשת הכלים שאנחנו מכסים לא מצאנו הגדרה שהופכת אפליקציה לעברית מימין לשמאל. התיקון לא דורש לתכנת: הנחיה אחת, במקום שהכלי זוכר, ובדיקה של עשר דקות בטלפון. כאן שישה סימנים שתזהו לבד, הסיבה לכל אחד (את רובם שחזרנו וצילמנו, לפני התיקון ואחריו), מה מצאנו בקוד של 68 אפליקציות בעברית שנבנו ב-Lovable וב-Base44, וההנחיה להדבקה.
שישה סימנים שאפשר לזהות לבד, בטלפון
פתחו את האפליקציה בטלפון, כמו לקוח, ועברו על המסכים העיקריים: דף הבית, טופס, חלון שנפתח מעל הדף (למשל אישור ביטול), ומסך עם תאריכים או מחירים. סמנו כל סימן שראיתם.
מה המספר אומר
-
אף סימן התוצאה שלכם
נראה שהעברית מוגדרת נכון
בדקו עוד שני דברים שלא רואים בעין: איך קורא המסך מקריא את הדף, ואיך נראים התאריכים בטלפון שהשפה שלו אנגלית. שניהם בבדיקה שבסוף המדריך.
-
סימן אחד או שניים התוצאה שלכם
תיקונים נקודתיים
לכל סימן יש סעיף משלו בהמשך, עם הסיבה והתיקון. מההנחיה המלאה אפשר להדביק רק את השורות שנוגעות לסימנים שסימנתם.
-
שלושה סימנים או יותר, או הסימן הראשון לבדו התוצאה שלכם
הדף כולו לא מוגדר כעברית
התחילו מהתיקון הראשון: שפת הדף והכיוון שלו. הוא לבדו פותר חלק גדול מהשאר. אחר כך הדביקו את ההנחיה המלאה, ובדקו שוב.
למה זה קורה: מה כתוב בתיעוד, ומה מצאנו ב-68 אפליקציות
שלושה דברים נפגשים כאן. הראשון הוא הדפדפן: הוא צריך לדעת באיזו שפה הדף ובאיזה כיוון. בלי זה הוא מניח אנגלית, משמאל לימין, ולפי זה מסדר גם את סימני הפיסוק. W3C, הארגון שקובע את תקני הרשת, ממליץ להגדיר את הכיוון פעם אחת, על הדף כולו[1].
השני הוא הרכיבים המוכנים. Lovable כותבת שהיא בונה ב-React ומעצבת ב-Tailwind CSS[2]. אצל Base44 נוספת לאלה ספריית הרכיבים shadcn/ui[3], וגם Emergent מונה אותם בממשק של האפליקציות שהיא בונה[4]. בכל 68 האפליקציות שבדקנו, הרכיבים האלה בנויים על ספרייה בשם Radix, שמניחה כיוון משמאל לימין עד שאומרים לה אחרת, גם כשהדף עצמו מוגדר מימין לשמאל[5][6]. shadcn/ui הוסיפה תמיכה מלאה בכתיבה מימין לשמאל רק בינואר 2026[8], וההמרה האוטומטית שלה חלה רק על פרויקטים שנוצרו בסגנונות החדשים שלה[7].
השלישי הוא הכלים עצמם. חיפשנו בתיעוד של חמשת הכלים. ב-Lovable, ב-Replit וב-Bolt אין אזכור לעברית או לכתיבה מימין לשמאל. ב-Base44, שיש לה תיעוד גם בעברית, מוסבר איך לשנות את שפת הדף בקוד, בלי מילה על הכיוון[9], ותמיכה בשפות מימין לשמאל מוזכרת רק לגבי מצגות[10]. Emergent כותבת שאפשר לבקש אפליקציה בכמה שפות, בלי פירוט על כיוון[4]. גם הממשק של Lovable עצמה זמין ב-11 שפות, ועברית לא ביניהן[11].
מה מצאנו בקוד של 68 אפליקציות בעברית
כדי לדעת מה קורה בפועל, ולא רק מה כתוב, בדקנו את הקוד של 68 אפליקציות בעברית שהבעלים שלהן פרסמו אותו ב-GitHub באופן ציבורי: 62 שנבנו ב-Lovable ו-6 ב-Base44. מצאנו אותן בחיפוש קוד ב-11 באוקטובר 2026, וזיהינו את הכלי לפי החבילות שהוא מוסיף לכל פרויקט. זה מדגם של מי שבחרו לפרסם את הקוד, לא של כל האפליקציות, ודפוס בקוד לא תמיד נראה על המסך. ועדיין, התמונה ברורה:
| מה בדקנו | כמה, ומה זה אומר |
|---|---|
| הדף כולו מוגדר עברית, מימין לשמאל | 49 מתוך 68. הבסיס במקום: ברוב המקרים, מי שביקש עברית קיבל לפחות את זה. |
| הדף עדיין מוגדר כאנגלית | 17 מתוך 68. המסך יכול להיראות תקין, אבל קורא מסך, תרגום אוטומטי ומנועי חיפוש מקבלים "אנגלית". |
| הכיוון נקבע רק על חלקים בתוך הדף | 17 מתוך 68. בכולן יש חלונות, תפריטים או הודעות שנפתחים מחוץ לחלקים האלה, ושם הכיוון חוזר להיות משמאל לימין. |
הרכיבים קיבלו את הכיוון (DirectionProvider) | אף אחת מ-68. בכולן יש רכיבי Radix, ובאף אחת לא נאמר להם שהאפליקציה מימין לשמאל. |
| תאריך או שעה מוצגים בלי לציין שפה | לפחות 11 מתוך 68. הפורמט תלוי בשפת הטלפון של הלקוח: בטלפון באנגלית, 3 בנובמבר יוצג כ-11/3/2026. |
מרווחים לפי כיוון (ms ו-me) ולא לפי צד (ml ו-mr) | רק 10 מתוך 68 משתמשות בהם. ברוב הקוד המרווחים נקבעו "משמאל" ו"מימין", והם לא מתהפכים בעברית. |
בידוד של טקסט שמגיע מבחוץ (bdi) | אף אחת מ-68. שם או ביקורת באנגלית בתוך משפט בעברית יכולים להזיז את הפיסוק סביבם. |
הבדיקה אוטומטית, על הקוד של כל אפליקציה כפי שהיה ב-GitHub ב-11 באוקטובר 2026, ואפליקציה נספרת אם הדפוס מופיע בה לפחות פעם אחת. לא נכנסנו לאף אפליקציה ולא פרסמנו את השמות שלהן.
תיקון 1: לומר לדף שהוא בעברית, ומימין לשמאל
זה התיקון שכל השאר נשען עליו. בראש כל דף יש תג אחד, html, ושתי הגדרות שלו קובעות הכל: lang=he אומרת שהשפה עברית, ו-dir=rtl אומרת שהכיוון מימין לשמאל. W3C ממליץ להגדיר את הכיוון בדיוק שם, על התג הזה, ולא בעיצוב[1].
ב-Base44 התיעוד מסביר לשנות את השפה בקובץ index.html, בלשונית Code[9], ואת הכיוון מוסיפים באותו מקום. בכל הכלים אפשר פשוט לבקש את זה מה-AI, במילים, כמו בהנחיה שבהמשך.
למה זה עניין של נגישות, ולא רק של מראה
קורא מסך, התוכנה שמקריאה את המסך לאנשים עיוורים או לקויי ראייה, טוען את כללי ההגייה לפי השפה שהדף מצהיר עליה[12]. לכן זה קריטריון 3.1.1 בהנחיות הנגישות הבינלאומיות, WCAG: את שפת הדף צריך להגדיר כך שתוכנה תוכל לזהות אותה[12]. בישראל, תקנות הנגישות מחייבות שירות אינטרנט שניתן לציבור, כמו אתר או אפליקציה שנפתחת בדפדפן, לעמוד בתקן הישראלי 5568 ברמה AA. לאפליקציות שמתקינים בטלפון יש בתקנות הוראה נפרדת[13]. לפי W3C, התקן הישראלי נשען על WCAG 2.0 ברמה AA[14]. מה החוק דורש מהעסק שלכם בודקים עם מי שמתמחה בזה. כאן אנחנו רק מראים איפה הדרישה פוגשת את העברית.
תיקון 2: חלונות, תפריטים ורכיבים שנשארים משמאל לימין
גם כשהדף עצמו תקין, שני דברים יכולים להחזיר חלקים ממנו לאנגלית. הראשון הוא כיוון שנקבע רק על אזור בתוך הדף. חלון שנפתח מעל הדף, תפריט נפתח או הודעה קופצת נבנים בדרך כלל בקצה הדף, מחוץ לאזור הזה, ולכן לא מקבלים את הכיוון שלו. כך היה ב-17 מהאפליקציות שבדקנו.
השני הוא הרכיבים המוכנים עצמם. Radix מבקשת לעטוף אפליקציה מימין לשמאל ברכיב בשם DirectionProvider, כדי שכל הרכיבים שלה יתאימו את ההתנהגות שלהם[5]. בלי העטיפה הם מתנהגים כמו באנגלית[6], גם בדף שמוגדר מימין לשמאל. אף אחת מ-68 האפליקציות לא עטפה.
DirectionProvider הלשוניות מתהפכות והמחוון מתמלא מהצד הלא נכון. שחזור בדף ניסיון.
(צולם ב-)
למי שעובד עם מפתח: shadcn/ui מציעה מאז ינואר 2026 פקודה שממירה רכיבים שכבר הותקנו לכתיבה מימין לשמאל[8], וכותבת שלוח השנה, המעבר בין עמודים (Pagination) וסרגל הצד דורשים התאמה ידנית[7].
תיקון 3: טלפונים, שמות באנגלית וטקסט מעורב
בעברית משולבים כל הזמן מספרים, שמות באנגלית, כתובות מייל וקודים. הדפדפן מסדר כל רצף כזה לפי כללים קבועים, וסימנים שאין להם כיוון משלהם, כמו פלוס, נקודתיים או סימן קריאה, מצטרפים לרצף שלידם. טקסט שכתוב בקוד מראש אפשר לסדר פעם אחת. טקסט שמגיע מבחוץ, כמו שם של לקוח או ביקורת שהוא כתב, צריך לבודד.
- טקסט שמגיע מבחוץ (שם, ביקורת, שם של מוצר) עוטפים ברכיב
bdi, או מגדירים לוdir=auto. זו ההמלצה של W3C כשלא יודעים מראש באיזה כיוון יהיה הטקסט[15]. - מספר טלפון, מספר הזמנה או קוד מציגים בתוך אזור שמוגדר משמאל לימין.
- בשדות שהלקוחות מקלידים בהם, W3C ממליץ על
dir=auto, כדי שהשדה יתיישר לפי מה שמקלידים בו ולא יקפיץ סימנים בזמן ההקלדה[1].
תיקון 4: מרווחים, אייקונים וחצים
מרווח שנקבע "משמאל" נשאר משמאל גם בעברית. בכפתור עם אייקון, המרווח שהיה אמור להפריד בין האייקון למילה עובר לצד החיצוני, והאייקון נצמד למילה. Tailwind CSS, שבה הכלים מעצבים, תומכת מאז גרסה 3.3 במרווחים לפי כיוון, "בהתחלה" ו"בסוף" במקום "משמאל" ו"מימין", שמתהפכים לבד בעברית[16]. ב-58 מתוך 68 האפליקציות שבדקנו לא מצאנו בהם שימוש בכלל.
לא כל אייקון מתהפך. אייקון שמראה כיוון, כמו חץ של הבא, הקודם או חזרה, מתהפך. אייקון שלא מראה כיוון, כמו חיפוש, פח או לוגו של מותג, נשאר כמו שהוא. shadcn/ui הופכת לבד את האייקונים שהיא מכירה[7], ואת השאר כדאי לבדוק בעין.
תיקון 5: תאריכים, שעות ומחירים
תאריך שמוצג בלי לציין שפה מקבל את הפורמט של השפה שמוגדרת בטלפון או במחשב של הלקוח. לקוח ישראלי שהטלפון שלו באנגלית יראה את 3 בנובמבר כ-11/3/2026, ויקרא את זה כ-11 במרץ. בדקנו את זה במנועי הדפדפן של Chrome ושל Safari, והתוצאה זהה בשניהם:
| מה כתוב בקוד | באנגלית | בעברית |
|---|---|---|
| תאריך בלי שפה | 11/3/2026 | 3.11.2026 |
| שעה בלי שפה | 2:30:00 PM | 14:30:00 |
| תאריך בעברית | 3.11.2026 | 3.11.2026 |
| תאריך מלא בעברית | יום שלישי, 3 בנובמבר 2026 | יום שלישי, 3 בנובמבר 2026 |
| מחיר בשקלים | 1,234.50 ₪ | 1,234.50 ₪ |
| מחיר בדולרים | $1,234.50 | $1,234.50 |
התאריך: 3 בנובמבר 2026, 14:30. המחיר: 1,234.50. הדפדפן באנגלית מוגדר לאנגלית של ארה״ב. בשורות "בעברית" שבעמודה הראשונה כתוב בקוד he-IL, ובשורת השקלים גם המטבע ILS. נמדד ב-11 באוקטובר 2026 במנועי הדפדפן Chromium (של Chrome) ו-WebKit (של Safari), באזור הזמן של ישראל.
התיקון: בכל מקום שמוצגים בו תאריך, שעה או מחיר, לציין בקוד את השפה העברית (he-IL) ואת המטבע (ILS). ב-13 מתוך 68 האפליקציות שבדקנו נקבע במקום כלשהו פורמט אמריקאי (en-US) במפורש, ובמקומות האלה תאריך או מספר יוצגו בפורמט אמריקאי גם בטלפון בעברית.
תיקון 6: גופן שיש בו אותיות עבריות
לא בכל גופן יש אותיות עבריות. כשהגופן שנבחר לאפליקציה לטיני בלבד, הדפדפן משלים את העברית מגופן אחר שמותקן במכשיר, והתוצאה משתנה ממכשיר למכשיר: באותה שורה העברית בסגנון אחד והאנגלית בסגנון אחר. ב-Lovable בוחרים גופן בהנחיה, לפי השם שלו[17]. ב-Base44 בוחרים או מעלים גופן בלשונית Fonts שבחלונית Theme[18].
באפליקציות שבדקנו, הגופנים העבריים הנפוצים היו Heebo (ב-36 מתוך 68), Rubik ו-Assistant. איזה גופן שתבחרו, בדקו בתצוגה המקדימה שהעברית והאנגלית באותה שורה נראות כמו משפחה אחת.
ההנחיה המלאה, להדבקה במקום שהכלי זוכר
הנחיה שכותבים פעם אחת בצ׳אט, הכלי עלול לשכוח בבנייה הבאה. ברוב הכלים יש מקום להוראות קבועות, שהכלי קורא לפני כל שינוי. הדביקו שם את ההנחיה, ואחר כך בקשו פעם אחת בצ׳אט: "עבור על כל האפליקציה ותקן אותה לפי ההוראות הקבועות".
| כלי | איפה |
|---|---|
| Lovable | ב-Knowledge: ידע קבוע לפרויקט, או לכל הפרויקטים בסביבת העבודה[19] |
| Base44 | ב-Custom Instructions, תחת סמל האפשרויות הנוספות שליד הכפתור Build בצ׳אט. ההוראות חלות על כל פנייה באפליקציה[20] |
| Replit | בקובץ replit.md, בתיקייה הראשית של הפרויקט. הסוכן של Replit יוצר אותו בעצמו וקורא אותו כדי להבין את ההעדפות שלכם[21] |
| Bolt | ב-Knowledge בהגדרות הפרויקט[22], או בהגדרות החשבון לכל הפרויקטים[23] |
| Emergent | בתיעוד שקראנו לא מצאנו מקום להוראות קבועות. הסוכן קורא את כל היסטוריית השיחה[24], ולכן כתבו את ההנחיה בתחילת השיחה, וחזרו עליה כשאתם מבקשים מסך חדש |
וזו ההנחיה. אפשר להדביק אותה כמו שהיא, בעברית:
ההנחיה להדבקה
1. האפליקציה כולה בעברית ומימין לשמאל. בתג html של index.html הגדר lang=he ו-dir=rtl, ואל תקבע את הכיוון בעיצוב או על אזור פנימי בלבד.
2. עטוף את כל האפליקציה ב-DirectionProvider של Radix עם כיוון rtl, כדי שתפריטים, חלונות, לשוניות ומחוונים יעבדו מימין לשמאל. אם אין באפליקציה רכיבי Radix, דלג על הסעיף הזה.
3. השתמש במרווחים ובמיקומים לפי כיוון (ms, me, ps, pe, start, end, text-start) במקום לפי צד (ml, mr, pl, pr, left, right, text-left).
4. הפוך אייקונים שמראים כיוון, כמו חצים של הבא, הקודם וחזרה. אייקונים שלא מראים כיוון השאר כמו שהם.
5. עטוף ב-bdi כל טקסט שמגיע מהמשתמשים או מהנתונים (שמות, ביקורות, שמות של מוצרים), והצג מספרי טלפון, מספרי הזמנה וקודים בתוך אזור עם dir=ltr. בשדות קלט הגדר dir=auto.
6. הצג תאריכים, שעות ומספרים בשפה he-IL, ומחירים במטבע ILS, בכל מקום. אל תשאיר תאריך או שעה בלי שפה.
7. השתמש לכל הטקסט בגופן שיש בו אותיות עבריות ולטיניות, למשל Heebo או Assistant.
8. אל תשנה תוכן, נתונים או התנהגות. רק כיוון, מרווחים, אייקונים, פורמטים וגופן.
שימו לב
שינוי כזה נוגע בהרבה מסכים בבת אחת. לפני ששולחים, ודאו שאתם יודעים איך לחזור לגרסה הנוכחית (במדריך הגיבוי והשחזור מוסבר איך בכל כלי). אחרי, עברו שוב על ששת הסימנים ועל התהליכים החשובים, כמו הרשמה, הזמנה ותשלום, בטלפון ובמחשב.
איך בודקים שזה תוקן: עשר דקות
-
עברו שוב על ששת הסימנים, בטלפון
אותם מסכים כמו בהתחלה, וגם חלון אחד שנפתח, תפריט אחד ומסך עם תאריכים. אם יש באפליקציה משתמשים, צרו משתמש בדיקה עם שם באנגלית, ובדקו איך השם מוצג בתוך משפט בעברית.
-
הקשיבו לדף
הפעילו את קורא המסך המובנה בטלפון (VoiceOver באייפון, TalkBack באנדרואיד) ותנו לו להקריא את הכותרת ואת הכפתורים. בדקו שהעברית מוקראת בעברית, ושהקורא עובר על הכפתורים מימין לשמאל, באותו סדר שבו הם על המסך.
-
החליפו לכמה דקות את שפת הטלפון לאנגלית
ופתחו שוב את המסכים עם תאריכים, שעות ומחירים. אם משהו השתנה, נשאר בקוד תאריך או מחיר בלי שפה. אחר כך החזירו את השפה.
ואם אתם מתכננים לעבור לתשתית משלכם
כל התיקונים כאן נמצאים בקוד, ולכן הם עוברים עם המערכת. אם אתם כבר מתכננים מעבר, אין סיבה לחכות: תיקון עכשיו משפר את מה שהלקוחות רואים היום, ואחרי המעבר בודקים אותו שוב, כמו כל מסך אחר. מה עוד עובר במעבר, ומה אפשר להכין כבר עכשיו, מפורט במה עובר במעבר. ואם אתם מתלבטים אם לתקן בכלי, להישאר בו או לעבור, ההשוואה בין שלוש הדרכים עוזרת להחליט.
איך הכנו את המדריך
שחזרנו כל תקלה במדריך בדף ניסיון שבנינו לשם כך, עם אותם רכיבים שהכלים משתמשים בהם וללא נתוני לקוחות, וצילמנו אותה לפני התיקון ואחריו. את התאריכים והמחירים מדדנו בשני מנועי דפדפן, ואת 68 האפליקציות מצאנו בחיפוש קוד ציבורי ב-GitHub ובדקנו בסריקה אוטומטית. כל עובדה על כלי לקוחה מהתיעוד הרשמי שלו: לא בנינו אפליקציה בתוך הכלים עצמם, ולכן הבדיקה מולם היא מול התיעוד בלבד. כלי AI עזרו במחקר ובניסוח, ותומר גל אחראי לתוכן.
נבדק מול התיעוד הרשמי ב-.
מקורות
- Structural markup and right-to-left text in HTML
- Glossary
- App code: introduction
- FAQs
- Direction Provider
- direction.tsx (useDirection falls back to "ltr")
- RTL
- January 2026 - RTL Support
- הופעת האפליקציה שלך בחיפוש: כיצד אני מגדיר את שפת האפליקציה שלי עבור דפדפנים ומנועי חיפוש?
- Building a presentation
- Changelog: choose the language Lovable uses
- Understanding Success Criterion 3.1.1: Language of Page
- תקנות שוויון זכויות לאנשים עם מוגבלות (התאמות נגישות לשירות), התשע"ג-2013: תקנות 35, 35א ו-35ג
- Web Accessibility Laws & Policies: Israel
- Inline markup and bidirectional text in HTML
- Tailwind CSS v3.3: simplified RTL support with logical properties
- Use custom fonts
- Customizing the design of your app: Fonts
- Define workspace and project knowledge
- Using the AI Chat in Base44: Adding custom instructions
- replit.md
- Project settings: Knowledge
- Account settings: Knowledge
- A tour of the workspace
שאלות על עברית וכיוון באפליקציה שנבנתה בכלי AI
לא מצאתם תשובה? פשוט תשאלו אותנואפשר לבנות ב-Lovable אפליקציה בעברית, מימין לשמאל?
יש ב-Base44 הגדרה לעברית?
למה מספר הטלפון מוצג עם הפלוס בסוף?
כי לפלוס אין כיוון משלו, ובשורה בעברית הוא מצטרף לעברית שלידו ולא למספר. התיקון הוא להציג את המספר בתוך אזור שמוגדר משמאל לימין, או לבודד אותו. בצילום שבסעיף טלפונים וטקסט מעורב רואים את זה לפני התיקון ואחריו.
עברית שמוצגת הפוך היא גם בעיית נגישות?
צריך לדעת לתכנת כדי לתקן?
לא. את כל התיקונים במדריך מבקשים מה-AI של הכלי, במילים, וההנחיה המלאה מוכנה להדבקה. מה שכן צריך הוא לבדוק אחר כך בעין, בטלפון, את ששת הסימנים. מי שעובד עם מפתח יכול לבקש ממנו גם את פקודת ההמרה של shadcn/ui לרכיבים שכבר הותקנו[7].