HTML (HyperText Markup Language) — veb səhifələrin strukturunu və məzmununu yaratmaq üçün istifadə olunan işarələmə dilidir. Azərbaycan dilində “Hipermətn İşarələmə Dili” kimi ifadə olunur. HTML internetdə gördüyümüz saytların əsasını təşkil edir və brauzerə səhifədəki məlumatların necə təşkil olunduğunu bildirir. Sadə dillə desək, HTML veb saytın skeletidir. Saytda gördüyümüz başlıqlar, mətnlər, şəkillər, keçidlər (linklər), siyahılar, cədvəllər və formalar HTML vasitəsilə strukturlaşdırılır. Məsələn, hər hansı xəbər saytına daxil olduqda məqalənin başlığı, dərc tarixi, şəkli və əsas mətni müxtəlif HTML elementləri ilə təqdim edilə bilər. Brauzer həmin elementləri emal edərək məzmunu istifadəçiyə göstərir. HTML xüsusilə Frontend proqramlaşdırmanın əsas texnologiyalarından biridir. Veb proqramlaşdırmanı öyrənməyə başlayanlar üçün HTML bilikləri CSS, JavaScript və digər müasir veb texnologiyalarını mənimsəməyin ilkin mərhələsidir.

HTML nə üçün istifadə olunur?

HTML-in əsas məqsədi veb səhifələrdəki məlumatların düzgün strukturlaşdırılmasını təmin etməkdir. Hər hansı saytın hazırlanması zamanı səhifənin hansı hissəsinin başlıq, mətn, şəkil, menyu və ya forma olduğunu müəyyənləşdirmək üçün HTML elementlərindən istifadə edilir.

HTML vasitəsilə:

• Veb səhifələrin əsas strukturu hazırlanır.
• Başlıqlar və mətnlər yerləşdirilir.
• Şəkillər, videolar və digər media elementləri əlavə olunur.
• Səhifələr arasında keçidlər yaradılır.
• İstifadəçi məlumatlarının daxil edilməsi üçün formalar hazırlanır.
• Siyahılar və cədvəllər təşkil edilir.
• Məzmunun semantik quruluşu müəyyənləşdirilir.

HTML şəxsi bloqlardan və xəbər portallarından tutmuş elektron ticarət saytlarına və mürəkkəb veb tətbiqlərə qədər müxtəlif layihələrdə istifadə olunur.

HTML necə işləyir?

HTML veb səhifənin məzmununu xüsusi elementlər vasitəsilə təsvir edir. Brauzer HTML sənədini qəbul etdikdə onun strukturunu analiz edir və səhifənin göstərilməsi üçün müvafiq sənəd modeli yaradır. HTML sənədi adətən .html fayl uzantısı ilə saxlanılır. Məsələn, veb səhifə hazırlamaq üçün index.html adlı fayl yaratmaq və həmin faylın daxilində HTML kodları yazmaq mümkündür. İstifadəçi faylı brauzerdə açdıqda brauzer HTML elementlərini emal edərək səhifəni ekranda göstərir. HTML-də məzmunu təsvir etmək üçün teqlərdən (tags) istifadə olunur. Məsələn, h1 əsas başlığı, p abzası, img şəkli, a isə keçidi ifadə edir. Bu elementlər vasitəsilə səhifənin məzmunu həm istifadəçi, həm brauzer, həm də digər texnologiyalar üçün daha anlaşıqlı formada təşkil edilir.

HTML səhifəsinin əsas strukturu necə qurulur?

Standart HTML sənədində bir neçə əsas hissə mövcuddur.

DOCTYPE brauzerə sənədin müasir HTML standartına uyğun olduğunu bildirir. html sənədin əsas elementidir. head hissəsində səhifənin adı, kodlaşdırma məlumatları və digər metadata yerləşdirilir. body hissəsində isə istifadəçinin səhifədə görə biləcəyi əsas məzmun saxlanılır. Məsələn, sadə HTML səhifəsində əsas başlıq və onun altında mətn abzası yaratmaq mümkündür. Yeni başlayan proqramçılar adətən ilk layihələrində məhz belə sadə strukturlardan istifadə edirlər. Daha sonra səhifəyə şəkillər, naviqasiya menyusu, linklər, siyahılar və digər elementlər əlavə edirlər.

HTML5 nədir?

HTML5 HTML texnologiyasının müasir inkişaf mərhələsini ifadə edən anlayışdır. Bu ad xüsusilə HTML-in beşinci versiyası ilə geniş yayılmışdır. Hazırda HTML standartı WHATWG tərəfindən Living Standard kimi davamlı şəkildə inkişaf etdirilir. HTML5 ilə veb səhifələrin qurulması üçün müxtəlif semantik və multimedia elementləri geniş istifadəyə verilib. Məsələn, header footer, nav, section və article kimi elementlər səhifənin strukturunu daha aydın təsvir etməyə imkan verir. Audio və video elementləri isə müvafiq media məzmununun əlavə plaginlər olmadan brauzer tərəfindən dəstəklənməsinə şərait yaradır.

Semantic HTML nədir?

Semantic HTML — HTML elementlərinin sadəcə görünüşə görə deyil, daşıdığı məna və funksiyaya uyğun seçilməsidir. Məsələn, səhifənin əsas naviqasiya hissəsini ümumi div elementi əvəzinə nav elementi ilə təqdim etmək daha mənalı struktur yaradır. Eyni şəkildə, müstəqil məqalə üçün article, əsas məzmun üçün main, səhifənin alt hissəsi üçün isə footer istifadə oluna bilər. Semantik HTML kodun oxunaqlılığını yaxşılaşdırır, köməkçi texnologiyaların səhifəni şərh etməsinə dəstək verir və axtarış sistemlərinin məzmunun strukturunu anlamasına kömək edir.

HTML, CSS və JavaScript arasında fərq nədir?

HTML, CSS və JavaScript müasir Frontend proqramlaşdırmanın üç əsas texnologiyasıdır. Onlar fərqli funksiyaları yerinə yetirsələr də, veb layihələrin hazırlanmasında birlikdə istifadə olunurlar.

HTML səhifənin strukturunu müəyyən edir. Başlıqlar, mətnlər, şəkillər, linklər və formalar HTML vasitəsilə təşkil olunur.

CSS səhifənin vizual görünüşünü idarə edir. Rənglər, şriftlər, ölçülər, boşluqlar, elementlərin yerləşməsi və müxtəlif ekranlara uyğun dizayn CSS ilə hazırlanır.

JavaScript isə səhifəyə dinamik davranış və interaktiv funksiyalar əlavə edir. Məsələn, düyməyə klik etdikdə menyunun açılması, məlumatların serverdən alınması və istifadəçi əməliyyatlarına uyğun yenilənməsi JavaScript vasitəsilə həyata keçirilə bilər. Sadə müqayisə ilə HTML saytın skeleti, CSS görünüşü, JavaScript isə onun interaktiv davranışını təmin edən texnologiyadır.

Bu üç texnologiyanı öyrəndikdən sonra React və Next.js kimi müasir veb texnologiyalarına keçmək daha asan olur.

HTML proqramlaşdırma dilidirmi?

HTML çox vaxt proqramlaşdırma dili ilə qarışdırılır. Əslində isə HTML proqramlaşdırma dili deyil, işarələmə dilidir (Markup Language). Proqramlaşdırma dilləri dəyişənlər, şərt operatorları, dövrlər, funksiyalar və digər məntiqi əməliyyatlar vasitəsilə proqramın davranışını müəyyən etməyə imkan verir. HTML-in əsas vəzifəsi isə məzmunu təsvir etmək və strukturlaşdırmaqdır. Məsələn, HTML vasitəsilə düymə yaratmaq mümkündür. Ancaq düyməyə klik etdikdə xüsusi əməliyyatın yerinə yetirilməsi üçün JavaScript kimi əlavə texnologiyadan istifadə oluna bilər.

HTML və SEO arasında hansı əlaqə var?

HTML yalnız veb səhifənin görünən strukturunu yaratmaq üçün istifadə olunmur. Düzgün HTML quruluşu axtarış sistemlərinin səhifədəki məzmunu anlamasına da kömək edir. Məsələn, başlıq elementlərinin məntiqi ardıcıllıqla istifadə edilməsi məqalənin strukturunu daha aydın göstərir. Title elementi səhifənin adını müəyyən edir. Meta description isə axtarış sistemlərinə səhifənin qısa təsvirini təqdim etmək üçün istifadə oluna bilər. Şəkillərdə alt atributundan istifadə edilməsi onların məzmununu mətn şəklində təsvir etməyə imkan verir. Bu, xüsusilə əlçatanlıq baxımından vacibdir. Semantik HTML elementlərinin düzgün seçilməsi də səhifənin strukturunu daha anlaşıqlı edir. Bununla belə, yalnız HTML strukturunun düzgün hazırlanması axtarış nəticələrində yüksək mövqe qazanmağa zəmanət vermir. Məzmunun keyfiyyəti, texniki optimizasiya və digər SEO amilləri də əhəmiyyət daşıyır.

HTML necə öyrənilir?

HTML öyrənmək üçün əvvəlcədən proqramlaşdırma biliyinə sahib olmaq vacib deyil. Sadə mətn redaktoru və veb brauzer vasitəsilə ilk HTML səhifəsini hazırlamaq mümkündür. Başlanğıc mərhələdə HTML sənədinin quruluşunu, əsas teqləri, linklərin və şəkillərin əlavə olunmasını, siyahıları, cədvəlləri, formaları və semantik elementləri öyrənmək faydalıdır. Növbəti mərhələdə kiçik praktik layihələr hazırlamaq tövsiyə olunur. Məsələn, şəxsi portfolio, sadə xəbər səhifəsi və ya məhsul təqdimatı hazırlamaqla HTML biliklərini möhkəmləndirmək mümkündür. HTML-dən sonra CSS və JavaScript öyrənərək daha funksional və vizual baxımdan inkişaf etmiş veb səhifələr yaratmaq olar.

Əgər proqramlaşdırma sahəsinə sıfırdan başlamaq istəyirsinizsə, Frontend proqramçı olmaq üçün nədən başlamaq lazımdır? məqaləsində öyrənmə ardıcıllığı ilə ətraflı tanış ola bilərsiniz.

HTML, CSS, JavaScript, React və digər müasir veb texnologiyalarını praktiki layihələr vasitəsilə öyrənmək üçün JET Academy-də keçirilən Frontend Proqramlaşdırma Təlimi ilə tanış olun.