ראש המסמך בעמוד HTML

ראש המסמך בעמוד HTML

  • פרסומת

כל מסמך HTML מורכב משני חלקים עיקריים: גוף המסמך, המתקיים בתוך תגיות ה-<body></body>  וראש המסמך, המתקיים בתוך תגיות ה- <head></head> . ראש המסמך הוא החלק שבו קיים כל המידע אודות המסמך עצמו, והתוכן שלו לא מוצג על ידי הדפדפן בצורה וויזואלית. להלן רשימה קצרה של חלק מהתגיות שיכולות להיכנס לראש המסמך:

תגית ה-title

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

<head>
    <title>My New Website</title>
</head>

בראש הלשונית:

Screen Shot 2016-01-11 at 12.30.33 PM

כאתר מועדף:

Screen Shot 2016-01-11 at 12.31.24 PM

בעת חיפוש בגוגל:

Screen Shot 2016-01-11 at 1.00.40 PM

תגית ה-meta

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

הגדרת מילות מפתח למנועי החיפוש

<meta name="keywords" content="HTML, CSS, SASS, JavaScript, PHP">

תיאור התוכן של העמוד בקצרה

<meta name="description" content="וובדסק - מדריכים, אתגרים, שאלות ותשובות בנושאי פיתוח תוכנה">

הגדרת הקידוד של העמוד

<meta charset="UTF-8" />

תגית ה-style

בתוך תגית ה-style ניתן להזין קוד CSS שמגדיר את נראות האתר. בתגיות ה-style ניתן להתמש גם מחוץ לראש המסמך. עוד על כך במאמר זה.

<style>
    body {color:red;}
</style>

תגית ה-link

תגית זו משמשת בעיקר בשביל לקשר למסמך CSS חיצוני.

קישור לקובץ CSS חיצוני

<link rel="stylesheet" type="text/css" href="style.css" />

הגדרת סמל (favicon) לעמוד

<link rel="shortcut icon" type="image/png" href="favicon.png"/>

תגית ה-script

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

הוספה של קוד לתוך המסמך

<script>
    console.log("Hello World!");
</script>

הוספה של קוד כקובץ חיצוני

<script type='text/javascript' src="script.js"></script>