1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
|
---
language: html
filename: learnhtml-he.html
contributors:
- ['Christophe THOMAS', 'https://github.com/WinChris']
translators:
- ['Menachem Zeivald', 'https://github.com/MenachemZeivald']
lang: he-he
---
HTML קיצור של Hypertext Markup Language כלומר זוהי שפה שמשתמשת בתגיות.
זוהי שפה המאפשרת לנו לכתוב אתרי אינטרנט.
זוהי שפת תגיות והיא מאפשרת לנו לכתוב דפי אינטרנט באמצעות קוד
כדי לתת הוראות לדפדפן כיצד יש להציג טקסט ונתונים.
למעשה, קובצי HTML הם קבצי טקסט פשוטים.
מהם התגיות?
זוהי שיטה לארגון מידע על ידי הקפתו בתגיות פתיחה וסגירה.
התגית משמשת כדי לתת משמעות לטקסט שהיא מקיפה.
ל-HTML יש גרסאות רבות. כאן נדבר על HTML5.
**הערה:** אתה יכול לבדוק את התגים והאלמנטים השונים תוך כדי קריאת המדריך
באתר כמו [codepen](http://codepen.io/pen/) כדי לראות את ההשפעות שלהם,
להבין איך הם עובדים ולהכיר את השפה.
מאמר זה עוסק בעיקר בתחביר של HTML וכמה עצות שימושיות.
```html
<!-- הערות לקוד כתובות בצורה הזאת -->
<!--
הערות
יכולות
להתפרס
על פני
מספר
שורות
-->
<!-- #################### התגיות #################### -->
<!-- לפנינו קובץ HTML לדוגמא עם הסברים. -->
<!DOCTYPE html>
<html>
<head>
<title>האתר שלי</title>
</head>
<body>
<h1>שלום עולם!</h1>
<a href="http://codepen.io/anon/pen/xwjLbZ">
בואו נבדוק את הקישור הזה
</a>
<p>זוהי פסקה.</p>
<p>זו עוד פסקה.</p>
<ul>
<li>זה פריט ברשימה לא ממוספרת</li>
<li>זהו פריט נוסף</li>
<li>וזה הפריט האחרון ברשימה</li>
</ul>
</body>
</html>
<!--
קובץ HTML מתחיל תמיד בציון לדפדפן שהדף הוא HTML.
-->
<!DOCTYPE html>
<!-- לאחר מכן, מתחילים בפתיחת תג <html>. -->
<html>
<!-- שיסגר בסוף העמוד עם התג </html>. -->
</html>
<!-- שום דבר לא אמור להופיע אחרי התג הסופי הזה. -->
<!-- בפנים (בין תגי הפתיחה והסגירה <html></html>), אנו מוצאים: -->
<!-- כותרת המוגדרת על ידי <head> (יש לסגור אותה עם </head>). -->
<!--
הכותרת מכילה תיאור ומידע על העמוד שאינם
מוצגים, זה מטא נתונים.
-->
<head>
<!--
התג <title> מציין לדפדפן את הכותרת להצגה בדפדפן
שורת הכותרת ושם הכרטיסייה של החלון.
-->
<title>האתר שלי</title>
</head>
<!-- אחרי הקטע <head>, אנו מוצאים את התג - <body> -->
<!-- עד לנקודה זו, שום דבר לא יופיע בחלון הדפדפן. -->
<!-- עלינו למלא תוכן בתוך ה - <body>. -->
<body>
<!-- התג h1 יוצר כותרת. -->
<h1>שלום עולם</h1>
<!--
יש גם תתי כותרת בגדלים שונים, מהגדול (h2) לקטן (h6)
-->
<!-- קישור לכתובת של אתר ניתנת על ידי התכונה href="" -->
<a href="http://codepen.io/anon/pen/xwjLbZ"> בואו נבדוק את הקישור הזה </a>
<!-- התג <p> מאפשר לנו לכלול טקסט בדף ה-html. -->
<p>זוהי פסקה.</p>
<p>זו עוד פסקה.</p>
<!-- התג <ul> יוצר רשימה לא ממוספרת. -->
<!--
כדי לקבל רשימה ממוספרת נשתמש ב-<ol>.
-->
<ul>
<li>זה פריט ברשימה לא ממוספרת</li>
<li>זהו פריט נוסף</li>
<li>וזה הפריט האחרון ברשימה</li>
</ul>
</body>
<!-- וזהו, יצירת קובץ HTML יכולה להיות פשוטה. -->
<!-- אבל אפשר להוסיף הרבה סוגים נוספים של תגי HTML. -->
<!-- התג <img /> משמש להוספת תמונה. -->
<!--
מקור התמונה מצוין באמצעות התכונה src=""
המקור יכול להיות כתובת URL או אפילו נתיב לקובץ במחשב שלך.
-->
<img src="http://i.imgur.com/XWG0O.gif" />
<!-- אפשר גם ליצור טבלה. -->
<!-- אנו פותחים אלמנט <table>. -->
<table>
<!-- <tr> מאפשר לנו ליצור שורה. -->
<tr>
<!-- <th> מאפשר לנו לתת כותרת לעמודת טבלה. -->
<th>כותרת ראשונה</th>
<th>כותרת שנייה</th>
</tr>
<tr>
<!-- <td> מאפשר לנו ליצור תא טבלה. -->
<td>שורה ראשונה, עמודה ראשונה</td>
<td>שורה ראשונה, עמודה שנייה</td>
</tr>
<tr>
<td>שורה שנייה, עמודה ראשונה</td>
<td>שורה שנייה, עמודה שנייה</td>
</tr>
</table>
```
## שימוש
HTML נכתב בקבצים המסתיימים ב-`.html` או `.htm`.
**HTML אינה שפת תכנות**
## לקריאה נוספת
- [Wikipedia](https://he.wikipedia.org/wiki/HTML)
- [HTML Tutorial (EN)](https://developer.mozilla.org/en-US/docs/Web/HTML)
- [W3Schools (EN)](http://www.w3schools.com/html/html_intro.asp)
|
