AlegsaOnline.com

Kas ir HTML? Hiperteksta iezīmēšanas valodas (HTML) definīcija un HTML5 pārskats

Uzzini, kas ir HTML un HTML5 — definīcija, pamatelementi, metadati, CSS un JavaScript integrācija. Praktisks pārskats tīmekļa izstrādei.

Autors: Leandro Alegsa

28-09-2025

Hiperteksta iezīmēšanas valoda (HTML) ir iezīmēšanas valoda, kas paredzēta tīmekļa vietņu izveidei un struktūras aprakstam. Tīmekļa lapas parasti tiek atvērtas tīmekļa pārlūkprogrammā un var saturēt tekstu, video, attēlus, saites, formas un pat skaņu. HTML nosaka, kā jūsu saturs ir atzīmēts — tas ļauj pārlūkprogrammām saprast, kas ir virsraksts, kur sākas rindkopas, kur ir saites vai multivide, un tādējādi pareizi attēlot lapu lietotājam. HTML arī ļauj pievienot metadatus — informāciju par lapu (piemēram, autoru, valodu vai lapas aprakstu), ko pārlūkprogramma parasti nerāda, bet kas ir svarīga meklētājiem un rīkiem.

HTML ir cieši saistīts ar citām tīmekļa tehnoloģijām: Kaskādes stila lapas (CSS) nosaka vizuālo izskatu un izkārtojumu, savukārt JavaScript ļauj dinamiskus uzvedības un satura manipulācijas. Standarta specifikācijas par HTML izstrādi piedalās organizācijas, piemēram, World Wide Web Consortium (W3C), bet mūsdienās HTML kodola attīstību uztur arī WHATWG kā "living standard". W3C ir publicējis stabilas HTML versijas (piem., HTML 5.2), kamēr WHATWG uztur pastāvīgi atjaunotu dzīvo standartu.

Kā HTML strādā

HTML dokuments sastāv no elementiem, kas parasti ierāmēti ar atverošajām un aizverošajām taga iezīmēm, piemēram, <p> (rindkopa) vai <h1> (virsraksts). Elementi var saturēt tekstu, citus elementus, atribūtus (piem., src attēlam vai href saitei) un komentārus. Pārlūkprogramma parsē HTML kodu un renderē to vizuālā formā, saprotot semantiku un struktūru, ko autors ir norādījis.

Pamata HTML struktūra

Tipiska HTML lapas struktūra izskatās šādi:

<!doctype html> <html lang="lv">   <head>     <meta charset="utf-8">     <title>Lapas virsraksts</title>     <meta name="description" content="Īss lapas apraksts">     <link rel="stylesheet" href="styles.css">   </head>   <body>     <h1>Sveiki, pasaule!</h1>     <p>Šī ir parauga lapa.</p>     <script src="app.js"></script>   </body> </html>

Biežāk sastopamie HTML elementi

<h1>–<h6>: virsraksti
<p>: rindkopas
<a href="...">: saites
<img src="..." alt="...">: attēli (ar svarīgo alt atribūtu pieejamībai)
<ul>, <ol>, <li>: saraksti
<table>: tabulas (ja nepieciešams tabulārs saturs)
<form>, <input>, <button>: formas un lietotāja ievade
<header>, <nav>, <main>, <article>, <section>, <aside>, <footer>: semantiskie elementi, kas uzlabo strukturēšanu un pieejamību

Kas jauns HTML5 un mūsdienu HTML

HTML5 ieviesa daudzus uzlabojumus salīdzinājumā ar vecākām versijām, tostarp:

Semantiskie elementi (piem., <header>, <footer>, <article>, <section>), kas padara lapu struktūru jēgpilnāku gan cilvēkiem, gan mašīnām.
Iebūvēta multivide: <video> un <audio> elementi ļauj atskaņot multividi bez papildus spraudņiem.
Canvas un SVG atbalsts grafikai un zīmēšanai (2D/3D) tieši pārlūkā.
Uzlabotas formas un ievades tipu atbalsts (piem., date, email, number), validācija un API.
Jaunas API iespējas: vietējā glabāšana (localStorage), geolokācija, Web Workers, Service Workers, WebSockets u.c., kas ļauj veidot bagātīgas lietotnes tieši tīmeklī.

Pieejamība, SEO un drošība

Labas prakses ietver semantisku HTML izmantošanu, pareizu alt atribūtu attēliem, virsrakstu hierarhiju, formularu marķējumu, un, ja nepieciešams, ARIA atribūtus, lai uzlabotu pieejamību cilvēkiem ar īpašām vajadzībām. Metadati (piem., <meta name="description">) palīdz meklētājprogrammām interpretēt saturu un var ietekmēt meklēšanas rezultātus (SEO). Drošības ziņā ir svarīgi izvairīties no XSS ievainojamībām, pareizi apstrādājot lietotāja ievadi un lietojot drošus HTTP virsrakstus (CSP utt.).

Rīki un pārbaude

HTML validatori palīdz atrast sintakses kļūdas un nodrošināt atbilstību standartiem.
Izstrādātāja rīki pārlūkprogrammā ļauj pārbaudīt DOM, CSS un tīkla pieprasījumus.
Pieejamības pārbaudes rīki un skeneri palīdz uzlabot lietotāju pieredzi visiem.

Sākšana un mācīšanās

Ja sākat mācīties HTML, ieteicams:

Sākt ar pamata elementiem un lapas struktūru (, <html>, <head>, <body>).
Mācīties semantiku un pieejamību no paša sākuma.
Praktizēt, veidojot vienkāršas lapas un pakāpeniski pievienojot CSS un JavaScript.
Izmantot validācijas rīkus un lasīt oficiālās specifikācijas vai uzticamus mācību avotus.

HTML ir pamats, uz kura būvē visu tīmekli — saprotot tā pamatus un mūsdienu iespējas, jūs varēsiet veidot gan vienkāršas statiskas lapas, gan sarežģītas interaktīvas tīmekļa lietotnes.

Piemērs

Šeit ir sniegts HTML lapas piemērs.

1 <!DOCTYPE html> 2 < html> 3 < head> 4 < title> Šis ir lapas virsraksts </title> 5 </head> 6 < body> 7 < p> Šis ir punkts. </p> 8 < a href="https://www.domain.com"> Šī ir saite </a> 9 < img src="image.jpg" alt="Attēls"> 10 </body> 11 </html> 11 </html>

Vienkārša HTML lapa būtu šāda: viena rindkopa ar tekstu "Hello world! ".

1 <!DOCTYPE html> 2 < html> 3 < head> 4 < title> Hi! </title> 5 </head> 6 < body> 7 < p> Hello world! </p> 8 </body> 9 </html>

Pamata HTML tagi

Birkas nosaukums	Nosaukums	Funkcija	Koda piemērs
`<!DOCTYPE>`	Doctype	Definē dokumenta veidu	<!DOCTYPE html>
`<html>`	HTML	Definē HTML dokumentu un sāk HTML dokumentu.	< html> Viss kods</html>
`<head>`	Galvenais	Satur jebkuru kodu, kas netiek izmantots, lai parādītu tīmekļa lapas elementus.	< head></head>
`<virsraksts>`	Nosaukums	Nosaka tīmekļa vietnes nosaukumu (redzams cilnē) un tiek ievadīts `<head>.`	<virsraksts> Tīmekļa vietne</virsraksts>
`<body>`	Ķermenis	Satur redzamos tīmekļa lapas elementus (un satur rindkopu un citus elementus).	< body> Html tagi</body>
`<h1>` līdz `<h6>`	Virsraksti	Dažāda lieluma virsraksti `(<h1>` ir lielākais).	< h1> Virsraksts</h1>
<p>	Punkts	Definē teksta rindkopu	< p> TEKSTS</p>
	Anchor	Izveido aktīvas saites uz citām tīmekļa lapām	< a href="www.domain.com"> Apmeklējiet mūsu vietni</a>
`<img>`	Attēls	Tiek parādīts attēls lapā	< img src="ImageUrl" alt="Teksts tiek parādīts, ja attēls nav pieejams">
`<br>`	Pārtraukums	Ievieto vienu rindas pārrāvumu	Teksts < br> Teksts
`<center>`	Centrs	Satura pārvietošana uz lapas centru	< center> Kods</center>
`<script>`	Skripts	Weblapā tiek izveidots skripts, kas parasti ir rakstīts JavaScript.	< script> document. write("Hello World!")</script>

HTML birku lietošana

Tīmekļa vietnes izveide

Veidot tīmekļa lapu ir vienkārši.Viss, kas jums jāatceras, ir tagi un kārtība, lai izveidotu tīmekļa lapu.

Vispirms jāatrod vieta, kur ievadīt HTML tagus (iesaku izmantot piezīmjdatoru), un jāievada tagi.

Šeit ir vēl viens HTML tagu lapas piemērs.

<html>

<head>

<title> Sveiki! <title>

<h1> Sveika, pasaule!</h1>

</head>

<body>

<p>

Šī ir HTML tagu lapa.

</p>

Līdz: *Insert name here*

</footer>

</html>

Kad esat pabeidzis, saglabājiet šo formātā: helloworld.htm.

(nelieciet atstarpes)

Un viss ir paveikts! Kad saglabāsiet to datorā, ja nospiedīsiet to, tas nosūtīs jūs uz jūsu tīmekļa vietni Google!

Jautājumi un atbildes

J: Kas ir HTML?

A: HTML ir iezīmēšanas valodas veids, ko izmanto, lai izveidotu tīmekļa lapas, kurās ir rakstīts, ir saites, attēli un audiovizuāli materiāli.

J: Kāda ir HTML funkcija?

A: HTML uzdevums ir norādīt tīmekļa pārlūkprogrammām, kādām jābūt tīmekļa lapām, un pievienot metainformāciju, piemēram, tīmekļa lapas veidotāja vārdu.

J: Kādi ir daži multivides piemēri, ko var iekļaut tīmekļa lapās, kuras izveidotas, izmantojot HTML?

A: Daži multivides piemēri, ko var iekļaut tīmekļa lapās, kuras izveidotas, izmantojot HTML, ir audiofaili un videoklipi.

J: Kā CSS papildina HTML?

A: CSS izmanto, lai mainītu HTML lapu izskatu.

J: Kāda ir JavaScript loma tīmekļa vietņu izstrādē?

A: JavaScript ir būtiska skriptu valoda tīmekļa vietņu izstrādē, jo tā nosaka, kā rīkoties tīmekļa vietnēm, un var mainīt HTML un CSS izskatu.

J: Kas ir atbildīgs par HTML izveidi?

A: HTML ir izveidojis World Wide Web Consortium (W3C).

J: Kāda ir pašreizējā HTML standarta versija?

A: No 2018. gada septembra HTML 5 ir jaunākā HTML standarta versija (5.2 versija).