אם בוני האתרים היום היו יודעים כיצד היינו בונים אתרים בעברית לפני 20 שנים… בעבר נאלצנו להשתמש ב"טריקים" רבים כדי להוסיף עברית לאתר, אם זה בכתיבה הפוכה (למשל: םולש במקום שלום), בחירת שיטת קידוד ועוד. היום הדבר הרבה יותר קל.
עברית ב-HTML
כדי לשנות את שפת האתר לעברית בקידוד שיתאים לכל הדפדפנים (אקספלורר, פיירקפוקס, כרום, אופרה וכ"ו) אנו מוסיפים רק תגית אחת:
<meta charset="utf-8">
תגית זו הינה ממשפחת תגיות ה-META שבעצם נותנות לדפדפן שלנו מידע אודות האתר שאנו הולכים לגלוש אליו:
- תיאור של האתר
- שם יוצר האתר
- שפת האתר
- האם האתר מותאם למכשירים סלולריים וטאבלטים.
למעשה התגיות אינן מוצגות לגולש והן נועדו לתקשורת בין האתר לדפדפן בלבד.
אלמנט CHARSET מודיע לדפדפן שהטקסטים הכתובים יקודדו בקידוד UTF-8.
את תגיות ה-META אנו נשים בין תגיות ה-HEAD ומתחת ל-TITLE. הקוד אמור להיראות כך:
<html> <head> <title>שמיים כחולים - אומנות, שירה ותמונות יפות</title> <meta charset="windows-1255"> </head> <body> <h1>ברוכים הבאים לשמיים כחולים</h1> <p>אומנות, שירה ותמונות יפות</p> </body> </html>
האתר שלי כבר בעברית לפני הוספת תגית ה-META, מדוע אני צריך את זה?
- תשובה: נכון שהאתר כבר מופיע לך באופן אישי בעברית, אך מי מבטיח שהוא יופיע בצורה זו בכל הדפדפנים?
עלינו להתאים את האתר לכל הדפדפנים ולא רק לעצמנו ולגודל המסך שלנו, אלא להתחשב בכולם.
לאחר שהוספתי את התגית הטקסטים באתר הפכו מעברית לג'יבריש.
- תשובה: אם השתמשתם בתוכנה שהגדירה את הדף שלכם מראש בקידוד UTF-8,
הרי שבעת כתיבת הקוד בהתאמה ל-Windows-1255 הטקסטים העבריים יושחתו.
הדרך לתקן זאת היא לשנות דרך התוכנה את ה-Encoding ל-ANSI ולכתוב את העברית מחדש.
ב-Notepad++ זה קל – בתפריט למעלה בוחרים Encoding > Encode in ANSI,
או שלחילופין פשוט השתמשו בקידוד UTF-8.
כיוון הכתיבה
לאחר שהגדרנו את הקידוד שלנו כדי שיתאים לכל הדפדפנים, כעת אנו נהפוך את פורמט האתר לכתיבה מימין לשמאל.
אם אתם מתכננים להקים אתר באנגלית אתם כמובן יכולים לדלג על השלבים הללו.
בזמנים עברו עלתה השאלה על כתיבה מימין לשמאל באתרי אינטרנט והפתרון שנמצא הוא הוספת אלמנט DIR לתוך תגית HTML.
ישנה כמובן שיטה חלופית טובה הרבה יותר שקשורה ל-CSS אך על כך נעבור בפרק המתאים.
כדי להפוך את כל האתר לכתיבה מימין לשמאל אנו נשנה את תגית HTML לתגית הבאה:
<html dir="rtl">
תשמרו ותעלו את הדף שלכם מחדש, כעת הכותרת והפיסקה מתחת אמורות להתיישר לימין.
שימו לב להבדלים החשובים בין כתיבה מימין לשמאל או משמאל לימין –
כל האתר שלכם כעת ייכתב מימין לשמאל, גם האלמנטים שתוסיפו בהמשך.
כשכותבים אתר באנגלית (או צופים בקוד של אתר שנכתב משמאל לימין),
כל האלמנטים כולל תמונות, טקסטים, טבלאות וכדומה מיושרים אוטומטית לצד ימין ולכן צריך תמיד לשים לב שאנחנו עובדים בצורה שמתאימה לשפת האתר.
הקוד הסופי של הדף שלנו לפני המעבר לפרק הבא:
<html dir="rtl"> <head> <title>שמיים כחולים - אומנות, שירה ותמונות יפות</title> <meta charset="windows-1255"> </head> <body> <h1>ברוכים הבאים לשמיים כחולים</h1> <p>אומנות, שירה ותמונות יפות</p> </body> </html>
אתם מוזמנים לבדוק בעצמכם כיצד הדף נראה כעת, ולעבור לפרק הבא – מתחילים לעצב את הדף.
