לחץ על תגית להסבר מלא כולל דוגמאות
<!DOCTYPE>
תגית זו מגדירה את סוג המסמך ואת גרסת ה-HTML שבה יש להשתמש. היא חייבת להיות בראש המסמך HTML כדי להבטיח שהדפדפן יבין את הפורמט הנכון של הדף. ללא התגית הזו, הדפדפן עשוי לנסות לפרש את הדף לפי שיטות פרשנות ישנות יותר.
<html>
תגית זו היא השורש של המסמך ומכילה את כל התוכן שמוצג בדף. כל תגית HTML חייבת להיות מוחזקת בתוך תגית זו.
<head>
תגית זו מכילה מידע שאינו מוצג ישירות בדף, אך הוא חשוב עבור הדפדפן ומנועי חיפוש. כאן ניתן לכלול קישורים לקבצי CSS, סקריפטים, ומטא-מידע.
<title>
תגית זו קובעת את הכותרת שתופיע בכרטיסיית הדפדפן כאשר המשתמש צופה בדף זה. הכותרת גם יכולה להופיע במנועי חיפוש וברשימות סימניות.
<meta>
תגיות מטה מספקות מידע חשוב על הדף כגון קידוד תווים, תיאור הדף, מילות מפתח, ועוד. הן אינן מוצגות למשתמש אלא משמשות את הדפדפן ומנועי חיפוש.
<link>
תגית זו משמשת לחיבור למסמכים חיצוניים כגון גיליונות סגנון (CSS) או אייקונים. היא לא מציגה תוכן בדף אלא מקשרת לקבצים חיצוניים.
<style>
תגית זו מאפשרת להוסיף קוד CSS ישירות בתוך המסמך HTML. השימוש ב<style> נפוץ כאשר רוצים להוסיף סגנונות ספציפיים לעמוד מסוים מבלי להשתמש בקובץ חיצוני.
<script>
תגית זו משמשת להוסיף קוד JavaScript למסמך HTML, או לקשר לקובץ JavaScript חיצוני. זה מאפשר להוסיף פונקציות דינמיות ואינטראקטיביות לדף.
<body>
תגית זו מכילה את התוכן הנראה של הדף, כולל טקסט, תמונות, קישורים וכל תוכן אחר שמוצג למשתמש.
<header>
תגית זו משמשת להגדיר אזור כותרת בדף. זהו המקום שבו בדרך כלל נמצא הלוגו, התפריט הראשי או מידע אחר הקשור לכותרת הדף.
<nav>
תגית זו משמשת להגדיר אזור ניווט בדף, הכולל קישורים לדפים אחרים או חלקים שונים באתר.
<main>
תגית זו משמשת להגדיר את התוכן העיקרי של הדף. התוכן שיתקיים בתגית <main> הוא התוכן הייחודי לדף הנוכחי, ואינו כולל כותרת, תפריטים, או מידע צדדי.
<section>
תגית זו משמשת להגדיר קטע תוכן עצמאי בדף. כל קטע כזה יכול להכיל כותרת משלו ותוכן הקשור אליו, ויש לו משמעות סמנטית עבור הדפדפן ומנועי חיפוש.
<article>
תגית זו משמשת להגדיר תכנים שניתן להבין אותם כיחידות עצמאיות בדף. לדוגמה, פוסטים בבלוג, מאמרים בעיתון, או חלקים אחרים שניתן להניחם כיחידות נפרדות.
<aside>
תגית זו משמשת להגדיר תוכן צדדי שאינו חלק מהתוכן המרכזי של הדף. זה יכול להיות קישורים צדיים, מידע נוסף או פרסומות.
<footer>
תגית זו משמשת להגדיר את האזור בתחתית הדף שמכיל פרטי חתימה כמו זכויות יוצרים, פרטי קשר או מידע נוסף על האתר.
<h1>
תגית זו משמשת להגדיר כותרת ברמת חשיבות גבוהה ביותר. יש להשתמש בה עבור כותרות עיקריות בדף.
<h2>
תגית זו משמשת להגדיר כותרת ברמת חשיבות שנייה, מתחת לכותרת <h1>. משתמשים בה לכותרות משנה.
<h3>
תגית זו משמשת להגדיר כותרת ברמת חשיבות שלישית, מתחת לכותרת <h2>. משתמשים בה להוסיף כותרות נוספות.
<h4>
תגית זו משמשת להגדיר כותרת ברמת חשיבות רביעית, מתחת לכותרת <h3>. מתאימה לכותרות פחות חשובות.
<h5>
תגית זו משמשת להגדיר כותרת ברמת חשיבות חמישית, מתחת לכותרת <h4>. מתאימה לכותרות ברמת פרטים.
<h6>
תגית זו משמשת להגדיר כותרת ברמת חשיבות נמוכה ביותר, מתחת לכותרת <h5>. מתאימה לכותרות מאוד פרטניות.
<p>
תגית זו משמשת להגדיר פסקה של טקסט. הטקסט שבתוך התגית יופיע עם רווחים פנימיים על מנת להבדיל אותו מתכנים אחרים בדף.
<a>
תגית זו משמשת להגדיר קישור. ניתן להשתמש בה כדי לקשר לדפים אחרים, קבצים או כתובת דואר אלקטרוני.
<img>
תגית זו משמשת להוסיף תמונה לדף. התמונה מתקבלת מהכתובת המצוינת בתכונת src.
<figure>
תגית זו משמשת להציג תוכן גרפי (כגון תמונה או תרשים) יחד עם תיאור אופציונלי באמצעות תגית <figcaption>.
<figcaption>
תגית זו משמשת להוסיף תיאור או כיתוב לתוכן גרפי כמו תמונה או תרשים שנמצא בתוך תגית <figure>.
<div>
תגית זו משמשת להגדיר קטע של תוכן, שהיא בסיסית מאוד ויכולה לשמש למגוון מטרות כגון ארגון התוכן או עיצוב בעזרת CSS.
<span>
תגית זו משמשת להגדיר קטע קטן של תוכן בתוך אלמנט אחר, לרוב עבור עיצוב או שינוי טיפוגרפיה מקומית.
<ul>
תגית זו משמשת להגדיר רשימה לא מסודרת (כמו נקודות תבליט). כל פריט ברשימה מוגדר באמצעות תגית <li>.
<ol>
תגית זו משמשת להגדיר רשימה מסודרת (כמו מספרים). כל פריט ברשימה מוגדר באמצעות תגית <li>.
<li>
תגית זו משמשת להגדיר פריט בתוך רשימה לא מסודרת (<ul>) או מסודרת (<ol>).
<form>
תגית זו משמשת להגדיר טופס שבו ניתן להזין קלט ולהגיש אותו לשרת. הטופס יכול לכלול מגוון של סוגי קלט כמו שדות טקסט, כפתורים, תיבות סימון ועוד.
<input>
תגית זו משמשת להוסיף שדה קלט לטופס. ניתן להגדיר סוגים שונים של קלט, כמו טקסט, סיסמה, תאריך ועוד.
<button>
תגית זו משמשת להוסיף כפתור לפעולה, כמו שליחת טופס או ביצוע פעולה כלשהי בדף.
<select>
תגית זו משמשת להוסיף תפריט נפתח (dropdown) שבו המשתמש יכול לבחור ערך אחד מתוך רשימה של אפשרויות.
<textarea>
תגית זו משמשת להוסיף שדה קלט שיכול להכיל מספר שורות טקסט. מתאים לשדות טקסט ארוכים כמו הערות או תגובות.
<table>
תגית זו משמשת להוסיף טבלה שתכיל נתונים בצורה מסודרת עם שורות ועמודות.
<tr>
תגית זו משמשת להגדיר שורת טבלה בתוך תגית <table>. כל שורה מכילה את התאים שלה באמצעות תגיות <td> או <th>.
<td>
תגית זו משמשת להגדיר תא בתוך שורת טבלה בתגית <table>. תאים יכולים להכיל תוכן כמו טקסט, תמונות, קישורים וכו'.
<th>
תגית זו משמשת להגדיר תא כותרת בטבלה, שמראה בדרך כלל את הכותרות של העמודות. הכיתוב בתגית <th> מוצג מודגש ומרוכז.
<caption>
תגית זו משמשת להוסיף כותרת לטבלה. הכותרת מוצגת מעל הטבלה ומשמשת לתיאור התוכן שלה.
<col>
תגית זו משמשת להגדיר מאפיינים עבור עמודות בטבלה, כמו צבע רקע או רוחב. לרוב משתמשים בה יחד עם תגית <colgroup> כדי ליישם את המאפיינים על עמודות מסוימות בטבלה.
<colgroup>
תגית זו משמשת להגדיר קבוצת עמודות בטבלה. בדרך כלל משתמשים בה בשילוב עם תגיות <col> כדי לקבוע מאפיינים עבור העמודות בקבוצה. תגית <colgroup> מאפשרת ליישם עיצוב ומאפיינים על מספר עמודות בו זמנית.
<br>
תגית זו משמשת ליצירת שבירת שורה בטקסט, ללא יצירת פסקה חדשה. היא גורמת לטקסט להמשיך בשורה חדשה באותו אלמנט טקסט, כגון בפסקה או בתוך תגית <div>.
<hr>
תגית זו משמשת ליצירת קו אופקי בדף, בדרך כלל לצורך הפרדה בין חלקים שונים בתוכן. הקו שמהווה את הגבול בין אזורים שונים של התוכן יכול לשמש לצורך עיצוב, ארגון והפרדה חזותית.
<strong>
תגית זו משמשת להדגשת טקסט, בדרך כלל מוצגת כטקסט מודגש. השימוש בתגית <strong> משדר את החשיבות או ההדגשה של הטקסט, מה שעוזר להביא לתשומת לב של הקורא.
<em>
תגית זו משמשת להדגשת טקסט בצורה קלה יותר, בדרך כלל באמצעות הצגת הטקסט בכתב נטוי. השימוש בתגית <em> מסמן את החשיבות או הדגש של הטקסט, אך בצורה פחות בולטת מהתגית <strong>.
<audio>
תגית זו משמשת להוספת קובץ שמע לדף, ומספקת נגן שמע עם אפשרויות לשליטה בהשמעה כמו השמעה, השהיה, והגברת/הנמכת עוצמת הקול.
<video>
תגית זו משמשת להוספת קובץ וידאו לדף, ומספקת נגן וידאו עם אפשרויות לשליטה בהקרנה כמו השמעה, השהיה, והגברת/הנמכת עוצמת הקול. ניתן להוסיף לתגית <video> מספר קבצים בפורמטים שונים כדי להבטיח תאימות עם דפדפנים שונים.
<iframe>
תגית זו משמשת להטמיע תוכן מדף אחר או מקור חיצוני בתוך הדף הנוכחי. זה יכול לכלול דפים אינטרנטיים, סרטונים, מסמכים, או כל תוכן אחר שנמצא באינטרנט. תגית <iframe> מאפשרת לשלב תוכן חיצוני מבלי לעזוב את הדף הנוכחי.
<canvas>
תגית זו משמשת ליצירת אזור שבו ניתן לצייר גרפיקה באמצעות JavaScript. ניתן להשתמש ב-API של canvas כדי ליצור גרפיקה, תמונות, צורות ועוד. תגית <canvas> מספקת אזור שטוח בדף שבו ניתן לצייר ולעדכן את התוכן בצורה דינמית.
<svg>
תגית זו משמשת להגדרת גרפיקה וקטורית מסוג SVG (Scalable Vector Graphics). SVG היא פורמט גרפי וקטורי המאפשר יצירת גרפיקה שניתן להגדיל ולהקטין ללא אובדן איכות. גרפיקה ב-SVG נכתבת ב-XML וניתנת לציור בדפדפן באמצעות תגיות SVG.