חזרה לעמוד הקודם

פרק 4: בנייה וניהול אתר דו לשוני

נכתב ע"י כמיל סלבאק

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

השפה לדוגמא לא משפיעה רק על הטקסט, היא משפיעה על כל מה שהטקסט נוגע בו, וגם על מה שאנו מפנים אליו, מה שדורש מבנה URL שהוכן נכון מבעוד מועד, שיאפשר מעבר נכון בין הדפים. הטקסט משפיע על האלמנטים הוויזואליים של דף אינטרנט, ולפעמים נדרשות התאמות בעיצוב, בגדלים של הפונטים, המשפיעים על חווית המשתמש, ומשם על המעבר לטפסים, ובכלל על ה- customer journey של משתמש הקצה במילוי טופס, למשל. בניה ועיצוב של אתר דו לשוני משפיעה גם על ״החיבור״ בין האתר לבין פלטפורמות נוספות, כגון גוגל (מנוע החיפוש, מערכת גוגל אדס, גוגל אנליטיקס, יוטיוב), פלטפורמות חברתיות, מערכות בקרה וכד׳, לפעמים נדרשת התאמה של הפלטפורמות החיצוניות, כך יכול לעלות הצורך למשל בהחלפת מערכת ניהול הלקוחות, כי התאמה למספר שפות אינה אפשרית.

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

מבנה URL אחיד

מבנה ה- URL המומלץ על ידי גוגל לאתרים רב לשוניים בהם משתמשים במערכת שרתים מקומית מבוסס על בניית subdirectories ושימוש ב- path, כך שהשימוש ב – URL במבנה הבא www.gov.il/ar (ה- path לערבית הוא ar/) הוא גם הנוח ביותר, הן מבחינת ההקמה והן מבחינת הניהול השוטף. בשל חשיבות הנושא והשפעתו על תהליך העבודה השוטף של ניהול אתר רב לשוני, מומלץ לרכז את ניהל מערכת ה- URL, ולהשתמש בטבלאות או אפילו בניית מודול שבאמצעותו ניתן לנהל את המערכת באופן אחיד ורוחבי לכל האתר ובכל השפות. כך שהמעבר בין העמודים השונים יהיה על פי מבנה ה – URL שבטבלאות או בממשק הניהול. כיום קיים מודול כזה במערכת ניהול התוכן של דרופל, שמספק פתרון גם למקרים שלא כל הדפים קיימים בכל השפות, ניתן לבחון את המודול של דרופל, לאפיין ולבנות פתרון דומה למערכת ניהול התוכן של האתר הממשלתי. כך ניתן להימנע מעבודה ידנית כפולה של התאמת הקישורים בדפי האתר השונים, ומתאפשרת התמודדות טובה יותר עם עדכוני תוכן.

דוגמא להמחשת קושיות העולות מאי שמירה על מבנה URL באתר רב לשוני: מעבר לשפה הערבית בדף my.gov.il לא משנה את path ל- ar/.

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

לאחר המעבר לדף השאלות והתשובות, אפשר לראות שכאן יש path שמוגדר ל- he/, זאת ככל הנראה הגדרת מערכת בברירת מחדל. כאן החלפה של השפה בסרגל השפות תיתן לנו דף ״שאלות ותשובות״ בערבית. עם path נכון בצורת https://www.gov.il/ar/Departments/Guides/my_gov_faq

לא מומלץ להשתמש בעוגיות לשמירת העדפות שפה

ייתכן כי כאן נעשה שימוש בעוגיות לשמירת הגדרות השפה של המשתמש – דבר זה אינו מומלץ ויש להיצמד לשימוש במבנה URL ו- path לכל שפה.

הדוגמה לעיל ממחישה את החשיבות בעבודה מובנית ונכונה, בה המעבר לשפה הערבית ילווה תמיד בשינוי ב- path. בכל אתר אינטרנט מאות קישורים פנימיים שמתעדכנים, וקשה לבצע מעקב ידני אחר כולם, לכן נדרשת ריכוזיות ברמת הדומיין (מעל לרמת הסאב דומיין למשל של govextra.gov.il) של עבודת ניהול מערכת הקישורים וה – URL באמצעות טבלה או בממשק ייעודי המחובר לקישורים באתר כאמור. דוגמא נוספת שממחישה את הצורך במערכת ממנה ניתן לנהל את הקישורים באתר נמצאת בדף שכותרתו ״ייפוי כוח של אדם פרטי לצורך שינוי במירשם כלי הרכב״ שיש בו קישור לטופס ״יפוי כוח של אדם פרטי״ איתו ניתן לגשת לדואר ולבצע העברת בעלות של רכב באמצעות מיופה כוח. בדף המקביל בערבית הקישור להורדת הטופס שבור, כנראה התוכן לא עודכן, והדף נותר עם קישור ישן, מה שדורש איתור הקישור השבור ותיקונו ידנית.

אין קיצורי דרך 

דוגמה לחשיבות השמירה על מבנה URL אחיד גם בבניה של אתר ב- Subdomain ייעודי ושימור מבנה ה- URL ושימוש ב- path נכון ובטבלאות או בניהול קישורים ניתן למצאו בסאב דומיין https://govextra.gov.il/ministry-of-health/corona/corona-virus-ar

שלושה הלינקים הראשונים בתחתית הדף בערבית שבורים. הלינקים באתר בעברית (וברוסית ובאנגלית) הוחלפו, אולם בערבית התפספס התיקון.

שימוש ב – Redirect

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

SEO באתר דו לשוני

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

מבנה URL ייעודי ועצמאי לכל שפה

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

תוכן כפול

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

  1. יש להשתמש בכתובות אתרים ייעודיות הכוללות אינדיקטור לשפה. כפי שנעשה היום באתר gov.il' בדפים עם path ל- ar/, כך אנו מאפשרים לאלגוריתם של מנועי החיפוש ולמשתמשים לזהות את השפה מכתובת האתר בלבד.
  2. להימנע משימוש בגוגל טרנסלייט לתרגום האתר, וגם אם נעשה שימוש כזה בהליך התרגום, לעבור על התכנים ולבצע אדפטציה ועריכה של כל הפסקאות.

תוכן מבוסס מילות חיפוש

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

בחירת שם לתמונות

שמות נכונים לתמונות המופיעות באתר יחזקו את ה- SEO וישפיעו על דירוג הדף בתוצאות החיפוש. אחוז החיפושים לפי תמונה במנוע החיפוש גוגל נמצאים בעלייה מתמדת, לכן יש חשיבות רבה לשם התמונה בפרט. שמות התמונות באתר הממשלתי מופיעות באנגלית, וישנו מאגר תמונות נפרד לכל שפה, לכן מומלץ למשל בדף הבית של משרד הבריאות להגדיר שם נכון לתמונת השער בנושא וירוס הקורונה. כך למשל את השם הקיים campaign-pic ניתן להחליף ל- coronavirus-information-arabic, תוך שימוש ב: (-) – ולא ברווח או ב: (_) – להפרדה בין המילים. כך באותו עמוד בתמונה שמפנה להורדת אפליקציית המגן, במקום בשם התמונה shield הנוכחי ניתן להשתמש בשם: hamagen-app-covid19-arabic.

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

הטמעת סרטונים רלוונטיים מ – YouTube

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

תיוג ב- hreflang

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

<link rel=”alternate” hreflang=”ar” href=”http://example.gov.il/ar/” />

הטמעת מפת אתר רב לשונית 

הטמעת מפת אתר רב לשונית תעזור למנועי החיפוש למצוא את התכנים בכל שפה, חשוב לעדכן תמיד את מפת האתר הרב לשונית ב- XML במיוחד בשלבים בהם האתר בתהליכי הרחבה וכשמוסיפים דפים חדשים. משלה Off-page SEO לכל שפה חשוב לעבוד על בניית קישורים נכנסים מאתרים בערבית לדפים השונים באתר הממשלתי בערבית, ע״י אזכורים וידיעות באתרי חדשות או פרסום ידיעות יח״צ בערבית לשירותים ולמידע בנוסף לקישור לעמוד הרלוונטי, לרבות ברשתות החברתיות.

שימוש בשפה אחת לעמוד

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

הגדרת Title ו -Meta Description

הגדרת Title (כותרת) ו – Meta Description (תיאור) עדכניים ומובנים לדף האינטרנט בערבית חשובה, ותשפיע על אחוז ההקלקות לעמוד מתוצאות החיפוש. כך למשל בחיפוש אחר ״מבחן רשיון נהיגה״ מתקבלת תוצאה ראשונה עם כותרת טובה ומטה לא מספקת: המבחן העיוני (תיאוריה)

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

 

 

 

 

הגדרת Meta Data

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

מהירות טעינה

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

התאמת אתר דו לשוני UI/UX

תכנון סרגל השפה – Global Gateway

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

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

עקביות ויזואלית בין שתי הגרסאות

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

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

שילוב אלמנטים ייחודיים

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

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

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

לזכור שאורך המילים והפסקאות עשוי להשתנות בין הערבית והעברית 

מכיוון שלמלים או פסקאות שונות בשפות שונות יש אורכים שונים, נושאי ריווח פוטנציאליים צריכים להיות שאלה קבועה בעת עיצוב דף אינטרנט. לדוגמה, "גלו עוד" הוא ביטוי עם שתי מילים בעברית, אך בערבית מדובר במילה אחת "للمزيد". כדי לשמור על עקביות, ייתכן שיהיה צורך לשים לב גודל הפונטים ולסגנונות שבהם נעשה שימוש

הסוד: עיצוב רספונסיבי

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

חווית משתמש מול זהות ויזואלית

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

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

  • להשאיר מספיק מקום בממשק המשתמש למקרה שיש טקסטים ארוכים יותר (להימנע למשל משימוש ביותר מדי עמודות בטבלה).
  • במידת האפשר, לתכנן תרחישים של טקסט שגולש לשורה הבאה (לדוגמא, כפתורים עם 2 שורות טקסט)
  • להיות ליברלי עם שטח ריק בעיצוב white space בכלל, ובערבית בפרט.

 טפסים

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

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