10.04.2025
150
HTML (HyperText Markup Language) – veb səhifələrin strukturunu yaratmaq üçün istifadə olunan işarələmə dilidir. “HyperText” – fərqli səhifələr və ya sənədlər arasında əlaqələr qurmağa imkan verən mətnlər deməkdir, “Markup Language” isə məzmunun necə qurulacağını və göstəriləcəyini müəyyən edən xüsusi işarələr (etiketlər) vasitəsilə təşkil olunan dil anlamını verir.
HTML-in əsas məqsədi veb səhifənin skeletini – yəni başlıqları, paraqrafları, şəkilləri, keçidləri, formaları və digər elementləri qurmaqdır. Bu dil veb brauzerə “bu hissə başlıqdır”, “bu bir şəkildir”, “bu linkdir” kimi göstərişlər verir. Nəticədə, brauzer bu etiketləri oxuyaraq istifadəçiyə vizual olaraq oxunaqlı və strukturlaşdırılmış veb səhifə təqdim edir.
Qısaca desək:
HTML bir veb saytın təməlidir.
O, veb səhifədəki məzmunun (mətn, şəkil, video və s.) necə yerləşdiriləcəyini müəyyən edir.
Digər texnologiyalarla – CSS (dizayn) və JavaScript (funksionallıq) ilə birlikdə işləyir.
Əgər veb sayt qurmaq istəyirsənsə, HTML sənin ilk öyrənməli olduğun dildir. Bu, bir binanın bünövrəsi kimidir – olmadan heç nə qurula bilməz.
HTML sənədi müəyyən qaydalara əsaslanaraq qurulur. Bu struktur veb brauzerin səhifəni düzgün oxuyub istifadəçiyə doğru şəkildə təqdim etməsi üçün vacibdir. HTML sənədinin əsas strukturu “üst-orta-aşağı” prinsipi ilə işləyir və bir neçə vacib hissədən ibarətdir.
1. <!DOCTYPE html> – Sənəd növünün təyini
Bu sətir HTML sənədinin HTML5 standartında olduğunu göstərmək üçün istifadə olunur. Veb brauzerlər bu sətirdən sənədin hansı qaydalar əsasında oxunacağını anlayır.
<!DOCTYPE html>
2. <html> – HTML sənədinin başlanğıcı və sonu
Bu element bütün HTML sənədini əhatə edir. Bütün digər elementlər bu tagın içində yerləşir.
<html>
<!-- Başlıq və məzmun buraya yazılır -->
</html>
3. <head> – Texniki məlumatlar
<head> bölməsi istifadəçiyə görünmür. Burada səhifənin başlığı, meta məlumatlar, xarici fayllara keçidlər (məsələn, CSS və ya JavaScript faylları), favicon və s. yerləşir.
<head>
<title>Saytın Başlığı</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
</head>
4. <body> – Görünən məzmun
Bütün istifadəçiyə görünən hissə <body> daxilində yerləşir. Mətnlər, şəkillər, düymələr, videolar, linklər və digər məzmun burada yerləşdirilir.
<body>
<h1>Xoş gəlmisiniz!</h1>
<p>Bu, ilk HTML səhifənizdir.</p>
</body>
Tam HTML strukturu nümunəsi:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Mənim İlk Səhifəm</title>
</head>
<body>
<h1>Salam, dünya!</h1>
<p>Bu, sadə HTML strukturu nümunəsidir.</p>
</body>
</html>
HTML dilində veb səhifənin strukturunu yaratmaq üçün etiketlər istifadə olunur. Bu etiketlər vasitəsilə brauzerə hansı hissənin başlıq, hansı hissənin mətn, şəkil, siyahı və ya keçid olduğunu bildiririk. Aşağıda HTML-də ən çox istifadə olunan və öyrənilməsi vacib olan əsas etiketlər haqqında geniş izah verilir.
1. Başlıqlar – <h1>–<h6>
Başlıqlar, məzmunu strukturlaşdırmaq və önəm səviyyələrini göstərmək üçün istifadə olunur.
<h1> – Ən böyük və ən vacib başlıqdır. Saytda adətən səhifənin əsas başlığı olur.
<h6> – Ən kiçik və ən az önəm daşıyan başlıqdır.
<h1>Saytın Başlığı</h1>
<h2>Bölmənin Başlığı</h2>
<h3>Alt başlıq</h3>
2. Paraqraflar – <p>
Mətn hissələrini paraqraflar halında göstərmək üçün <p> etiketi istifadə olunur.
<p>Bu, sadə bir paraqraf nümunəsidir.</p>
3. Linklər – <a>
Saytda bir səhifədən digərinə keçid üçün istifadə olunur. Linklər istənilən URL-yə yönəldilə bilər.
Nümunə:
<a href="https://example.com">Sayta keçid</a>
4. Şəkillər – <img>
Veb səhifəyə şəkil əlavə etmək üçün istifadə olunur. Bu etiketin src (mənbə) və alt (alternativ mətn) atributları vacibdir.
Nümunə:
<img src="sekil.jpg" alt="Alternativ mətn">
5. Siyahılar – <ul>, <ol>, <li>
Siyahılar iki formada olur:
Qeyri-nizamlı siyahı – <ul> (bullet point-lərlə)
Nizamlı siyahı – <ol> (nömrələnmiş)
Siyahıdakı hər bir element <li> etiketi ilə yazılır.
Nümunə:
<ul>
<li>Alma</li>
<li>Armud</li>
</ul>
<ol>
<li>1-ci addım</li>
<li>2-ci addım</li>
</ol>
6. Cədvəllər – <table>, <tr>, <td>, <th>
Cədvəllər məlumatları sıra və sütunlar şəklində təqdim etmək üçün istifadə olunur.
<table> – Cədvəlin ümumi strukturu
<tr> – Cədvəl sətri
<td> – Məlumat hüceyrəsi
<th> – Başlıq hüceyrəsi (qalın və ortalanmış olur)
Nümunə:
<table>
<tr>
<th>Ad</th>
<th>Yaş</th>
</tr>
<tr>
<td>Aysel</td>
<td>23</td>
</tr>
</table>
7. Güclü və vurğulu mətn – <strong>, <em>
<strong> – Güclü vurğu (bold).
<em> – Emosional vurğu (italic).
Nümunə:
<p><strong>Diqqət:</strong> Bu vacib məlumatdır.</p>
<p><em>Qeyd:</em> Bu əlavə izahdır.</p>
8. Yatay xətt – <hr>
Məzmun arasında vizual ayırıcı xətt əlavə edir.
Nümunə:
<p>İlk hissə</p>
<hr>
<p>İkinci hissə</p>
9. Sətir sonu – <br>
Mətn daxilində yeni sətrə keçmək üçün istifadə olunur.
Nümunə:
<p>Salam<br>Necəsən?</p>
Yox, HTML proqramlaşdırma deyil, markap (işarələmə) dilidir.
Xeyr, çox sadədir. Əsas prinsipləri bir neçə günə öyrənmək mümkündür.
Yox, əgər interaktiv və gözəl sayt istəyirsənsə, CSS və JavaScript də öyrənmək lazımdır.
HTML5 daha çox multimedia dəstəyi və semantik elementlər təqdim edir.
Bəli, çünki HTML olmadan saytın əsas strukturu qurula bilməz.
.webp "Flag of United Kingdom")
