אתר דו־לשוני בעברית ובאנגלית: כיוון, פונטים, כתובות ו־hreflang
איך בונים אתר בעברית ובאנגלית: RTL ו־LTR באותו קוד, פונטים לשני הכתבים, מספרים ותאריכים, טפסים, מבנה כתובות, hreflang, כתיבה לכל קהל ורשימת בדיקה.
מתוך המדריך: מדריך לבניית אתר לעסק: איך בונים אתר, שלב אחרי שלב
אתר דו־לשוני בעברית ובאנגלית הוא שני אתרים שחולקים עיצוב וקוד: כל שפה מקבלת כתובת משלה (למשל תיקיית /en/), כיוון כתיבה משלה (RTL לעברית ו־LTR לאנגלית), טקסטים שנכתבו לקהל שלה, וסימון hreflang שאומר למנועי החיפוש איזו גרסה שייכת לאיזו שפה. טפסים, מיילים אוטומטיים והודעות שגיאה צריכים להיות בשתי השפות, וכפתור ההחלפה צריך להוביל לאותו עמוד בשפה השנייה.
המאמר עובר על ההחלטות לפי הסדר: כיוון ופריסה, פונטים, מספרים ותאריכים, טפסים, מבנה הכתובות, hreflang, כתיבה, כפתור השפה ו־SEO לכל שפה, ומסיים ברשימת בדיקה. את המקום של השפות בתוך כל התהליך תיארנו במדריך המלא לבניית אתר לעסק.
אתר דו־לשוני או אתר מתורגם
אתר מתורגם לוקח את העמודים בעברית ומעביר אותם לאנגלית מילה במילה, לפעמים עם תוסף תרגום אוטומטי. אתר דו־לשוני מתחיל מהשאלה מה כל קהל צריך. לקוח ישראלי רוצה לדעת איפה אתם, אם יש חניה ואם אפשר לשלם בתשלומים. לקוח מחו״ל רוצה לדעת אם אתם עובדים עם לקוחות בינלאומיים, באיזה מטבע המחיר, ואיך מגיעים משדה התעופה. לכן לפעמים לגרסה האנגלית יש עמודים אחרים, סדר אחר או פחות עמודים, וזה בסדר.
כיוון כתיבה: RTL ו־LTR באותו אתר
לפי המלצות W3C לכיוון טקסט ב־HTML, את כיוון העמוד מגדירים ב־HTML ולא ב־CSS: dir="rtl" על תגית ה־html בעמודים בעברית, ו־dir="ltr" בעמודים באנגלית. באותו מקום מגדירים גם את שפת העמוד (lang="he" או lang="en"), שקוראי מסך משתמשים בה כדי לבחור הגייה.
CSS לוגי במקום ימין ושמאל
כשהעיצוב כתוב במונחים של ״התחלה״ ו״סוף״ במקום ״שמאל״ ו״ימין״, אותו קוד מתהפך לבד כשהכיוון משתנה. במקום margin-left כותבים margin-inline-start, ובמקום text-align: left כותבים text-align: start. זה חוסך קובץ עיצוב נפרד לכל שפה, ומונע את התקלה הקלאסית שבה משהו אחד נשאר בצד הלא נכון.
מה מתהפך ומה לא
- מתהפכים: הפריסה, התפריט, חיצים של ״הבא״ ו״הקודם״, מיקום אייקונים ליד טקסט, סליידרים וכיוון ההחלקה, טבלאות.
- לא מתהפכים: לוגו, תמונות וסרטונים, סמלים שיש להם משמעות קבועה (כמו כפתור הפעלה של וידאו), גרפים שציר הזמן שלהם משמאל לימין, מספרי טלפון ומספרים בכלל.
- טקסט מעורב: שם מותג באנגלית בתוך משפט בעברית, כתובת מייל או מספר הזמנה. כאן הדפדפן עושה רוב העבודה, אבל צריך לבדוק בעין, בעיקר סימני פיסוק בסוף משפט שמתחיל או נגמר באנגלית.
- שדות קלט: בשדות שהגולש כותב בהם, dir="auto" נותן לדפדפן לקבוע כיוון לפי התו הראשון, כך שמייל או שם באנגלית לא יוצגו הפוך בטופס בעברית.
פונטים שעובדים בעברית ובאנגלית
לא כל פונט שיש לו עברית נראה טוב גם באנגלית, ולהפך. יש שתי דרכים. הראשונה היא משפחת פונטים אחת שתוכננה לשני הכתבים, כך שהגובה, העובי והקצב תואמים. השנייה היא זוג: פונט עברי ופונט לטיני שנבחרו יחד, עם התאמה של גודל וגובה שורה, כי אותות עבריות נראות בדרך כלל קטנות יותר באותו גודל נקודות. בשני המקרים בודקים משפט מעורב, כותרת ארוכה ומספרים בשתי השפות, ומוודאים שיש רישיון לשימוש ברשת בשני הכתבים. פונט שנטען בכמה משקלים לכל כתב מכביד על הטעינה, ולכן בוחרים רק את המשקלים שבאמת בשימוש.
מספרים, תאריכים, מטבע וטלפונים
- תאריכים: בישראל כותבים יום/חודש/שנה; קהל אמריקאי קורא חודש/יום. בגרסה האנגלית עדיף לכתוב את שם החודש במילים, כך שאין דו־משמעות.
- מטבע: אם המחיר בשקלים גם בגרסה האנגלית, כותבים את זה במפורש. אם מציגים מטבע אחר, מציינים אם זה מחיר קבוע או המרה משוערת.
- טלפונים: בגרסה האנגלית מציגים את המספר בפורמט בינלאומי עם קידומת 972+, בלי האפס של הקידומת המקומית.
- שעות וימים: שבוע העבודה בישראל שונה מזה של רוב הלקוחות בחו״ל. שעות פתיחה ושעות מענה צריכות לציין אזור זמן.
- יחידות וכתובות: כתובת בעברית לא עוזרת לתייר. בגרסה האנגלית כותבים את הכתובת כפי שהיא מופיעה במפות, באותיות לטיניות.
טפסים, מיילים והודעות מערכת
זה החלק שהכי הרבה אתרים דו־לשוניים מפספסים: העמוד באנגלית, אבל הודעת השגיאה בטופס בעברית, מייל האישור מגיע בעברית, והודעת הוואטסאפ האוטומטית שנשלחת אחרי הפנייה בעברית. כל נקודת מגע צריכה לדעת באיזו שפה הגולש פנה. הדרך הפשוטה היא להעביר את שפת העמוד כשדה נסתר בטופס, ולשמור אותה ב־CRM, כך שגם מי שחוזר ללקוח יודע באיזו שפה לענות. אותו דבר חל על הצהרת הנגישות, מדיניות הפרטיות ותנאי השימוש: כולם צריכים גרסה בכל שפה.
מבנה כתובות: תיקייה, תת־דומיין או דומיין נפרד
גוגל מתארת במדריך לאתרים רב־לשוניים כמה אפשרויות, וממליצה להשתמש בכתובות שונות לגרסאות שפה שונות ולא להציג שפה לפי עוגייה או הגדרות דפדפן. ההשוואה בקצרה:
| מבנה | דוגמה | מה צריך לדעת |
|---|---|---|
| תיקייה | example.co.il/en/ | הכי פשוט להקים ולתחזק: אותו אחסון, אותו דומיין. הבחירה הנפוצה לעסק ישראלי עם גרסה באנגלית. |
| תת־דומיין | en.example.co.il | קל להפריד בין האתרים, למשל כשכל גרסה על מערכת אחרת. דורש מעט יותר הגדרות. |
| דומיין נפרד לכל מדינה | example.co.il ו־example.com | אות ברור לאיזו מדינה האתר מיועד, אבל יקר יותר לנהל, וכל דומיין בונה סמכות בנפרד. |
| פרמטר בכתובת | example.co.il/?lang=en | גוגל לא ממליצה עליו. קשה לפלח ולמדוד, ולא ברור לגולש. |
באותו מדריך גוגל ממליצה גם להימנע מהפניה אוטומטית של גולשים לגרסה אחרת לפי שפה או לפי מיקום ה־IP, ולתת קישור ברור לגרסאות האחרות. גולש ישראלי שגר בחו״ל, או תייר שמחפש בעברית, צריך לבחור בעצמו.
hreflang ו־x-default
hreflang הוא סימון שאומר לגוגל שהעמוד בעברית והעמוד באנגלית הם אותו עמוד בשתי שפות, כדי שכל קהל יראה את הגרסה שלו בתוצאות. לפי התיעוד של גוגל על גרסאות מקומיות, אפשר לסמן אותו בתגיות ב־HTML, בכותרות HTTP או במפת האתר, והכללים העיקריים הם:
- כל גרסה מפרטת את עצמה וגם את כל הגרסאות האחרות. אם העמוד בעברית מצביע על האנגלי והאנגלי לא מצביע חזרה, הסימון עלול להיות מוזנח.
- קודי שפה בפורמט ISO 639-1, למשל he ו־en, ואם צריך גם קוד מדינה, למשל en-GB.
- הערך x-default מסמן את הגרסה שתוצג כשאף שפה לא מתאימה לגולש, למשל עמוד בחירת שפה או הגרסה האנגלית.
עוד פרט מאותו תיעוד: גוגל לא מסתמכת על hreflang או על תכונת lang כדי לזהות באיזו שפה העמוד כתוב, אלא מזהה את השפה מהתוכן עצמו. לכן עמוד שבו חצי מהטקסט עדיין בעברית ייתפס כמעורבב, גם אם הסימון נכון. על אותו עיקרון גוגל ממליצה שפה אחת לתוכן ולניווט בכל עמוד.
לכתוב בכל שפה, לא לתרגם
תרגום מכונה הוא נקודת התחלה טובה לטיוטה, לא טקסט לפרסום. אנגלית שתורגמה מעברית נשמעת כמו תרגום: משפטים ארוכים, מונחים מקומיים בלי הסבר, והטון הלא נכון. הדרך שעובדת היא לכתוב בכל שפה לקהל שלה, מאותו מבנה ומאותן עובדות, עם כותב שהשפה היא שפת האם שלו או עריכה של אחד כזה. זה גם מה שעושה את ההבדל בחיפוש: מילות המפתח באנגלית הן לא תרגום של מילות המפתח בעברית, ולפעמים אין להן בכלל מקבילה.
כפתור החלפת השפה
- מופיע באותו מקום בכל עמוד, בדרך כלל בראש העמוד, וגם בתפריט בטלפון.
- כתוב בשם השפה עצמה: ״English״ בגרסה העברית ו״עברית״ בגרסה האנגלית. דגלים מייצגים מדינות, לא שפות.
- מוביל לאותו עמוד בשפה השנייה, לא לעמוד הבית. אם אין לעמוד גרסה מקבילה, מוביל לעמוד הקרוב ביותר.
- זוכר את הבחירה בניווט בתוך האתר, בלי להפנות אוטומטית בביקור הבא.
שלושה קונספטים שבנינו עם עסקים בדויים עובדים כך בשתי השפות: פלטפורמת הטיסות SKYLARK, אתר הקליניקה Névé ואתר המסעדה EMBER. בכולם הממשק מתהפך בין RTL ל־LTR באותו קוד, והטקסטים נכתבו לכל שפה. בדוגמאות ההחלפה נעשית באותה כתובת; באתר אמיתי כל שפה מקבלת כתובת משלה ו־hreflang, כמו שתיארנו למעלה.
SEO לכל שפה
כל גרסה צריכה מחקר מילות מפתח משלה, כותרות ותיאורי מטא משלה, כתובות קריאות בשפה שלה, ונתונים מובנים שמתארים אותה. בעברית יש גם בעיות שאין באנגלית, כמו כתיב מלא וחסר ויחיד מול רבים, שכתבנו עליהן במדריך לקידום אתרים אורגני. ב־Search Console בודקים כל שפה בנפרד, כדי לראות אם הגרסה האנגלית בכלל מופיעה ולאילו חיפושים.
גם הפלטפורמה משפיעה: יש מערכות שמטפלות בשפות, בכתובות וב־hreflang מהקופסה, ויש כאלה שדורשות תוסף או פיתוח. זה אחד השיקולים בהשוואה בין וורדפרס, וובפלואו ושופיפיי. ונגישות נבדקת בכל שפה בנפרד, כולל שפה וכיוון מסומנים נכון; ראו נגישות אתרים ותקן 5568.
רשימת בדיקה לאתר דו־לשוני
- לכל עמוד בכל שפה יש כתובת משלו, ו־lang ו־dir מוגדרים על תגית ה־html.
- hreflang הדדי בין כל הגרסאות, כולל הפניה עצמית, ו־x-default מוגדר.
- אין הפניה אוטומטית לפי IP או שפת דפדפן.
- העיצוב כתוב ב־CSS לוגי; חיצים, תפריטים וסליידרים מתהפכים; לוגו ותמונות לא.
- הפונטים נבדקו על משפט מעורב, כותרת ארוכה ומספרים בשתי השפות.
- תאריכים, מטבע, טלפונים וכתובות מותאמים לכל קהל.
- טפסים, הודעות שגיאה, מיילי אישור והודעות אוטומטיות קיימים בשתי השפות, ושפת הפנייה נשמרת ב־CRM.
- הטקסטים נכתבו או נערכו על ידי דובר השפה, לא רק תורגמו.
- כפתור השפה מוביל לאותו עמוד בשפה השנייה.
- כותרות, תיאורים ונתונים מובנים לכל שפה; כל שפה נבדקת בנפרד ב־Search Console.
- הצהרת נגישות, מדיניות פרטיות ותנאי שימוש בכל שפה.
אתר בשתי שפות, מההתחלה
ב־Libra אנחנו בונים אתרים, דפי נחיתה וחנויות בעברית ובאנגלית באותו קוד, עם RTL ו־LTR, כתובות ו־hreflang לכל שפה, וטקסטים שנכתבים לכל קהל ולא מתורגמים. מה נכלל בכל סוג אתר מתואר בעמוד אתרים, דפי נחיתה וחנויות.
אם אתם מתכננים אתר בשתי שפות, או רוצים להוסיף אנגלית לאתר קיים, שלחו בריף עם מי הקהל בכל שפה ומה הוא צריך למצוא. נחזור במייל עם כיוון, מחיר בכתב ותאריך.
לא נמצא מונח כזה.
שאלות נפוצות
איך בונים אתר בעברית ובאנגלית?
נותנים לכל שפה כתובת משלה, מגדירים lang ו־dir לכל עמוד, כותבים את העיצוב ב־CSS לוגי שמתהפך לבד, כותבים טקסטים לכל קהל, ומסמנים hreflang הדדי בין הגרסאות.
עדיף תיקייה /en/ או תת־דומיין?
לרוב העסקים תיקייה היא הפשוטה ביותר להקמה ולתחזוקה, כי היא על אותו דומיין ואחסון. תת־דומיין או דומיין נפרד הגיוניים כשהגרסאות רצות על מערכות שונות או מיועדות למדינות שונות.
מה זה hreflang?
סימון שאומר לגוגל שכמה עמודים הם אותו תוכן בשפות שונות, כדי שכל גולש יראה את הגרסה בשפה שלו. כל גרסה צריכה להצביע על עצמה ועל כל האחרות.
האם אפשר להשתמש בתרגום אוטומטי?
כטיוטה כן, לפרסום לא. טקסט מתורגם מכונה נשמע כמו תרגום, ומילות המפתח בכל שפה שונות, ולכן כדאי שדובר השפה יכתוב או יערוך.
האם כדאי להעביר גולשים אוטומטית לפי שפה?
גוגל ממליצה להימנע מהפניה אוטומטית לפי שפה או IP, ולתת במקום זאת קישור ברור לגרסאות האחרות.
כמה עולה להוסיף אנגלית לאתר קיים?
זה תלוי במספר תבניות העמוד, בכמה הקוד הקיים מוכן ל־LTR, ובכמות הטקסט שצריך לכתוב. שפה שנייה מוסיפה בדרך כלל חלק משמעותי לעבודה, לא אחוז קטן.
להתחיל
רוצים את זה לעסק שלכם?
שלחו בריף קצר: שלוש שאלות חובה, והשאר רק אם בא לכם. חוזרים במייל עם כיוון, מחיר ותאריך כתובים.
