Posma iestatīšana: parunāsim par HTML. HTML tagu atsauce Īss html apraksts

Pasaules tīmeklis sastāv no tīmekļa lapām, un šīs lapas tiek veidotas, izmantojot hiperteksta iezīmēšanas valodu (HTML). Lai gan daudzi cilvēki, īpaši iesācēji, šodien runā par "HTML programmēšanu", HTML tas ir iezīmēšanas valoda. Jūs izmantojat HTML, lai atzīmētu teksta dokumentu, tāpat kā redaktors izmantotu biezu sarkanu zīmuli. Šīs atzīmes kalpo, lai noteiktu formātu (vai stilu), kas tiks izmantots, parādot tekstu monitora ekrānā.

HTML pamati

Šeit ir īss ceļvedis HTML rakstīšanai. Daudzi cilvēki joprojām raksta HTML, izmantojot rīkus, kas ir līdzīgi Notepad vai SimpleText. Šī apmācība palīdzēs jums iegūt pamata izpratni par HTML. Pat ja jūs neplānojāt rediģēt HTML tieši, bet gan izmantojāt HTML redaktoru, piemēram, Netscape Composer vai FrontPage, šī rokasgrāmata palīdzēs labāk izmantot šos rīkus un arī padarīs jūsu HTML dokumentus saprotamus lielākajai daļai pārlūkprogrammu. Kad esat redzējis priekšrocības, ko sniedz HTML rakstīšanas pamatu pārzināšana, iespējams, vēlēsities apskatīt materiālu sadaļā Advanced HTML.

Labs veids, kā mācīties, ir skatīties, kā citi cilvēki kodē savas HTML lapas. Lai to izdarītu, pārlūkprogrammā atlasiet “Skatīt” un pēc tam atlasiet “Avots” (“Kā HTML”).

Šī lapa jums iemācīs, kā:

pievienojiet virsrakstus un rindkopas
tekstu slīprakstā
mainīt teksta krāsu un izmēru
ievietot attēlus
izveidot saites uz citām lapām
izmantot dažāda veida sarakstus

Ja meklējat kaut ko citu, izmēģiniet Advanced HTML

Virsrakstu un rindkopu pievienošana

Ja esat izmantojis Microsoft Word, jums vajadzētu zināt stilu izmantošanu, lai izceltu virsrakstus pēc svarīguma. HTML valodā virsraksti ir sadalīti sešos svarīguma līmeņos. H1 ir vissvarīgākais, H2 ir nedaudz mazāk svarīgs, un visbeidzot H6 ir vismazāk svarīgs.

Piemērs, kā pievienot svarīgu nosaukumu:

Svarīgs virsraksts

Rezultāts:

Svarīgs virsraksts

un nedaudz mazāk svarīgi:

Nedaudz mazāk svarīgi

Rezultāts:

Nedaudz mazāk svarīgi

Katrai rakstītajai rindkopai jāsākas ar atzīmi

Un beidziet ar tagu

. Piemēram:

Šī ir pirmā rindkopa.

Un šī ir otrā rindkopa.

Slīpraksts

Varat izcelt vienu vai vairākus vārdus, izmantojot tagu, piemēram:

Šis ir patiešām interesants punkts!

Rezultāts:

Tas tiešām ir interesanti punktu!

Teksta krāsas un izmēra maiņa

FONT tagu var izmantot, lai norādītu krāsu un fonta lielumu, kādā tiks parādīts jūsu teksts. Šis piemērs nosaka krāsu:

Šajā teikumā ir dzeltenā krāsā iezīmēts vārds.

Rezultāts:

Šajā teikumā ir dzeltenā krāsā izcelts vārds.

Atribūts size tiek izmantots, lai norādītu fonta lielumu patvaļīgās vienībās no 1 līdz 7. Ir vispārpieņemts, ka “parastā” fonta izmērs atbilst skaitlim 3. Lielumu var norādīt vai nu kā absolūtu vērtību (SIZE= 5) vai kā relatīvu vērtību (SIZE=+2):

Veterinārārsta padoms

Rezultāts:

Veterinārārsta padoms

Attēlu ievietošana

Izmantojot attēlus, jūsu lapas kļūst interesantākas. Tags ļauj ievietot attēlu . Pieņemsim, ka attēla fails "peter.jpeg", 200 pikseļus plats un 150 pikseļus augsts, atrodas tajā pašā mapē ar HTML failu.

Platuma un augstuma norādīšana nav obligāti nepieciešama, taču tas palielinās jūsu WEB lapas ielādes ātrumu. Jums ir jāiestata attēla apraksts cilvēkiem, kuri ir atspējojuši attēla ielādi. Varat pievienot īsu aprakstu, izmantojot alt atribūtu:

WWW izmanto divus grafiskos failu formātus: GIF un JPEG. GIF formāts tiek izmantots, ja nepieciešams caurspīdīgs attēls vai animācija, kā arī:

melnbalti zīmējumi un teksts
attēli ar ierobežotu krāsu skaitu
grafika ar asām malām (izvēlnes, pogas, diagrammas utt.)
attēli ar tekstu

JPEG formāts ir piemērotāks šādos gadījumos:

skenēti attēli
grafika ar sarežģītu krāsu un toņu kombināciju
jebkurš attēls ar vairāk nekā 256 krāsu paleti

Saišu izveide uz citām lapām

Teksts starp Un izmanto kā saites aprakstu, parasti norādīts zilā krāsā un pasvītrots ar līniju.

Saraksti

HTML piedāvā trīs veidu sarakstus. Pirmo veidu sauc par sarakstu ar aizzīmēm (nesakārtotu). Tiek atvērts saraksts ar aizzīmēm ar atzīmi

, piemērs:
- pirmais vienums sarakstā
- otrais vienums sarakstā
- trešais punkts sarakstā
Rezultāts:
- pirmais vienums sarakstā
- otrais vienums sarakstā
- trešais punkts sarakstā
Otrais veids ir numurēts (sakārtots) saraksts. Tas izmanto tagus un
. Piemērs:
pirmais vienums sarakstā
otrais vienums sarakstā
trešais punkts sarakstā

Rezultāts:

pirmais vienums sarakstā
otrais vienums sarakstā
trešais punkts sarakstā

Un pēdējais ir definīciju saraksts (glosārijs). Tas attēlo tekstu vārdnīcas ieraksta veidā, kas sastāv no definēta termina un rindkopas, kas atklāj tā nozīmi, kas atvērta ar tagu. Katrs termins tiek atvērts ar tagu, un definīcija tiek atvērta ar tagu. Piemērs:

pirmais termins tā definīcija otrais termins tā definīcija trešais termins tā definīcija

Rezultāts:

Pirmais termins tā definīcija otrais termins tā definīcija trešais termins tā definīcija

Sarakstus var ligzdot vienu otrā. Piemērs:

pirmais vienums sarakstā
otrais vienums sarakstā
- ligzdotā saraksta pirmais vienums
- ligzdotā saraksta otrais vienums
trešais punkts sarakstā

Rezultāts:

pirmais vienums sarakstā
otrais vienums sarakstā
- ligzdotā saraksta pirmais vienums
- ligzdotā saraksta otrais vienums
trešais punkts sarakstā

HTML valodā krāsas tiek norādītas ar heksadecimāliem skaitļiem. Krāsu sistēmas pamatā ir trīs pamatkrāsas - sarkana, zaļa un zila. Katrai krāsai ir iestatīta vērtība no 00 līdz FF. Pēc tam šīs vērtības tiek apvienotas vienā ciparā, pirms kura ir simbols #. Šajā tabulā ir parādītas dažādas krāsas un to heksadecimālais kods.

FFF
FFF

CCC
CCC

999
999

666
666

333
333

000
000

FFC
C00

FF9
900

FF6
600

FF3
300

99C
C00

CC9
900

FFC
C33

FFC
C66

FF9
966

FF6
633

CC3
300

CC0
033

CCF
F00

CCF
F33

333
300

666
600

999
900

CCC
C00

FFF
F00

CC9
933

CC6
633

330
000

660
000

990
000

CC0
000

FF0
000

FF3
366

FF0
033

99F
F00

CCF
F66

99C
C33

666
633

999
933

CCC
C33

FFF
F33

996
600

993
300

663
333

993
333

CC3
333

FF3
333

CC3
366

FF6
699

FF0
066

66F
F00

99F
F66

66C
C33

669
900

999
966

CCC
C66

FFF
F66

996
633

663
300

996
666

CC6
666

FF6
666

990
033

CC3
399

FF6
6CC

FF0
099

33F
F00

66F
F33

339
900

66C
C00

99F
F33

CCC
C99

FFF
F99

CC9
966

CC6
600

CC9
999

FF9
999

FF3
399

CC0
066

990
066

FF3
3CC

FF0
0CC

00C
C00

33C
C00

336
600

669
933

99C
C66

CCF
F99

FFF
FCC

FFC
C99

FF9
933

FFC
CCC

FF9
9CC

CC6
699

993
366

660
033

CC0
099

330
033

33C
C33

66C
C66

00F
F00

33F
F33

66F
F66

99F
F99

CCF
FCC

CC9
9CC

996
699

993
399

990
099

663
366

660
066

006
600

336
633

009
900

339
933

669
966

99C
C99

FFC
CFF

FF9
9FF

FF6
6FF

FF3
3FF

FF0
0FF

CC6
6CC

CC3
3CC

003
300

00C
C33

006
633

339
966

66C
C99

99F
FCC

CCF
FFF

339
9FF

99C
CFF

CCC
CFF

CC9
9FF

996
6CC

663
399

330
066

990
0CC

CC0
0CC

00F
F33

33F
F66

009
933

00C
C66

33F
F99

99F
FFF

99C
CCC

006
6CC

669
9CC

999
9FF

999
9CC

993
3FF

660
0CC

660
099

CC3
3FF

CC0
0FF

00F
F66

66F
F99

33C
C66

009
966

66F
FFF

66C
CCC

669
999

003
366

336
699

666
6FF

666
6CC

666
699

330
099

993
3CC

CC6
6FF

990
0FF

00F
F99

66F
FCC

33C
C99

33F
FFF

33C
CCC

339
999

336
666

006
699

003
399

333
3FF

333
3CC

333
399

333
366

663
3CC

996
6FF

660
0FF

00F
FCC

33F
FCC

00F
FFF

00C
CCC

009
999

006
666

003
333

339
9CC

336
6CC

000
0FF

000
0CC

000
099

000
066

000
033

663
3FF

330
0FF

00C
C99

009
9CC

33C
CFF

66C
CFF

669
9FF

336
6FF

003
3CC

330
0CC

00C
CFF

009
9FF

006
6FF

003
3FF

Vienkāršības labad HTML definē 16 standarta krāsas, kas kopā ar to heksadecimālajiem kodiem ir norādītas tālāk.

melns = "#000000"	zaļš = "#008000"
sudrabs = "# C0C0C0"	laima = "#00FF00"
pelēks = "#808080"	olīvu = "#808000"
balts = "#FFFFFF"	dzeltens = "#FFFF00"
sarkanbrūns = "#800000"	flote = "#000080"
sarkans = "#FF0000"	zils = "#0000FF"
violeta = "#800080"	zila krāsa = "#008080"
fuksija = "#FF00FF"	aqua = "#00FFFF"

HTML pamati satur HTML valodas pamatnoteikumus, HTML lapas struktūras aprakstu un attiecības HTML dokumenta struktūrā starp HTML elementiem.

HTML dokuments ir parasts teksta dokuments, ko var izveidot vai nu parastā teksta redaktorā (Notepad), vai specializētā ar koda izcelšanu (Notepad++, Visual Studio Code utt.). HTML dokumentam ir .html paplašinājums.

HTML dokuments sastāv no HTML elementu koka un teksta. Katrs elements avota dokumentā ir identificēts ar sākuma (atvēršanas) un beigu (noslēguma) tagu (ar retiem izņēmumiem).

Sākuma tags parāda, kur elements sākas, beigu tags parāda, kur tas beidzas. Noslēguma tagu veido, pirms taga nosaukuma pievienojot slīpsvītru /: .... Starp sākuma un beigu tagiem ir atzīmes saturs – saturs.

Atsevišķi tagi nevar tieši saglabāt saturu, tas ir rakstīts kā atribūta vērtība, piemēram, tags izveidos pogu ar tekstu Button.

Tagus var ligzdot viens otrā, piemēram,

Teksts

HTML elementiem var būt atribūti (globāli, piemēroti visiem HTML elementiem un savi). Atribūti tiek ierakstīti elementa sākuma tagā un satur nosaukumu un vērtību, kas norādīta formātā atribūtā name="value" . Atribūti ļauj mainīt tā elementa īpašības un uzvedību, kuram tie ir iestatīti.

Katram elementam var piešķirt vairākas klases vērtības un tikai vienu id vērtību. Vairākas klašu vērtības ir rakstītas atdalot ar atstarpi, . Klases un id vērtībām jāsastāv tikai no burtiem, cipariem, defisēm un pasvītrām, un tām jāsākas tikai ar burtiem vai cipariem.

Pārlūks apskata (interpretē) HTML dokumentu, veidojot tā struktūru (DOM) un attēlojot to saskaņā ar šajā failā ietvertajām instrukcijām (stila lapas, skripti). Ja marķējums ir pareizs, pārlūkprogrammas logā tiks parādīta HTML lapa, kas satur HTML elementus - galvenes, tabulas, attēlus utt.

Interpretācijas process (parsēšana) sākas, pirms tīmekļa lapa ir pilnībā ielādēta pārlūkprogrammā. Pārlūkprogrammas apstrādā HTML dokumentus secīgi no sākuma, vienlaikus apstrādājot CSS un saista stila lapas ar lapas elementiem.

HTML dokuments sastāv no divām sadaļām - galvenes - starp tagiem ... un satura daļas - starp tagiem ....

HTML ievēro noteikumus, kas ietverti dokumenta tipa deklarācijas failā (Dokumenta tipa definīcija jeb DTD). DTD ir XML dokuments, kas nosaka, kuri tagi, atribūti un to vērtības ir derīgas konkrētam HTML tipam. Katrai HTML versijai ir savs DTD.

DOCTYPE ir atbildīgs par to, lai pārlūkprogramma pareizi parādītu tīmekļa lapu. DOCTYPE norāda ne tikai HTML versiju (piemēram, html), bet arī atbilstošo DTD failu internetā.

...

Elementi tagā veido dokumentu koku, tā saukto dokumenta objekta modeli, DOM (dokumenta objekta modeli). Šajā gadījumā elements ir saknes elements.

Lai izprastu tīmekļa lapas elementu mijiedarbību, ir jāņem vērā tā sauktās “ģimenes attiecības” starp elementiem. Attiecības starp vairākiem ligzdotiem elementiem tiek klasificētas kā vecāks, bērns un māsa.

Sencis ir elements, kas satur citus elementus. 1. attēlā visu elementu priekštecis ir . Tajā pašā laikā elements ir visu tajā ietverto tagu priekštecis: ,

Pēcnācējs ir elements, kas atrodas vienā vai vairākos elementu tipos. Piemēram, ir , un elementa pēctecis

Ir abu un pēctecis.

Vecuma elements ir elements, kas ir saistīts ar citiem elementiem zemākā līmenī un atrodas virs tiem kokā. 1. attēlā un . Tag

Vai vecākiem ir tikai .

Bērnu elements ir elements, kas ir tieši pakārtots citam elementam augstākā līmenī. 1. attēlā ir tikai elementi , ,

Un viņi ir bērni.

Māsas elements ir elements, kam ir kopīgs vecākelements ar attiecīgo elementu, tā sauktie viena līmeņa elementi. 1. attēlā un ir viena līmeņa elementi, kā arī elementi , un

Viņas ir viena otrai māsas.

Sadaļa ... satur tehnisko informāciju par lapu: virsraksts, apraksts, atslēgvārdi meklētājprogrammām, kodējums utt. Tur ievadītā informācija netiek parādīta pārlūkprogrammas logā, bet tajā ir informācija, kas pārlūkprogrammai norāda, kā apstrādāt lapu.

Nepieciešamā sadaļas atzīme ir . Teksts, kas ievietots šajā tagā, tiek parādīts tīmekļa pārlūkprogrammas virsrakstjoslā. Virsrakstam nevajadzētu būt garākam par 60 rakstzīmēm, lai tas pilnībā ietilptu nosaukumā. Virsraksta tekstā jāietver vispilnīgākais tīmekļa lapas satura apraksts.

Neobligāts sadaļas tags ir viens tags. Ar tās palīdzību jūs varat iestatīt lapas satura aprakstu un atslēgvārdus meklētājprogrammām, HTML dokumenta autoru un citus metadatu rekvizītus. Elementā var būt vairāki elementi, jo tiem ir atšķirīga informācija atkarībā no izmantotajiem atribūtiem.

Lapas satura un atslēgvārdu aprakstu var norādīt vienlaikus vairākās valodās, piemēram, krievu un angļu valodā:

Izmantojot tagu, varat bloķēt vai atļaut meklētājprogrammām tīmekļa lapas indeksēšanu.

Lai automātiski atkārtoti ielādētu lapu pēc noteikta laika, jums ir jāizmanto atsvaidzināšanas vērtība:

Lapa tiks atkārtoti ielādēta pēc 30 sekundēm. Lai novirzītu apmeklētāju uz citu lapu, url parametrā ir jānorāda URL:

Virsraksta metataga saturs

Galvenās lapas saturs

Tagad pāriesim uz galveno tehnisko metatagu aprakstu no grupas “HTTP-EQUIV” (HTTP ekvivalenti).

Tehniskie metatagi vietnei ir ļoti svarīgi. Ar to palīdzību jūs varat kontrolēt lapas attēlojumu, indeksēšanas iestatījumus utt. Šajā apmācībā mēs apskatīsim pamata tehniskos metatagus.

content-type - dokumenta veids un tā kodējums. Šis metatags ir nepieciešams, lai pārlūkprogramma pareizi attēlotu rakstzīmes.
Ir daudz kodējumu. Lielāko daļu no viņiem jūs pat nekad nesatiksit. Nemaz nerunājot par to, ka tu tos izmantosi pats. Mūsdienu pārlūkprogrammas automātiski nosaka kodējuma veidu, taču, lai nodrošinātu lielāku pārliecību, varat to norādīt pats. Ja operētājsistēmā Windows izveidojat HTML dokumentu, kura valoda ir krievu, tad kodējums būs “windows-1251”, un metataga ievietošanas kods ir šāds:
Virsraksta metataga saturs
Galvenās lapas saturs
content-language - norādot dokumenta valodu. Šī neobligātā metataga vērtību izmanto gan meklēšanas roboti, gan tīmekļa serveri. Iegult kodu:
Virsraksta metataga saturs
Galvenās lapas saturs
atsvaidzināšana - laiks (sekundēs), pēc kura dokuments automātiski pārlādēsies vai pāries uz citu html lapu ar norādīto adresi (url). Piemēram, lai automātiski atkārtoti ielādētu dokumentu ik pēc 30 sekundēm, šis metatags ir jāievieto šādi:
Virsraksta metataga saturs
Galvenās lapas saturs

Un, lai pēc 5 sekundēm pārietu uz lapu vietnē http://www.site/, jums jāraksta:

Virsraksta metataga saturs
Galvenās lapas saturs
robots ir metatags, kas ir atbildīgs par lapu indeksēšanas iestatījumiem. Metatagam "robots" var būt šādas vērtības:
- indekss - lapa ir indeksēta;
- noindex - lapa nav indeksēta;
- sekot - tiek ņemtas vērā hipersaites lapā;
- nofollow - lapā esošās hipersaites netiek ņemtas vērā
- visi - aizstāj “index” un “follow”, t.i. lapa tiek indeksēta un tajā esošās hipersaites tiek ņemtas vērā (pēc noklusējuma);
- nav - aizstāj “noindex” un “nofollow”, t.i. lapa netiek indeksēta, un tajā esošās hipersaites netiek ņemtas vērā.
Kods metataga “robots” ievietošanai:

Virsraksta metataga saturs
Galvenās lapas saturs

autors un autortiesības ir metatagi, kas ļauj norādīt lapas satura autorību un īpašnieku. HTML iegulšanas kods:

Virsraksta metataga saturs

Galvenās lapas saturs

Tie ir visi HTML metatagi, kas būs nepieciešami iesācējam. Pārējie ir specifiski, un tie var būt nepieciešami pēc tam, kad esat ieguvis pieredzi un precīzi zināt, ko darāt. No visa iepriekš minētā es stingri iesaku katrā jūsu vietnes lapā izmantot tālāk norādīto.

Lapas nosaukums

Ja nepieciešams, izmantojiet tērauda izstrādājumus, taču neuztraucieties pārāk daudz. Atcerieties, ka metatagi nepadarīs jūsu vietni interesantu, tie var tikai palīdzēt pārlūkprogrammai un tīmekļa serverim pareizi attēlot vietnes lapas un meklētājprogrammai tās atrast.

Šī manas vietnes sadaļa beidzot ir pabeigta, un tad mēs runāsim par to, kur sākt reklamēt un reklamēt jūsu vietni internetā. Ir arī daži mani padomi no personīgās pieredzes par vietņu lapu optimizēšanu. Noklikšķiniet uz "Tālāk".

Vlads Merževičs

Meta tagus izmanto, lai saglabātu informāciju, kas paredzēta pārlūkprogrammām un meklētājprogrammām. Piemēram, meklētājprogrammas piekļūst metatagiem, lai iegūtu vietņu aprakstus, atslēgvārdus un citus datus.

Vietņu izstrādātāju vidū valda uzskats, ka pareizi uzrakstīti metatagi ļauj pacelties meklētājprogrammu augšgalā.

Faktiski tā nav taisnība, jūs nepalielināsieties tikai ar metatagiem, taču slikti izpildīts metatagu saturs var pasliktināt vietnes rangu.

Divi metatagi ir īpaši izstrādāti meklētājprogrammām: apraksts un atslēgvārdi. Daži tīmekļa pārziņi atslēgvārdu sadaļai pievienoja atslēgvārdus, kuriem nebija nekāda sakara ar vietnes tēmu, taču tie tomēr guva zināmus panākumus meklētājprogrammu apmeklētāju vidū. Tomēr pēc kāda laika meklētājprogrammas iemācījās tikt galā ar šo parādību un pārbaudīt, vai tīmekļa lapas saturs atbilst norādītajiem atslēgvārdiem.

Daži principi saistībā ar meta tagiem:
neiekļaujiet atslēgvārdus, kas nav ietverti jūsu lapās;
neatkārtojiet atslēgvārdus;
izmantot metatagus paredzētajam mērķim;

apraksts

Lielākā daļa meklētājprogrammu, parādot meklēšanas rezultātus, parāda apraksta lauka saturu (1. piemērs).

Ja šī atzīme lapā nav, meklētājprogramma vienkārši uzskaitīs pirmos lapā atrastos vārdus, kuri, kā likums, nav īpaši saistīti ar tēmu.

apraksts

atslēgvārdi

Šis metatags bija paredzēts, lai aprakstītu lapā redzamos atslēgvārdus (2. piemērs). Taču rezultātā tagad ir diskreditēta to cilvēku rīcība, kuri ar jebkādiem līdzekļiem vēlas nokļūt meklētājprogrammu augšgalā.

Atslēgvārdus var uzskaitīt, atdalot tos ar atstarpēm vai komatiem. Meklētājprogrammas pašas pārveidos ierakstu formā, ko tās izmanto.

Lai pēc noteikta laika automātiski lejupielādētu jaunu dokumentu, izmantojiet http-equiv="refresh" instrukciju (3. piemērs).