Zdravo! U ovoj lekciji NEĆETE pronaći ništa korisno ako ste VEĆ upoznati s formiranjem strukture HTML dokumenta. Za one koji NISU upoznati, pokazat ću ispravnu (važeću) strukturu HTML web dokumenta, uključujući i WordPress stranicu.

Općenito ispravna struktura HTML dokumenta

Prije svega, bez puno uvoda, opća struktura svakog HTML dokumenta trebala bi biti ovakva:

/*Pokazuje trenutnu vrstu DTD dokumenta*/ /*Pokazuje početak dokumenta*/ /*Pokazuje početak naslova (zaglavlje)*/ Test/*Pokazuje naslov*/ /*Pokazuje početak naslova* / /*Prikazuje početak tijela dokumenta (body) */ /*Sadržaj dokumenta*/ /*Prikazuje kraj glavnog dijela dokumenta*/ /*Prikazuje kraj dokumenta*/

Ako uklonite objašnjenja koja sam pokazao nakon svake oznake, tada jednostavna struktura HTML dokumenta izgleda ovako

Test

Trenutačna vrsta DTD dokumenta

Trenutačna vrsta dokumenta ( Definicija vrste dokumenta, DTD) potreban je kako bi preglednik razumio kako interpretirati trenutnu web stranicu, jer HTML jezik postoji u nekoliko verzija.

Osim toga, postoje i drugi označni jezici osim HTML-a, kao što je XHTML.

Napomena: XHTML je EXtensible HyperText Markup Language, što se prevodi kao prošireni jezik za označavanje hiperteksta.

XHTML je sličan HTML-u, ali je sintaksa drugačija. Kako biste spriječili brkanje preglednika između jezika, morate ga prikazati u prvom retku koda, tip trenutnog dokumenta je DOCTYPE.

Koncept oznake u HTML-u

Jeste li primijetili da je cijela struktura HTML dokumenta određena određenim oznakama - određenim riječima u uglastim zagradama.

Riječ u uglastim zagradama u HTML dokumentu naziva se oznaka. Svaka oznaka ima svoje značenje, određeno pravilima označavanja.

• Tag označava naslov html dokumenta. Head oznake pohranjuju informacije za preglednike i tražilice. Uključujući u obliku meta oznaka;
• Tag označava glavni sadržaj html dokumenta. Odnosno tekst, slike, Java Script skripte itd.;
• Oznaka [p] je blok element i uvijek počinje u novom retku. To znači odlomak glavnog sadržaja html dokumenta.

Važno! Sve HTML oznake moraju biti uparene. To jest, početnu oznaku mora zatvoriti završna oznaka, nakon koje slijedi kosa crta.

Oznake naslova i podnaslova h1-h6

Za poboljšanje strukturiranja teksta dokumenta, kao i za poboljšanje SEO-a web stranica, postoje dodatne oznake sadržaja tijela. Zovu se oznake naslova i podnaslova od h1 do h6, ukupno 6.

One, baš kao i oznake [p]-odlomaka, koje vam omogućuju da istaknete semantičke dijelove teksta, omogućuju vam da podijelite tekst na semantičke dijelove, dajući svakom odjeljku vlastiti naslov.

Oznake h1 - h6 imaju podređenu ovisnost, niža razina ove podređenosti je paragraf.

Važno je napomenuti da prekidanje podređene ovisnosti oznaka h1 - h6 - p neće narušiti prikaz i valjanost dokumenta, već će samo pogoršati njegovu optimizaciju za tražilice.

Primjer razvijene strukture HTML dokumenta

Dopustite mi da vam dam akademski primjer razvijenije strukture HTML dokumenta:

Test Glavni naslov Glavni naslov Prvi podnaslov Glavni naslov Drugi podnaslov Prvi sporedni podnaslov

HTML 5 struktura

U HTML 5, struktura dokumenta bi trebala biti ovakva:

Ovo je deklaracija koja pokazuje da je ovaj dokument u HTML5;

ovo je korijenski element HTML stranice;

Element s meta oznakama o dokumentu;

Ovaj element definira naslov za dokument;

Ovaj element sadrži vidljivi sadržaj stranice;

Element definira veliki naslov

Element definira odlomak.

H2 - h6 oznake rade u html5

Sve oznake su dvostruke. Početna oznaka naziva se početnom oznakom, a završna oznaka naziva se završnom oznakom.

HTML označavanje na WordPress stranici

Unatoč činjenici da je WordPress skripta napisana u PHP-u, sve datoteke stranice, odnosno sve datoteke radnog predloška stranice, imaju html oznake. Pogledajmo primjer u datoteci header.php predloška Twenty Seventeen:

To možete vidjeti ako su sve WordPress funkcije smještene u klasično HTML označavanje. Postoji vrsta dokumenta:

Uparene oznake,

Oznaka za otvaranje.

Završna oznaka se nalazi u datoteci footer.php.

Kako vidjeti HTML kod stranice WordPress stranice

Ono što pišete u uređivaču stranice, stvarajući članke ili stranice, samo je dio HTML stranice stranice. Ovo čak nije ni cijeli dio stranice.

Za pregled HTML koda stranice WordPress stranice, a to je vrlo često potrebno, trebate:

Otvorite stranicu u pregledniku;

Prebacite se na engleski font tipkovnice;

Pritisnite sljedeće gumbe:

• Chrome: Ctrl+U
• Opera: Ctrl+U
• Mozilla: Ctrl+U

Možda još ne znate zašto je to potrebno. Vjerujte mi, ovo će vam trebati više puta kako biste analizirali svoje web mjesto i možda web stranice konkurencije.

Zaključak

Zaključno, htio sam izvući zaključak, ali jedino što mi pada na pamet je da se članak pokazao potpuno za početnike. Na prvi pogled postoji velika razlika između primjera koda članka i primjera sa stvarnih stranica. Međutim, sve datoteke imaju istu strukturu HTML dokumenta i iznimno je važno ne narušiti ovu strukturu pri radu sa web mjestom.

Svaki HTML dokument mora započeti oznakom< HTML >i završava s oznakom . Ove oznake pokazuju da linije između njih predstavljaju jedan HTML dokument. Osim toga, možete primijetiti da je HTML datoteka kao cjelina element HTML jezika.

Također, HTML dokument mora sadržavati elemente HEAD (informacije o dokumentu) i BODY (tijelo dokumenta).

odjeljak HEAD dokument

Odjeljak HEAD dokumenta definira njegov naslov i također sadrži dodatne informacije o dokumentu za preglednik. Ovaj odjeljak nije obavezan, ali preporučuje se da ga uvijek koristite u svojim HTML dokumentima jer dobro napisano zaglavlje može biti vrlo korisno.

Odjeljak zaglavlja počinje oznakom< HEAD >i odmah slijedi oznaku. Između uvodne i završne oznake elementa HEAD nalaze se drugi elementi zaglavlja.

Naziv dokumenta Naslov

Za davanje imena HTML dokumentu, oznaka je< TITLE >. Ovo će ime biti prikazano u naslovu prozora preglednika. Naslov je napisan između oznaka i i predstavlja redak teksta. Duljina ove linije može biti bilo koja, ali preporuča se da ne bude veća od 60 znakova. Element TITLE trebao bi se pojaviti samo u odjeljku HEAD.

Odjeljak TIJELO dokumenta

Ovaj dio dokumenta sadrži informacije koje se prikazuju u prozoru preglednika. Odjeljak BODY mora započeti oznakom< BODY >a završava oznakom između koje su smješteni HTML elementi koji čine sadržaj dokumenta.

Specifikacija elementa BODY

Oznaka ima niz atributa koji određuju izgled dokumenta. Ispod je specifikacija oznake.

TEXT="boja teksta"

BGCOLOR="boja pozadine"

BACKGROUND="adresa pozadinske slike"

Atribut TEXT određuje boju fonta za cijeli dokument u RGB ili znakovnoj notaciji. Prema zadanim postavkama (ako ovaj atribut nije naveden), koriste se postavke preglednika.

Atribut BGCOLOR određuje boju pozadine prozora preglednika dokumenata u RGB ili simboličkoj notaciji. Postavke preglednika koriste se prema zadanim postavkama.

Atribut BACKGROUND omogućuje vam da odredite adresu i naziv slike koja se koristi kao pozadina. Ovaj će crtež biti reproduciran i distribuiran u pozadini dokumenta.

Atributi LINK, VLINK i ALINK određuju boje hiperveza u RGB ili simboličkom zapisu. Postavke preglednika koriste se prema zadanim postavkama. Neposjećena hiperveza je hiperveza koja još nije korištena za navigaciju do drugog dokumenta. Posjećena hiperveza je hiperveza koja je već korištena za navigaciju do drugog dokumenta. Aktivna hiperveza – hiperveza na dokument do kojeg se trenutno ide.

Savjeti za korištenje atributa BODY oznake

 Ako navedete barem jednu boju u oznaci BODY, navedite i ostale. To je zbog činjenice da korisnik može postaviti postavke boja svog preglednika kako mu više odgovara. Određivanje samo jedne boje može rezultirati stapanjem teksta s bojom pozadine za neke korisnike. Zbog toga će pregled dokumenta biti otežan.

 Odaberite boju teksta tako da "radi" s bojom pozadine ili glavnim bojama slike. Na primjer, crveno na zelenom može izazvati ozbiljne probleme za značajan broj ljudi.

 I BGCOLOR i BACKGROUND mogu se navesti u elementu BODY. U ovom slučaju preglednik daje prednost POZADINI, ali ako se pozadinska slika ne može učitati, koristit će se BGCOLOR. Stoga pokušajte postaviti boju pozadine da bude slična boji pozadinske slike kako ne biste poremetili ravnotežu boja dokumenta.

HTML je jezik oznaka.

Označiti (deskriptor) - poseban kod umetnut u tekst za oblikovanje elemenata HTML dokumenta. Ovo je osnovni element kodiranja usvojen u HTML standardu. Oznaka je u uglastim zagradama. Na primjer, oznaka odlomka je

A oznaka vodoravne crte je .

Postoje dvije vrste oznaka: spremnici i pojedinačne oznake.

Kontejner. Ovo je par deskriptora koji se sastoji od početne (ili početne) i završne (ili završne) oznake. Početna oznaka ima oblik, gdje je TAG naziv stvarne HTML oznake. Završna oznaka izgleda kao . Spremnici su dizajnirani za pohranu nekih informacija, poput teksta ili drugih HTML oznaka. Dakle, između početne i završne oznake nalazi se sadržaj spremnika. Na primjer, element koji je formatirani tekst nalazi se između oznaka AND.

Prazna ručka. Razlikuje se od spremnika po tome što ne sadrži nikakve informacije. Ima samo početnu oznaku. Prazna oznaka obično obavlja zaseban zadatak koji nije povezan s određenim tekstom. Na primjer, oznaka stvara vodoravnu liniju.

element HTML dokumenta- Ovo su početne i završne oznake spremnika zajedno sa sadržajem između njih. Element može biti slika, dio teksta, obrazac, tablica, popis, poveznica, tekstualno polje, gumb, pa čak i naslov dokumenta ili njegov glavni dio (tijelo).

Komentar: HTML ne razlikuje velika i mala slova. Oznake se mogu upisivati ​​i velikim i malim slovima, tj. naredba je ekvivalentna naredbi ili. Ne podržavaju sve oznake svi preglednici. Ako preglednik ne podržava oznaku, jednostavno je ignorira.

Najvažnija od HTML oznaka je istoimena oznaka. Uvijek mora otvoriti dokument, baš kao što oznaka mora biti u njegovom zadnjem redu. Ove oznake znače da linije između njih čine jedan HTML dokument. Ovo je važno jer je sam dokument obična ASCII tekstualna datoteka. Bez ovih oznaka, preglednik ili drugi preglednik ne može prepoznati format dokumenta i ispravno ga protumačiti.

Naslov dokumenta nije obavezan element, ali dobro napisan naslov može biti od velike pomoći. Svrha zaglavlja dokumenta je pružiti informacije programu koji interpretira dokument. Elementi koji se nalaze unutar odjeljka GLAVA (osim naslova dokumenta koji je napisan u dijelu NASLOV) nisu vidljivi na ekranu. Elementi sadržani u odjeljku HEAD dokumenta potrebni su za:

Dodijelite naslov dokumentu

Definirajte odnose između više dokumenata

Uputite preglednik da stvori obrazac za pretraživanje

Definirajte metodu za slanje posebnih poruka određenom pregledniku ili drugom programu preglednika

Odjeljak HEAD otvara se s oznakom. Ova oznaka obično dolazi odmah nakon . Završna oznaka označava kraj ovog odjeljka. Između spomenutih oznaka nalaze se preostale oznake odjeljka zaglavlja dokumenta.

Odjeljak NASLOV je jedini obavezni element naslova dokumenta i služi za davanje naslova dokumentu. Obično se prikazuje u naslovnoj traci prozora preglednika. Sadržaj odjeljka NASLOV ne treba brkati s nazivom datoteke dokumenta. To je tekstualni niz koji je potpuno neovisan o nazivu i mjestu datoteke. Naziv datoteke strogo je određen operativnim sustavom računala na kojem je pohranjena.

Naziv dokumenta je napisan između oznaka i i je tekstualni niz. Ne biste ga trebali stavljati pod navodnike ako ne želite da se pojave na ekranu. U većini slučajeva odjeljak NASLOV ne sadrži više od jednog retka.

U principu, ime može biti bilo koje duljine i sadržavati bilo koje znakove, osim nekih rezerviranih. U praksi je bolje ograničiti se na jedan redak, imajući na umu da se ime pojavljuje u naslovnoj traci prozora preglednika. Također biste trebali zapamtiti što ostaje od naslova dokumenta kada minimizirate prozor preglednika. Stoga treba nastojati najvažnije riječi staviti na početak naslova.

Iako postoji trend povećanja “aktivnog” sadržaja na WWW-u, većinu čitatelja još uvijek zanima tekstualni dio stranica. Stoga, bez obzira na to piše li se novi tekst ili se pretvara stari, proces rada na tijelu dokumenta traje dosta vremena.

Prije nego počnete ispunjavati dokument sadržajem, ima smisla izraditi njegov "okvir". HTML dokument mora sadržavati neke potrebne elemente, bez kojih neće biti ispravno interpretiran. Primjer jednostavnog predloška prikazan je u popisu.

Ovo je primjer dokumenta


Ovdje unesite glavni tekst

Predložak se otvara s oznakom

, koji je, kao što već znamo, neophodan za svaki HTML dokument. Sljedeća oznaka je početak naslova dokumenta. Naslov sadrži element TITLE koji upisuje naslov dokumenta, u našem slučaju “Ovo je primjer dokumenta”. Naslov je zatvoren oznakom. Zatim dolazi oznaka, nakon koje se postavlja tekst (tijelo) dokumenta. Oznaka označava kraj tijela, a oznaka kraj cijelog dokumenta.

	BODY može sadržavati veliki broj atributa. Svi su oni važni jer određuju cjelokupni izgled dokumenta. Ovi atributi prikazani su u tablici.
Svrha	ALINK
definira boju trenutno aktivne veze	POZADINA
pokazuje na URL slike koja se koristi kao pozadina	BGCOLOR
definira boju pozadine dokumenta	BGPROPERTIES
ako je postavljeno na FIXED, pozadinska slika se ne pomiče	LIJEVA MARGINA
Postavlja rub lijeve margine u pikselima	LINK
Određuje boju poveznice koja još nije pregledana	TEKST
Definira boju teksta	TOP MARGIN
Postavlja granicu gornje margine u pikselima	VLINK

Definira boju već pregledane poveznice

Određivanje boja sastavnih dijelova dokumenta prvi je korak u njegovoj izradi. Ako se to ne učini, koriste se zadane boje. Oni su određeni postavkama programa gledatelja.

Nema pravila za dobro izbalansiranu paletu. Samo trebate zapamtiti da kako bi čitatelji mogli čitati tekst bez neugodnosti, pokušajte održati visok kontrast između teksta i pozadine i izbjegavajte blizinu područja sa sličnim bojama.

HTML boje su određene heksadecimalnim brojevima. Sustav boja temelji se na tri osnovne boje - crvenoj, plavoj i zelenoj. Svakoj boji je dana heksadecimalna vrijednost u rasponu od 00 do FF, što odgovara rasponu od 0-255 u decimali. Te se vrijednosti zatim kombiniraju u jedan broj, ispred kojeg stoji simbol #. Radi jednostavnosti, HTML 3.2 definira 16 standardnih boja, koje su zajedno sa svojim heksadecimalnim kodovima dane u donjoj tablici.

Boja	Kodirati
Crna	#000000
Magoop (tamno bordo)	#800000
zelena	#008000
Maslina	#808000
Tamnoplava (tamnoplava)	#000080
Ljubičasta	#800080
Teal	#008080
Sivo	#808080
Srebro	#S0S0S0
crvena	#FF0000
Limeta (limeta)	#00FF00
Žuta boja	#FFFF00
Plava	#0000FF
Fuksija (fuksija)	#FF00FF
Aqua	#00FFFF
Bijela	#FFFFFF

BGCOLOR je odgovoran za boju pozadine dokumenta. Ako stranica ima pozadinsku sliku, ovaj bi atribut trebao dati boju koja je što bliža općem tonu slike. To će omogućiti čitatelju, koji je svoj preglednik postavio da ne učitava slike, da jasno vidi tekst. Mnogi se autori ne pridržavaju ovog pravila. U ovom slučaju, ako je pozadinska slika tamna, a boja fonta bijela za tekst, neki bi se čitatelji mogli iznenaditi kad vide samo praznu bijelu stranicu.

TEXT određuje boju teksta dokumenta. Pokušajte uvijek održavati visok kontrast teksta na svojim stranicama. Kada koristite tanki font, zapamtite da bolje izgleda tamno na svijetloj pozadini.

LINK koristi preglednik za prikaz poveznica koje još nisu pregledane. Očito, trebali bi se istaknuti bojom na pozadini glavnog teksta.

Jedan popularan način za ukrašavanje HTML stranice je postavljanje pozadinske grafike na nju, vidljive ispod glavnog teksta (atribut

POZADINA ). Ova tehnika pomaže naglasiti cjelovitost dokumenta. naprotiv, podijelite ga na logične dijelove.

Većina pozadinskih slika male je veličine, ali njihove kopije, poput pozadine, ispunjavaju cijeli prozor preglednika. Posebno su popularne različite teksturirane (uzorkaste) slike: cigle, mramor, sve vrste tkanina. Uglavnom služe za jednostavno popunjavanje praznina u dokumentu. Promišljenije stranice imaju pozadinu koja odgovara sadržaju.

Atributi

LEFTMARGIN i TOPMARGIN koriste se za postavljanje udaljenosti između lijevog i gornjeg ruba teksta i odgovarajućih rubova prozora preglednika. Položaj ostalih rubova teksta nije podesiv. Ovo je učinjeno kako bi se osiguralo da se stranica može vidjeti u bilo kojem pregledniku. Nemoguće je unaprijed znati koja je veličina prozora čitača dokumenata. LEFTMARGIN postavlja udaljenost između lijevog ruba prozora preglednika, mjereno u pikselima. Najčešće se ovaj atribut koristi kada autor želi imati marginu s lijeve strane koja je bez teksta i ima drugačiji uzorak ili boju od ostatka pozadinske slike.

TOPMARGIN se koristi za postavljanje udaljenosti između gornjeg ruba teksta i gornjeg ruba prozora preglednika. Obično se koristi kada je vrh pozadinske slike važan i poželjno je da ostane otvoren. HTML dokumenti mogu uključivati ​​komentare koji neće biti vidljivi čitatelju. Moraju započeti s oznakom . Sve što je sadržano unutar ovih oznaka ostaje nevidljivo tijekom pregledavanja stranice.

ADRESA je jedan od najvažnijih elemenata HTML-a. Služi za identifikaciju autora dokumenta i (po izboru) za označavanje adrese autora. Ovdje se obično stavljaju i informacije o autorskim pravima. Ovaj element se nalazi ili na početku ili na samom kraju dokumenta. ADDRESS se sastoji od teksta smještenog između oznaka i . Tekst između ovih oznaka obično je prikazan kurzivom u prozoru preglednika.

Struktura HTML dokumenta. Počnimo s radom.

Gdje počinje HTML?

Ovaj redak pomoći će pregledniku da odredi kako ispravno protumačiti ovaj dokument. U ovom slučaju govorimo pregledniku da je HTML u skladu s međunarodnom specifikacijom verzije 3.2, koja je, iako nije nova, za razliku od kasnijih verzija, potpuni, široko prihvaćen standard bez ikakvih dvosmislenosti. Kao što možete vidjeti iz primjera, najkraći HTML dokument doslovno se sastoji od jednog retka.

Primjer najkraćeg HTML dokumenta:

Gdje počinje rad?

Zapravo, to se ne može učiniti samo s jednom linijom. Nakon što deklarirate verziju i vrstu dokumenta, potrebno je označiti njegov početak i kraj. To se radi pomoću oznake spremnika. Treba napomenuti da se svaki HTML dokument otvara s oznakom i zatvara s njom.

Zatim, između oznaka i trebate postaviti naslov i tijelo dokumenta. To je to! Početak je napravljen – dobili ste izvrsnu pripremu. Evo kako bi vaša osnovna HTML datoteka trebala izgledati prije nego što počnete:

Žvakati?

Ako se gornji primjer shematski objasni, izgledat će ovako:

Dijagram pokazuje da se dokument sastoji od dva glavna bloka - "zaglavlje" i "tijelo dokumenta". Naslov se definira pomoću elementa GLAVA, a tijelo je element TIJELO.

Naslov sadrži "tehničke" informacije o dokumentu, iako se najčešće koristi samo za označavanje njegovog naslova (vidi element TITULA).

Tijelo dokumenta je svetinja nad svetinjama. Sadrži sve što je prikazano na stranici: tekst, slike, tablice. Sukladno tome, zaključujemo: većina vaših HTML eksperimenata bit će provedena u prostoru između oznaka i

(HTML 1.0) – Komentar()

Koristi se za stvaranje komentara u bilo kojem dijelu dokumenta. Sve što se nalazi unutra, bio to element ili tekst, preglednik će zanemariti (neće biti obrađeno i prikazano na ekranu).

Bilješke:

	Komentari smješteni unutar elementa TITULA(kao, uostalom, i sve druge oznake) tumače se kao tekst i bit će vidljive u zaglavlju dokumenta. Drugim riječima, oznaka unutar TITLE nema učinka.
	Ne budi lijen komentirati sve što si napisao. Ovo čarobno pravilo uštedjet će vam mnogo vremena kada nekoliko mjeseci kasnije pokušavate smisliti vlastitu kreaciju.

Naslov HTML dokumenta

Stvoreno pomoću elementa GLAVA, između oznaka kojih se nalaze elementi koji sadrže tehničke podatke o dokumentu. Zaglavlje obično dolazi prije tijela dokumenta (pogledajte strukturu HTML dokumenta).

Elementi koji se odnose na zaglavlje dokumenta:

		Definira početak i kraj naslova dokumenta
		Definira naziv cijelog dokumenta koji se prikazuje u naslovnoj traci prozora preglednika
		Definira osnovnu adresu iz koje se izračunavaju relativne veze unutar dokumenta
		Koristi se za umetanje CSS listova stilova u dokument
		Opisuje odnos dokumenta s drugim objektima
		Koristi se za umetanje metapodataka

(HTML 1.0) – Glava

Definira početak i kraj naslova dokumenta. Spremnik je za elemente koji sadrže tehničke podatke o dokumentu. ( TITULA,BAZA,STIL,Postavlja rub lijeve margine u pikselima,META).

(HTML 2.0) – Naslov

Određuje naziv cijelog dokumenta. Naziv se obično prikazuje u naslovnoj traci prozora preglednika. Ova stavka potreban za bilo koji HTML dokument i može se navesti najviše jednom.

(HTML 3.2) – Osnovni URL

Određuje osnovnu adresu trenutnog dokumenta (URL), koja će biti početna točka za izračun relativnih URL-ova unutar dokumenta. Element nema završnu oznaku. Barem jedan od atributa mora biti prisutan.

Atributi:

HREF – navodi osnovnu adresu (URL) trenutnog dokumenta.

CILJ – određuje naziv okvira koji će se prema zadanim postavkama koristiti u hipervezama. Ovo može biti korisno ako želite otvoriti sve veze u dokumentu u drugom okviru.

(HTML 3.2) – Stil

Koristi se za umetanje lista stilova (CSS – Cascade Style Sheet) u dokument.

Atributi:

TYPE je obavezan atribut. Određuje MIME tip bloka stila koji se umeće. Obično je vrijednost ovog atributa "text/css".

TITLE – navodi naziv lista stilova koji će se izraditi. Obavezno ako namjeravate koristiti više elemenata STYLE u jednom dokumentu. U tom slučaju preglednik mora pitati korisnika koji će se od predloženih stilova primijeniti na dokument.

(HTML 2.0) – Veza

Element LINK opisuje odnos dokumenta s drugim dokumentima na stranici, ukazujući na njegovo mjesto u hijerarhijskoj strukturi stranice. Element nema završnu oznaku. Zaglavlje može sadržavati više LINK elemenata.

Atributi:

HREF – definira URL objekta.

REL – definira vrstu odnosa između tekućeg dokumenta i objekta definiranog atributom HREF. Moguće vrijednosti:

stylesheet – Pokazuje na datoteku koja sadrži stilsku tablicu (CSS) za trenutni dokument. Preglednik će učitati css datoteku s adrese navedene u atributu HREF i primijeniti je na trenutni dokument (pogledajte i element STIL) početna – pokazuje na glavnu stranicu vaše stranice toc, sadržaj – pokazuje na datoteku koja sadrži sadržaj ovog dokumenta. indeks – pokazuje na datoteku koja sadrži podatke za indeksno pretraživanje trenutnog dokumenta. pojmovnik – pokazuje na datoteku koja sadrži popis pojmova koji se odnose na trenutni dokument. autorsko pravo – pokazuje na stranicu na stranici koja govori o svojim kreatorima, autorskim pravima itd. up, parent – ​​​​pokazuje na “parent” stranicu (dokument koji je jednu stepenicu više u hijerarhijskoj strukturi vaše stranice). dijete – pokazuje na “podređenu” stranicu (dokument koji je jednu stepenicu niže u hijerarhijskoj strukturi vaše stranice). next – pokazuje na sljedeću stranicu u nizu dokumenata (na primjer, sljedeća stranica elektroničkog kataloga, dokumentacije ili rječnika). prethodna – pokazuje na prethodnu stranicu u nizu dokumenata. zadnja, kraj – pokazuje na posljednju stranicu u nizu dokumenata. prva – pokazuje na prvu stranicu u nizu dokumenata. pomoć – pokazuje na stranicu s pomoći (npr. za navigaciju po vašoj stranici).

TYPE—Određuje MIME tip za objekt naveden u atributu HREF.

Bilješke:

(HTML 2.0) – Meta

META element se koristi za tehnički opis dokumenta, koji su metapodaci u obliku para ime-vrijednost. Uz pomoć ovog elementa u naslov dokumenta unose se dodatne korisne informacije, nevidljive korisniku, ali ponekad jednostavno nezamjenjive za ispravno indeksiranje vaše stranice od strane robota poslužitelja za pretraživanje. Element nema završnu oznaku.

Atributi:

IME – definira naziv meta objave. Postoji mnogo unaprijed definiranih imena, od kojih neke možete vidjeti u primjeru u nastavku.

HTTP-EQUIV – definira naziv meta unosa. Gotovo sličan atributu NAME, ali se koristi samo ako je potrebno prenijeti dodatne informacije u HTTP zaglavlju.

SADRŽAJ – Dodjeljuje vrijednost meta unosu definiranom u atributu NAME (ili HTTP-EQUIV).

Okviri se koriste za podjelu prozora preglednika u nekoliko područja, od kojih svako predstavlja zaseban HTML dokument (okvir). U pravilu se okviri koriste za olakšavanje navigacije web-mjestom i stvaranje navigacijskog izbornika. Međutim, većina programera izbjegava korištenje okvira, i to s dobrim razlogom. Pokušajte koristiti okvire samo kada je stvarno potrebno.

Elementi za izradu okvira i rad s njima:

Bilješke:

FRAMESET

(HTML 4.0) – Skup okvira

Definira strukturu okvira (prozora) dokumenta: veličinu i položaj okvira na stranici. Stvoreno umjesto tijelo dokumenta (to jest, element TIJELO ne koristi se u dokumentu). Otvara i zatvara popis okvira definiranih elementom OKVIR. Između početne i završne oznake osim FRAME i NOFRAMES mogu postojati i drugi FRAMESET elementi. To jest, element FRAMESET podržava ugniježđene konstrukcije okvira.

Atributi:

ROWS – određuje broj i veličinu vodoravnih okvira (okvira redova) u prozoru preglednika. Vrijednost je popis veličina okvira odvojenih zarezima. Metode za postavljanje dimenzija:

Kao postotak visine klijentskog područja prozora preglednika. Na primjer: "30%,30%,40%";

u obliku znaka “*” (zvjezdica), koji označava da okvir zauzima sav slobodni prostor prozora preglednika koji nije zauzet drugim okvirima izričito navedenih veličina. Na primjer, zvjezdica u unosu "25%,25%,*" je ekvivalentna 50%;

u pikselima. Na primjer: "75,*";

Sve tri metode mogu se kombinirati. Na primjer, "25%,40,*" će podijeliti ekran u tri vodoravna okvira, od kojih će prvi biti visok četvrtinu prozora preglednika, drugi 40 piksela, a treći će zauzeti cijelo preostalo područje .

COLS – određuje broj i veličinu okomitih okvira (okvira stupaca) u prozoru preglednika. Vrijednost je popis veličina okvira odvojenih zarezima. Dimenzije se postavljaju na isti način kao u prethodnom atributu ROWS.

BORDER – definira širinu obruba okvira u pikselima. Ovaj atribut radi samo u Netscape preglednicima;

FRAMEBORDER – određuje imaju li okviri sadržani unutar FRAMESET-a granice. Moguće vrijednosti:

Da – okviri zaslona; Ne ili 0 – ne prikazuj okvire;

Netscape preglednici ne podržavaju u potpunosti ovaj atribut i koriste atribut BORDER za globalno određivanje širine obruba.

FRAMESPACING – definira udaljenost (tzv. “sivo područje”) između okvira u pikselima. Ovaj je atribut potreban za stvaranje okvira bez obruba. Bilješka:(HTML 4.0) – Okvir Definira okvir i njegova svojstva unutar strukture FRAMESET. (vidi stavku

FRAMESET

) Atributi: SRC je obavezan atribut. Određuje adresu (URL) HTML datoteke koja će biti prikazana u ovom okviru.). Vrijednost mora biti bilo koje ime bez razmaka s latiničnim znakovima i brojevima. Ime ne smije počinjati brojevima ili posebnim znakovima.

MARGINWIDTH – Definira širinu (u pikselima) lijeve i desne margine okvira. Ako atribut nije naveden, preglednik će automatski odrediti optimalnu veličinu uvlake.

MARGINHEIGHT – definira širinu (u pikselima) gornje i donje margine okvira. Ako atribut nije naveden, preglednik će automatski odrediti optimalnu veličinu uvlake.

KRIZANJE – određuje prisutnost kliznih traka za sadržaj okvira. Moguće vrijednosti:

da – prikaz traka za pomicanje. ne – ne prikazuju trake za pomicanje. auto – prikaz traka za pomicanje ako je potrebno (ako dokument naveden u SRC atributu ne stane u okvir).

NORESIZE – ne dopušta promjenu veličine okvira. Ovaj atribut je zastavica i ne zahtijeva vrijednost.

FRAMEBORDER – određuje da li okvir ima okvire. Moguće vrijednosti:

da – okviri za prikaz; ne ili 0 – ne prikazuj okvire;

Netscape preglednici ne podržavaju u potpunosti ovaj atribut i koriste atribut BORDER elementa FRAMESET za globalno određivanje širine okvira.

Primjer (datoteka index.html):
	...Vaš preglednik ne podržava okvire...

Ovo će podijeliti prozor preglednika u tri okvira kao što je prikazano u nastavku. Štoviše, frame1.html će imati širinu od 265 piksela, a frame2.html će imati visinu od 165.

NOFRAMES

(HTML 4.0) – Bez okvira

Preglednik će prikazati sve između početne i završne oznake određenog elementa osim ako ne podržava okvire. Element NOFRAMES nema atribute i mora biti unutar elementa Bilješka:.

Primjer:
	Vaš preglednik ne podržava okvire.

Obični, zar ne?

Pokušat ću voditi newsletter prema principu "od jednostavnog prema složenom". Provest ću ga upravo u ovakvom formatu kako bi osoba koja želi naučiti osnove izrade web stranica mogla odmah, nakon izlaska newslettera, prezentirani materijal primijeniti u praksi.

Ali želio bih odmah rezervirati da je, posebno, HTML jezik vrlo opsežan jezik koji se stalno razvija. Stoga, kako biste svladali ovaj jezik na visokoj razini, morate pažljivo proučiti osnove (tj. brojeve mog newslettera). I u isto vrijeme vježbati.

Za današnju uvodnu lekciju počet ćemo s učenjem o strukturi HTML dokumenta i osnovnim HTML oznakama.

idemo...

Svaki HTML dokument počinje linijom:

XHTML

Općenito, ovaj redak govori pregledniku koji otvara našu stranicu na koje se standarde treba oslanjati.

Tag je vrlo raznolik, a njegova izmjena određuje kako će sadržaj biti prikazan na vašoj stranici.

Međutim, ako vješto posložite sve elemente i blokove na stranici i primijenite stil, tada će sve raditi jednako dobro u svim preglednicima sa željenim .

No, iako ne znamo što su blokovi, što su stilovi i kako primijeniti tu "abrukadabru", smatram da je potrebno vratiti se detaljnijem razmatranju kada već znamo kako nešto napraviti i možemo stvarno ocijeniti njegov rad.

U međuvremenu, pomaknimo se niz stranicu.

Usput, zašto sam počeo gledati HTML dokument s vrha stranice?

Zato što preglednik učitava stranicu i "čita kod" odozgo prema dolje, slijeva nadesno. (Međutim, baš kao što čitamo knjige).

Možda oznaka riječi nije sasvim jasna?

Općenito govoreći, oznaka je instrukcija koja pregledniku govori što treba učiniti na određenom mjestu u dokumentu.

Koristimo oznake za izradu naših stranica. Sve oznake su zatvorene u takozvane “kutove” ( ). I završni (s kosom crtom). Na primjer, podebljani tekst. Određuje da će tekst između uvodne i završne snažne oznake biti podebljan.

Nadam se da je jasno što je oznaka.

Predlažem da upišete nešto vlastitim rukama.

Pa krenimo.

Pokrenite notepad ili wordpad u OC WINOWS. Utipkajmo sljedeće retke:

XHTML

Naslov prozora preglednika

Naslov prozora preglednika

Spremimo datoteku pod nekim imenom, na primjer start.html. Sada shvatimo što su napisali.

Između oznaka nalaze se informacije koje nisu prikazane na stranici.

Na primjer, oznaka, usput, ne zahtijeva završnu oznaku; može označavati kodiranje (charset=windows-1251) ili informacije o autoru (name="author" content="Full name") ili riječi za tražilicu, oznaka će natjerati preglednik da automatski ode na stranicu mysite.ru nakon 30 sekundi (primjer).

Oznaka definira tekst u naslovnoj traci prozora preglednika. (Završna oznaka).

Oznaka također može sadržavati javascript ili vbscript skripte zatvorene u … oznake. .

I stilovi zatvoreni u oznakama... .

Vjerojatno ćemo završiti s ovom oznakom.

Ovo je, zapravo, tijelo dokumenta; sve što vidimo na stranici nalazi se ovdje. Oznaka ima skup parametara koje ćemo pogledati, ali nije preporučljivo koristiti ih.

bgcolor - postavlja boju pozadine dokumenta. ( )

pozadina - pokazuje na URL slike - pozadina dokumenta.

tekst - postavlja boju teksta dokumenta.

veza - postavlja boju hiperveza.

vlink= - postavlja boju hiperveza koje ste već posjetili koristeći vrijednost.

alink= - Postavlja boju hiperveza kada se klikne.

bgproperties=fixed - pozadinska slika se neće pomicati. one. tekst će se pomaknuti kada se pritisne PageDown, ali pozadina neće.
Ovu opciju podržava samo Internet Explorer.

Ovi parametri se mogu kombinirati, na primjer, na ovoj stranici se koristi:

XHTML

Upišimo ovaj redak u našem prethodnom primjeru.

XHTML