איך נולדה הרשת
ב־1989 הציע מדען בריטי בשם טים ברנרס־לי, שעבד במרכז המחקר CERN בשווייץ, דרך חדשה לשתף מסמכים בין מחשבים: דפים שמקושרים זה לזה בקישורים. הוא המציא את HTML לכתיבת הדפים, ובנה גם את הדפדפן הראשון ואת שרת האינטרנט הראשון. האתר הראשון עלה לרשת בתחילת שנות ה־90, והסביר מה זה בכלל ״רשת״.
HTML הוא ראשי תיבות באנגלית של ״שפת סימון להיפר־טקסט״. ״היפר־טקסט״ פירושו טקסט עם קישורים שמובילים לטקסטים אחרים. HTML היא לא שפת תכנות במובן המלא — אין בה לולאות או תנאים. היא שפת סימון: היא מסמנת לכל חלק בדף מה הוא. אבל היא הבסיס שעליו בנויים כל האתרים, ומי שבונה אתרים לומד אותה ראשונה.
תגיות: הלבנים של הדף
HTML בנויה מתגיות — מילים בתוך סוגריים משולשים. רוב התגיות באות בזוגות: תגית פתיחה ותגית סגירה, שיש בה קו נטוי. מה שביניהן הוא התוכן. <h1>הדף שלי</h1> היא כותרת ראשית. <p>אני אוהבת כדורסל</p> היא פסקה. יש כותרות בגדלים h1 עד h6, כש־h1 היא הגדולה והחשובה ביותר.
לחלק מהתגיות יש מאפיינים — מידע נוסף שכותבים בתוך תגית הפתיחה. קישור נכתב כך: <a href="https://example.com">לחצו כאן</a>, כש־href הוא הכתובת שאליה הקישור מוביל. תמונה נכתבת כך: <img src="cat.png" alt="חתול ישן"> — src הוא קובץ התמונה, ו־alt הוא תיאור במילים, שחשוב לאנשים עיוורים שמשתמשים בתוכנה שמקריאה את הדף. לתמונה אין תגית סגירה. רשימה בנויה מ־<ul> ובתוכה פריטים ב־<li>.
CSS: הבגדים של הדף
HTML קובעת מה יש בדף, ו־CSS קובעת איך הוא נראה. CSS נכתבת ככללים: בוחרים איזה חלק לעצב, ובסוגריים מסולסלים כותבים מאפיינים וערכים. למשל h1 { color: purple; } צובע את כל הכותרות הראשיות בסגול. p { font-size: 20px; } מגדיל את הטקסט של הפסקאות. כל מאפיין נגמר בנקודה־פסיק.
היתרון הגדול: אם יש לכם אתר עם מאה דפים ורוצים לשנות את צבע הכותרות, משנים שורה אחת בקובץ ה־CSS — וכל הדפים מתעדכנים. CSS יודעת גם לסדר דברים זה לצד זה, להוסיף מסגרות ופינות מעוגלות, ואפילו להתאים את הדף לטלפון ולמחשב. ולאתרים בעברית יש מאפיין חשוב: dir="rtl" ב־HTML אומר לדפדפן שהטקסט נכתב מימין לשמאל.
הדף הראשון שלכם
כדי לבנות דף פותחים עורך טקסט פשוט, כותבים את ה־HTML ושומרים את הקובץ בשם שנגמר ב־.html, למשל index.html. לוחצים עליו פעמיים — והדפדפן פותח אותו ומציג את הדף. אין צורך בחיבור לאינטרנט כדי לראות דף ששמור אצלכם במחשב. כדי שאחרים יראו אותו, צריך להעלות אותו לשרת, וזה כבר שלב מתקדם יותר.
רעיון לתרגול: דף על התחביב שלכם. כותרת ראשית עם השם של התחביב, פסקה שמסבירה למה אתם אוהבים אותו, רשימה של שלוש עובדות, וקישור לאתר מעניין בנושא. אחר כך מוסיפים CSS: צבע רקע, צבע לכותרת וגודל לטקסט. ואם רוצים שהדף יגיב — שכפתור יעשה משהו כשלוחצים עליו — צריך את השפה השלישית של האינטרנט: ג׳אווהסקריפט. עליה בשיעור הבא. חשוב: לא מפרסמים בדף פרטים אישיים כמו כתובת, טלפון או בית ספר.