Šta je HTML kod stranice? HTML: Osnove za početnike Za šta se koristi HTML?

Sigurno se svaki nezaposleni korisnik interneta susreo sa situacijom da, kada pristupite lijepoj web stranici, razmišljate o tome šta bi se dogodilo kada biste napravili takvu web stranicu, jer će vam dobra web stranica donijeti novac, a možda i slavu. Imate želju i želju za tim, odmah ukucate u tražilicu „Kako napraviti web stranicu?“ Skoro svuda će vam reći da za kreiranje dobre web stranice morate naučiti HTML. Ako ste novi u ovom poslu, verovatno ćete želeti da znate šta je to.

Ukratko ću vam objasniti šta je HTML svojim, razumljivijim riječima nego na Wikipediji.

HTML je glavni web programski jezik, osnova svih osnova izrade web stranica. Gotovo sve web stranice su napisane na ovom jeziku. Veličina teksta na sajtu, veličina i lokacija slike, pozadina sajta itd. sve ovo je napisano na ovom jeziku. HTML je ono s čim su web stranice rođene, što znači da je maternji jezik gotovo svih web stranica. Na primjer, ako ste Kinez, onda govorite kineski, ako ste Ukrajinac, onda govorite ukrajinski, ali ako ste web stranica, onda govorite HTML. Svaki dobar web programer zna HTML skoro napamet i dobar je s njim.
Ovaj jezik je razumljiv i lak za učenje, ali kao i svi jezici na ovom svijetu, da bi se dobro govorio, potrebna mu je vježba. Odnosno, čak i ako ga naučite u potpunosti, nećete moći odmah napraviti dobru web stranicu, potrebno vam je vrijeme, strpljenje i praksa. Obično početnici na početku svog web programera jednostavno nemaju strpljenja naučiti sve i vježbati korak po korak. Oni koji su položili test, naučili sve, stekli iskustvo u praksi učeći jezik i nisu odustajali - čeka ih dobra nagrada.
Postoji nekoliko web programskih jezika. Za kreiranje jednostavne web stranice potreban vam je samo jedan jezik, glavni, odnosno HTML. Da biste napravili složenu i veliku web stranicu, trebat će vam pomoćni jezici, tako da ćete o njima učiti već tokom ili nakon učenja HTML jezika. Ako odlučite krenuti putem web programera, možete početi učiti HTML odmah. Zapamtite najvažniju stvar - ako uzmete, ne odustaj i ne odustaj, jer to je ono što uništava većinu programera.

HTML dekodiranje

Ova četiri slova HTML-a označavaju nekoliko riječi, odnosno Hyper Text Mark-up Language, koji na ruskom zvuči kao jezik za označavanje hiperteksta.

Zašto je potreban HTML?

Zašto je potreban ovaj jezik? Zašto ga učiti? Zašto ne neki drugi? Ili zašto ga uopće naučiti ako postoji gomila drugih programa za jednostavno kreiranje web stranice?

Kao što sam rekao, HTML je glavni web programski jezik. To nije jedini jezik koji se koristi za izradu web stranica, ali je glavni alat koji vodi druge jezike, pa ga je potrebno naučiti. Čak i ako koristite program za kreiranje web stranice ili gotove šablone, HTML će vam znatno olakšati život. Štaviše, ako želite da u budućnosti napravite dobru, veliku i profesionalnu web stranicu, programi i šabloni vam neće pomoći, sve će krenuti od nule, a vaše znanje ovog jezika će vam pomoći u tome.

Kako koristiti HTML

Ovaj jezik je vrlo jednostavan za korištenje i dostupan je svima. Može se čak koristiti i u običnoj beležnici (.txt). Da biste ga učinili praktičnijim za korištenje, postoje posebni programi, na primjer Notepad++. Više detalja o korištenju ovog jezika će biti opisano u HTML lekcijama.

Kako naučiti HTML

Da biste naučili HTML, morate imati puno strpljenja da biste se dobro snašli u ovom jeziku. Lako je naučiti, ali najvažnije je steći iskustvo i praksu, što više prakse imate, to ste bolji web programer.

Svaki sajt ima drugačiji izgled i funkcionalnost, ali sa čime je to povezano i na kom jeziku je stranica napisana? Za sve ovo koriste se kaskadni stilovi i HTML. Možete sami pogledati kod za ovaj jezik ako pregledate objekte u pretraživaču. U ovom članku ćemo posebno govoriti o tome šta je HTML.

Naš članak je uglavnom namijenjen početnicima, pa se nadamo da će redovni čitatelji bloga razumjeti!

Post će biti podijeljen na sljedeće tačke:

Šta je HTML stranica

Jezik za označavanje koji se zove HTML koristi se za dizajn svih elemenata stranice, uključujući tabele, slike i tekst. Možete se upoznati sa kodom i pokušati ga razumjeti ako koristite bilo koji moderni pretraživač, samo kliknite desnim tasterom miša na stranicu i u meniju kliknite na liniju „izvorni kod stranice“ ili „HTML kod“. Nakon toga, vidjet ćete nešto poput uređivača, u kojem ima puno nerazumljivih natpisa i simbola, ovo je kod HTML jezika.

Svaki WWW dokument ima formatiran i lijepo dizajniran tekst, kao i hiperveze i slike koje odabire vlasnik stranice. Da bi radili sa ovim elementima, programeri su kreirali jezik pod nazivom HTML (Hyper Text Markup Language), što u prevodu znači jezik za označavanje hiperteksta. Svaki pretraživač radi i prikazuje HTML različito, tako da se različito pojavljuje u različitim pretraživačima, posebno u starijim verzijama Internet Explorera.

Svi HTML dokumenti su slični - to je standardna tekstualna datoteka koja sadrži oznake određenog jezika zajedno sa tekstovima koje će posjetioci stranice čitati. Stranica se kreira pomoću oznaka, a pretraživač ih čita kada je učita. Definiranjem oznaka i njihovog dizajna možete postaviti članak ili drugi materijal na određeno mjesto na stranici, dodati grafičke datoteke i fotografije, kao i hiperveze na druge stranice stranice. U početku, HTML datoteka nije web dokument, ona postaje samo nakon što je pročita pretraživač.

Naravno, standardni HTML kod ima svoje nedostatke i nedostatke. Morat ćete se jako potruditi da na stranici posložite pasuse s tekstom, jer da biste izvršili označavanje i sve ostalo, potrebno je registrovati određena svojstva za cijeli tekst i za svaki pojedinačni pasus. Ako vaša stranica ima 50 stranica i svaka ima 10-20 pasusa, trebat će jako dugo da se formatira tekst i svaki put umetnete iste oznake. Ovo ne samo da zamara vlasnika stranice, već i negativno utječe na težinu stranica stranice. Iz tog razloga su kasnije kreirani kaskadni stilovi, ukratko se zovu CSS, što znači kaskadni stilski listovi, zahvaljujući njima možete brzo dizajnirati tekst. Možete dodijeliti jednu oznaku i dati joj određene karakteristike, kao što su boja teksta, veličina, font, itd., a zatim je primijeniti na pasuse. U ovom slučaju, datoteka sa stilskom tablicom se pohranjuje zasebno, može se učitati na jednu stranicu ili nekoliko odjednom. Zatim se glavni elementi stranice ispisuju u HTML-u, te se ubacuje tekst, a zatim se povezuje CSS i sav tekst poprima dizajn koji vam je potreban. Ovo takođe smanjuje težinu stranica, što je veoma važno.

Korištenje CSS-a je preporučljivo ako stranica ima mnogo stranica koje će imati isti dizajn. Možete postaviti određeno oblikovanje teksta za sve pasuse ako upišete nekoliko redova u dokument sa CSS kodom. Prilikom kreiranja web stranice, dizajneri izgleda kreiraju glavni izgled u HTML-u, na osnovu izgleda kreiranog u Photoshopu. Ali nakon toga stranica izgleda nedovršeno, potrebno je stvoriti atraktivan izgled, a to se postiže kaskadnim stilskim listovima. To nije teško naučiti ako imate puno slobodnog vremena, budući da je opći izgled svih stranica približno isti, možete imati jedan izgled s nekoliko blokova i njemu "prilagoditi" ostale stranice. Po pravilu, kaskadni listovi stilova su mnogo složeniji od CSS-a, još je teže postaviti sajt koristeći blokove, a ne tabele. Osim toga, u početnim fazama možete naići na problem kao što je različit prikaz stranice u pretraživačima. Upravo da ne bismo gubili vrijeme i zaradili novac na web stranicama napravljeni su CMS - gotovi izgledi web stranica koji mogu biti besplatni ili plaćeni i imaju specifičan sistem upravljanja.

Šta je HTML5. Razlike i prednosti

Novi HTML5 standard pomaže vlasnicima web stranica i oslobađa ih obaveze korištenja Adobe Flash formata, ali i drugih programa. Zahvaljujući ovom standardu, možete promijeniti prikaz teksta na stranicama i pojednostaviti unos informacija prilikom popunjavanja elektronskih obrazaca. Ako podijelimo sve inovacije ovog jezika, možemo istaći sljedeće:

Nakon ulaska na stranicu, ljudi će moći gledati video zapise i slušati audio putem pretraživača, za to se kreira zasebno dugme za reprodukciju.

Puno je lakše učitati nove fotografije putem ovog jezika, čak možete kreirati i galerije slika. Ne morate čak ni preuzimati dodatni softver.

Možete locirati tekst i označiti tekstualne blokove. Također možete lijepo formatirati svoj tekst kako biste ga lakše čitali.

Ako je ranije u HTML4 osoba primijetila grešku nakon unosa podataka tek kada je predala obrazac, sada pretraživač odmah javlja grešku ako osoba pogrešno popuni obrazac. Ovo je vrlo zgodno za korisnike jer ne moraju više puta ispunjavati iste odjeljke podataka.

Nema potrebe za korištenjem softverskih modula, jer uz pomoć HTML5 možete oživjeti bilo koju ideju u vezi stranice. Samo ako je stranica jedinstvena i trebate smisliti nešto posebno, instaliraju se dodatni softverski moduli.

Ranije, ljudi nisu mogli pravilno pregledati web stranicu putem tableta ili pametnog telefona, jer HTML4 standard nije kompatibilan sa pretraživačima za mobilne uređaje i druge operativne sisteme. Koristeći HTML5 jezik, kreiraju se stranice koje su savršeno čitljive sa svih uređaja velikom brzinom.

Ako imate bilo kakvih pitanja, napišite ih u komentarima, rado ćemo odgovoriti!

Osnove HTML-a za početnike, ono što bi svaki početnik webmaster ili bloger sada trebao znati. Ako želite naučiti kako napraviti osnovne web stranice, razumjeti sam kod, znati šta se krije iza čega i šta treba da stoji, to je jednostavno nemoguće učiniti bez poznavanja osnova HTML jezika. Na svom blogu ću imati cijeli lanac članaka koje ću posvetiti ovoj temi od A do Ž, opisat ću svaki tag koji je prisutan u dokumentu, šta znači i kako ga pravilno koristiti.

HTML osnove

Ako ne znate najosnovnije stvari, vaš put je zatvoren. Smatram da svaka osoba koja se odluči za razvoj i izradu web stranica treba da zna i razumije osnove, od čega se sam sajt sastoji, kako radi i šta se dešava u samom kodu.

Naravno, postoji dosta programskih jezika, svi su složeni na svoj način, ali postoje neki koje apsolutno morate znati. Ako želite lijepo dizajnirati pismo koje će se poslati poštom, imate svoju VKontakte grupu, grupu na drugim društvenim mrežama, isti YouTube kanal, trebate se poigrati s kodom na bilo kojem od motora web-lokacije, samo trebate da zna osnovne pojmove.

Naveo sam samo nekoliko primjera, zapravo, sada se ovo znanje sve češće koristi na internetu. Ja sam više praktičar nego teoretičar, pa ću vam u svojim člancima u ovom dijelu pokazati svoje primjere kako i šta sam radio, korak po korak. Postavit ću i primjere stranica i cijele stranice.

Html dokument je najjednostavniji tekstualni dokument, jezik za označavanje na koji svakodnevno nailazite na internetu. Oznake opisuju strukturu dokumenta. Oznake su formatirane kao angular< >zagrade, unutar kojih je napisano ime oznake. Pregledač gleda strukturu dokumenta, gradi ga i prikazuje prema svojim uputstvima na vašem monitoru, ako ste, naravno, sve uradili ispravno.

Cijeli ovaj proces počinje prije nego što vidite gotovu sliku. Pretraživači obrađuju dokument uzastopno, od početka do kraja. Uključujući sve što bi trebalo biti na stranici. Tabele, slike, skripte i tako dalje, osim što ovo uključuje CSS stilove.

Osnove za početnike

Šta je html - ako pogledate šta piše Wikipedia - (HyperText Markup Language) hipertekstualni jezik za označavanje dokumenata. Većina stranica na Internetu sadrži oznake stranica na ovom jeziku. Ovaj jezik tumače pretraživači, a rezultirajući formatirani tekst se prikazuje na monitoru vašeg računara ili mobilnom uređaju.

Ovaj jezik je inherentno vrlo lak i pristupačan za učenje. Svako može naučiti i razumjeti njegove osnove. Da biste koristili takav jezik, morate znati i koristiti deskriptore, koji se također nazivaju tagovima. Dokument se kreira uz pomoć oznaka.

Od čega treba da se sastoji struktura dokumenta, koje oznake treba da budu prisutne. Pogledajmo sve na jednom malom primjeru. Napisao sam neki tekst u MS Office-u i pokazao ga na ovom snimku ekrana.

Da bi se ovaj tekst prikazao u pretraživaču na isti način kao što je napisan u dokumentu, potrebno je da mu dodate oznaku stranice, koja uključuje neke oznake. Prvo ih pogledajte, pa ću vam opisati ko je za šta odgovoran.

Dobrodošli na moj blog, sada uzimate lekciju o osnovama HTML-a. Ako vam se svidio ovaj članak, možete se pretplatiti na ovaj blog kako biste primali nove članke u svoju e-poštu.

Blog Evgenija Nesmelova! web stranica Osnove html-a i css-a za početnike

Od kojih oznaka se sastoji bilo koji html dokument, šta uključuje i gdje sve to treba zapisati?

< html > < body > < h2 >< / h2 > < p >Dobrodošli na moj blog, sada uzmite tutorijal o osnovama HTML-a. Ako vam se svidio ovaj članak, možete se pretplatiti na ovaj blog kako biste primali nove članke u svoju e-poštu.< / p > < h2 >Blog Evgenije Nesmelov! Nesmelov. ru Osnove HTML-a i CSS-a za početnike< / h2 > < / body > < / html >

Svaki kod se sastoji od znakova koji se stavljaju u ugaone zagrade. Sve se to naziva elementima. Svi elementi se obično sastoje od dvije oznake, otvaranja i zatvaranja. Savjetujem vam da u početku pažljivo pogledate oznake ako propustite jednu od njih i ne zatvorite je, morat ćete revidirati velike dijelove koda kako biste pronašli grešku.

Bilo je slučajeva kada je trebalo više od jednog dana, osoba se javi i zatraži pomoć, ne može pronaći grešku na svom sajtu, pa uvijek pažljivo gledajte šta i gdje pišete. Hajde sada da iskoristimo ovaj primer da pogledamo svaki element koda, šta je u njemu napisano, šta znači i šta se na kraju dešava.

Većina oznaka je uparena, što uključuje oznaku za otvaranje i oznaku za zatvaranje. Osim takvih oznaka, postoje i pojedinačne oznake. Oznake mogu ići zajedno s drugima i tako se ugniježditi jedna u drugu. Na primjer, istovremeno prikažite tekst podebljanim i kurzivom.

Tekst

< strong > < i >Tekst< / strong > < / i >

Struktura HTML dokumenta

Da vas još jednom podsjetim, morate se pridržavati pravila koja su prisutna u dokumentu. Ovako pretraživač razumije šta se nalazi na stranici, njen slijed, sadržaj itd.

Oznaka je komponenta koja govori web pretraživaču da izvrši određeni zadatak. Na primjer, prisustvo paragrafa, tabele, obrasca ili slike.

Atribut - modificira oznaku. Na primjer, možete poravnati pasus centrirano ili desno, također postaviti lokaciju slike na stranici i tako dalje.

UVIJEK zatvorite oznake, ako ih otvorite, svakako ih trebate zatvoriti. U suprotnom će doći do greške i vaš dokument se neće ispravno prikazati na stranici. Postoje i izuzeci, koje ne treba zaboraviti.

Jasno je potrebno razumjeti da postoji naslov dokumenta i njegovo tijelo. Naslov je sve što je sadržano u tag-u. Tijelo dokumenta (), tijelo dokumenta sadrži sav sadržaj stranice. Ako postoji potreba da ostavite dio koda za sebe, prilažući na taj način ove oznake u komentarima, za to se koristi oznaka. Sve što se nalazi unutar takve oznake služi kao komentar i pretraživači ga ne percipiraju.

Počnimo sa prvim. Na početku dokumenta otvorio sam oznaku, a na kraju sam je zatvorio. Ovaj kod je prisutan u apsolutno svakom dokumentu, on govori pretraživaču da je sve što se nalazi između ovih oznaka HTML kod. To je korijen samog dokumenta sve što se naknadno nalazi iza ove oznake više nije uključeno u dokument i pretraživači ga ne percipiraju. Na samom početku dokumenta, oznaka se otvara, a na samom kraju mora biti zatvorena.

Cijeli dio ove oznake sadrži sve tehničke informacije dokumenta. Kao i prethodna oznaka, glava se takođe mora otvoriti i zatvoriti na kraju. Ove informacije uključuju naslov stranice, opis, ključne riječi tražilice i kodiranje. O kodiranju malo ispod.

Sadržaj

< head >Sadržaj< / head >

Ova oznaka je uključena u glavu i mora biti napisana unutar oznake head. Ova oznaka title je obavezna i mora biti prisutna u svakom HTML dokumentu. Pored toga, pojavljuje se kao naslov prozora pretraživača. Dužina takvog zaglavlja ne bi trebalo da prelazi 60 karaktera. Tekst takvog zaglavlja trebao bi sadržavati najpotpunije informacije koje karakteriziraju sadržaj stranice.

Ako ste u zaglavlju napisali "Hello World", ovo je informacija koja bi trebala biti prikazana na stranici i nijedna druga. Ne treba obmanjivati ​​ljude i pretraživače, njima se to ne sviđa i time sebi pogoršavate situaciju. Informacije sadržane u ovoj oznaci trebale bi biti relevantne za sadržaj vaše stranice.

Nakon obavezne naslovne oznake, postoji neobavezna, ali jednako važna meta oznaka. Ova oznaka je single. Koristeći ovaj tag, postavljate opis stranice (opis) i njene ključne riječi (ključne riječi).

Osim toga, meta oznaka može sadržavati podatke o autoru stranice i druga svojstva metapodataka. Možete spriječiti da pretraživači indeksiraju cijelu stranicu. Postavite stranicu da se automatski osvježi nakon 20 sekundi ili nakon 5 sekundi, nakon čega slijedi prijelaz na drugu stranicu.

< meta name = "robots" content = "index, follow" > < meta http - equiv = "refresh" content = "20" > < meta http - equiv = "refresh" content = "5; url=http://сайт/" >

Takvih meta elemenata može biti nekoliko, jer mogu nositi potpuno različite informacije. Drugi korisnici, kada otvore stranicu u pretraživaču, ne vide sve vaše opise, sve ovo ostaje skriveno od pogleda.

Oznaka stila se također može koristiti za postavljanje stilova na stranici. Ako koristite mnogo različitih css stilova, preporučljivo je da ih postavite u zasebnu datoteku. Ako trebate navesti nekoliko njih, sve se to može navesti direktno u html dokumentu.

.base (širina: 100px; boja pozadine: #000; visina: 150px; boja: #fff; )

< style type = "text/css" > baza( širina: 100px; pozadina - boja : #000; visina: 150px; boja : #fff;

Ili dodajte stilove posebno u jednu oznaku da biste to učinili, morate dodati element stila unutar same oznake. Ova oznaka se mora koristiti unutar kontejnera koji postavlja stilove za stranicu. Možete koristiti nekoliko takvih oznaka, to neće biti greška.

Pomalo slično prethodnoj oznaci, oznaka veze vam omogućava da postavite stilove za dokument koji se nalazi u drugoj datoteci. Drugim riječima, možete priložiti kompletan css stilski list, koji se sastoji od mnogih svojstava, postojećem dokumentu. Na taj način smanjujete veličinu dokumenta, koji će se u konačnici brže učitavati i otvarati na računalu ili mobilnom uređaju s malim brzinama interneta.

Možete povezati više datoteka, nema ograničenja. Nema potrebe za zatvaranjem takve oznake. Ako je sve urađeno ispravno, određeni stilovi iz zasebne datoteke će biti učitani u vaš dokument. Ovaj tag se može dodati osnovnom html-u i ne zaboraviti na njegovo postojanje. Rezultat je ovakva slika:

< link href = "css/style-lg.css" rel = "stylesheet" > < link href = "css/style-md.css" rel = "stylesheet" > < link href = "css/style-sm.css" rel = "stylesheet" >

Koristeći oznaku skripte, možete povezati različite scenarije (skripte) na dokument. Potrebno je prisustvo završne oznake. Sama skripta se može nalaziti na početku dokumenta, unutar ili na kraju.

Govori pretraživaču da se sve što se nalazi između ovih oznaka treba pojaviti u prozoru vašeg pretraživača. Evo glavnih oznaka koje mogu biti prisutne u apsolutno svakom dokumentu. Oznaka body služi kao glavno tijelo stranice, koje uključuje sav njen sadržaj. Preporučljivo je da otvorite ovu oznaku i zapamtite da je zatvorite na kraju dokumenta.

Naslovi stranica h1 h2 h3

Idemo dalje, vidimo oznaku koja se otvara i zatvara na isti način. Ova oznaka označava glavni naslov teksta u većini slučajeva, ispod naslova H1 je naslov stranice. U stvari, postoji samo šest naslova podataka. . Koriste se i u SEO-u, ali ovo je malo drugačija tema. Svakako ću izdvojiti jedan članak za ovo i dati ih detaljan opis, pretplatiti se na ažuriranja bloga kako ništa ne biste propustili.

Prisustvo takvih naslova u članku će igrati važnu ulogu u promociji stranice. Osim toga, njihova upotreba vam daje jasnu strukturu stranice, njen naslov, podnaslove, istaknute stavke, podstavke itd. Uvijek ih koristite i provodite u praksi. Na mnogim CMS-ovima, kao što je WordPress, kada pišete tekst, možete vidjeti "naslov 1", "naslov 2", "naslov 3" i tako dalje. Oni su odgovorni za h1, h2 i h3.

Ako pišete osnovni tekst iz novog pasusa, pišete oznaku

Na početku i zatvorite na kraju

. Označavanje pasusa u html-u je ekvivalentno kreiranju novog pasusa u MS Word dokumentu. Nisam dodao ništa novo u dokument. Ali to nije sve što bi trebalo biti prisutno u html dokumentu. Pogledajmo još jedan primjer, opis će doći malo kasnije.

HTML dokument

Ovaj tekst će biti podebljan, a i ovaj je u kurzivu

< ! DOCTYPE html > < html > < head > < meta http - equiv = "Content-Type" content = "text/html; charset=utf-8" / > < title >HTML dokument< / title > < / head > < body > < p > < b > < / b > < / p > < / body > < / html >

Osnovni elementi Glava i Naslov

Svaki dokument sadrži zaglavlje i element naslova. Prvi, koji dolazi odmah nakon prve oznake. Ova oznaka sadrži sve informacije o stranici, sadrži i element. Naslov – informacije o naslovu stranice, drugim riječima naslov stranice, njeno ime. Upravo u naslovu navodite tačan naziv stranice po kojoj će vas korisnik tražiti putem tražilice, što je vrlo važna stvar. Oba elementa moraju biti otvorena i zatvorena. Svaki element je zatvoren znakom “/”. Rezultat je ovakva slika.

Naslov i sadržaj stranice

< / html >

Kao što vidite, nema ništa komplikovano. Evo najosnovnijih oznaka koje bi trebale biti prisutne u svakom html dokumentu. Ne zaboravite zatvoriti svaki od njih, inače preglednik neće moći vidjeti punu sliku koda. Ovo morate uvijek znati i zapamtiti. Zatim počinjete da ubacujete tekst, slike, video zapise i tako dalje. Ali to će već biti u drugim člancima.

Notepad++ editor

Za rad sa kodom koristite program Notepad++. Besplatan je i nije ga teško pronaći na internetu. Vrlo zgodno za razumijevanje bilo kojeg koda, također zgodno prikazuje oznake za otvaranje i zatvaranje. Podržavamo sintaksu više od 40 programskih jezika. Upravo ono što vam treba da naučite osnove html-a.

Notepad je superiorniji u svakom pogledu od običnog notepada. Za maksimalnu pogodnost, jednostavnost i učenje, ovaj uređivač prvo mora biti instaliran na vašem računaru. Najvažnija prednost i pogodnost je to što uređivač Notepad++ pokazuje nagoveštaje prilikom pisanja koda, što čini vaš rad mnogo bržim i kvalitetnijim.

DOCTYPE element

Svaki dokument također mora sadržavati sljedeći element doctype. Zašto je to potrebno i šta bi trebalo da bude u njemu. Ljudi obično nisu baš oduševljeni ovim redovima, kopiraju ih u svoje dokumente i rade tiho. Ovi elementi govore pretraživaču koja se verzija html-a koristi u dokumentu, koji je opis stranice, koje se kodiranje koristi, koje su ključne riječi uključene, ko je autor i kako se stranica zove.

Obično se postavljaju na samom početku. Postoji nekoliko opcija i sve se razlikuju jedna od druge, napisat ću jedan primjer koji se najčešće koristi. Ovaj blank se može koristiti kao gotov šablon. Zatim će biti jasan opis svake linije, s tim ne bi trebalo biti problema.

Ukratko jasnim jezikom o osnovama html-a: Ova linija govori pretraživaču da je ovaj dokument XHTML verzija 1.0, koristi se engleski i cijeli ovaj nered se nalazi na ovoj adresi. Zatim, u meta oznaci označavamo kodiranje koje se koristi. Najčešće korišteni je Windows 1251.

Opis - dotiče se tema SEO-a, jedna od tri glavne oznake koje moraju biti prisutne u apsolutno svakom dokumentu, ova oznaka označava opis stranice. Ono što piše na ovoj stranici, kratak opis, ne više od dvije rečenice. Oznaka ključnih riječi također pokriva temu SEO, ova oznaka je obavezna. Sadrži ključne riječi koje će korisnici Interneta koristiti da vas pronađu putem pretraživača.

Oznaka title sadrži naziv samog dokumenta, njegov naslov, koji vidimo u pretraživaču. Vjerovatno najvažniji tag u cijelom dokumentu, koji ima najveći utjecaj na promociju stranice. Članak o dodavanju i dizajnu detaljnije opisuje ovu oznaku.

Ono što trebate zapamtiti iz ove lekcije o osnovama html-a:

Gotovo sve oznake se otvaraju i zatvaraju;

Dokument počinje oznakom ;

Prisutnost oznake;

Prisutnost oznake;

Jasna struktura html dokumenta.

Sve glavne stranice treba uvijek imati naziv indeks. Tako je to prihvaćeno i svi su na to navikli, bez obzira koja je ekstenzija fajla, može biti html ili php. Uvek se tako zove.

Pogledajte video o osnovama HTML-a sa Webformyself-a.

Jezik za označavanje hiperteksta, osnovni elementi i struktura. Sve ovo i još mnogo više pokušaću da opišem na svom blogu. Prije svega, bit će napisane korisne informacije za početnike, primjer koda i mogućnost preuzimanja samog primjera uz gotovu stranicu.

Za pojavu HTML-a, moderni svijet ima zahvaliti jednom naučniku u Evropskom savjetu za nuklearna istraživanja (Conseil Européen pour la Recherche Nucléaire, CERN). Ime ovog naučnika je Timothy John Berners-Lee. Prva verzija HTML-a kreirana je za potrebe formatiranja naučnih dokumenata. To je strukturno oblikovanje bez elemenata opisa shema boja, parametara fonta itd. Tako je HTML prvobitno omogućio isticanje naslova, pasusa, lista i sličnih strukturnih elemenata u tekstu. Rezultat obrade ili „igranja“ HTML-a ne bi trebao ovisiti o tehničkim karakteristikama hardvera za njegovu vizualizaciju, budući da nije sadržavao parametre ove vizualizacije. Vremenom je ova karakteristika jezika za označavanje hiperteksta djelimično izgubljena.

Dakle, pojava prvih verzija HTML-a datira iz 1986. godine, a 1991. godine HTML je značajno poboljšan i počeo se koristiti posebno za prenošenje hiperteksta preko World Wide Weba. Kažu da se svjetski poznata skraćenica HTML, što je skraćenica za Hyper Text Markup Language, pojavila upravo početkom 90-ih godina prošlog stoljeća. A sada kratak izlet u pedigre markup jezika. Prva verzija jezika za označavanje hiperteksta HTML kreirana je na osnovu Standard Generalized Markup Language (SGML), koji se na neki način može smatrati prototipom eXtensible Markup Language. XML standard je stekao ogromnu popularnost u naše vrijeme zbog velikog broja njegovih ekstenzija koje se koriste u kompjuterskoj tehnologiji. Da potpuno zbunim čitaoca, odmah ću dodati da je naknadno, na osnovu XML-a, razvijen jezik za označavanje hiperteksta XHTML (Extensible Hypertext Markup Language), koji u suštini replicira HTML. Kao rezultat, imamo akronime SGML, HTML, XML i XHTML i moramo razumjeti koji je koji. U stvari, sve je jednostavno: SGML nije ništa drugo do skup pravila na osnovu kojih se može izgraditi bilo koji jezik za označavanje. HTML je jedan od ovih jezika - SGML aplikacija. Drugim riječima, SGML definira kako bi elementi za označavanje trebali izgledati, a HTML definira šta tačno elementi trebaju biti i kako ih treba tumačiti pretraživači. XHTML je zauzvrat aplikacija XML-a, a sam XML nije ništa drugo do pojednostavljena verzija SGML-a. , unatoč činjenici da su po izgledu vrlo slični, imaju značajne skrivene razlike, koje uglavnom leže u principu njihove obrade.

Vratimo se sada na istoriju razvoja HTML-a. Dakle, do 1994. HTML se još uvijek koristio samo za strukturno označavanje podataka, iako je već uključivao oznake za isticanje teksta podebljanim ili kurzivom. Iste 1994. godine stvorena je organizacija W3C (World Wide Web Consortium) - World Wide Web Consortium, na čijem čelu je, sasvim logično, isti Tim Berners-Lee, a 1995. objavljena je preporuka HTML 2.0. Kreatori HTML-a su već shvatili da će s vremenom njihova zamisao evoluirati iz jezika statičkog označavanja teksta u glavni alat za kreiranje dinamičkih Internet resursa. Glavni dodatak HTML 2.0 bio je pojavljivanje kao dijela jezika obrazaca sa skupovima korisničkih kontrola koje su se koristile da korisnik unese parametre za HTTP zahtjeve.

Nakon objavljivanja druge verzije, odmah je počeo rad na sljedećoj generaciji HTML-a. Godine 1997. objavljena je preporuka HTML 3.2, koja je dopunila markup jezik sa tabelama, okvirima, slikama i nekim drugim važnim oznakama. Ali najvažnije dostignuće treće verzije je to što su se njeni autori ponovo vratili problemu vizualizacije markupa u pretraživaču, sjećajući se da HTML treba samo označiti strukturu dokumenta i ne bi trebao direktno sadržavati parametre za grafičke stilove za prikaz elemenata u pretraživač. Rezultat njihovog rada na HTML 3.2 bila je pojava nezavisnog CSS jezika (Cascading Style Sheets) - kaskadnih listova stilova, čiji se kod sada može povezati sa HTML kodom za označavanje i na taj način prilagoditi izgled stranice.

Izdavanjem verzije 4 HTML-a 1997. godine, osoblje W3C-a je oslobodilo svoju zamisao onih nepotrebnih elemenata koji su, s pojavom CSS-a, postali zastarjeli i ugrozili su ideju odvajanja označavanja strukture od parametrizacije prezentacije. Ali niko ne bi blokirao novu verziju zbog takvih sitnica. Glavno dostignuće preporuka HTML 4.0 bilo je pojavljivanje objektnog modela stranice (Document Object Model, DOM), čijim elementima se sada moglo manipulirati putem skriptnih programskih jezika koje izvršavaju pretraživači. Najpopularniji takav programski jezik je JavaScript. HTML plus DOM plus JavaScript jednako je dinamičkom HTML-u ili jednostavno DHTML-u, što je označilo proboj u web dizajnu. Sada elementi učitane internet stranice mogu mijenjati svoj izgled kao odgovor na radnje korisnika, kao i dodavati nove i brisati postojeće elemente. Dana 24. decembra 1999. objavljeno je najnovije izdanje 4. verzije jezika za označavanje hiperteksta, HTML 4.01.

HTML5 još nije dobio status zvanične W3C preporuke, ali je već jasno da HTML autori nastavljaju da rade na razvoju zahtjeva za podršku objektnog modela dokumenta i JavaScript interpretaciju. Iako će HTML5 dobiti brojne nove oznake, većina preporuka se i dalje odnosi na ponašanje pretraživača u kontekstu DHTML-a: postojat će ugrađena podrška za funkcije prevlačenja i ispuštanja, mogućnost crtanja na virtualnom platnu. , kontrolirati historiju pregledavanja i dijeliti poruke između stranica, sačuvati kontekst izvršavanja i još mnogo toga. Nadamo se da će s objavljivanjem novih HTML preporuka, problemi nedostatka kompatibilnosti među pretraživačima, kada se isti JavaScript kod različito izvršava u različitim pretraživačima, postepeno nestati. Na kraju krajeva, trend definiranja zahtjeva za rad sa objektnim modelom i JavaScript-om će se nastaviti, a programeri pretraživača će morati (ako žele da se koriste njihovi softverski proizvodi) da slijede ove zahtjeve.

HTML5 je planiran za izdavanje 2014. Možda će do tog vremena W3C razviti posebne preporuke koje se odnose samo na JavaScript programiranje, a HTML će na kraju ponovo postati isključivo jezik za označavanje strukture dokumenta. Uprkos činjenici da je danas tek 2012., mnogi su već podržani od strane najpopularnijih pretraživača. Mnogo toga što su web dizajneri ranije morali sami da urade (isti drag-and-drop), sa izdavanjem HTML5 biće podržano na nivou pretraživača, a ovakav razvoj događaja ne može a da ne raduje. Ostaje nam da se nadamo da će se trend nastaviti.

Internet je svetska mreža koja objedinjuje računarske mreže širom sveta na osnovu jedinstvenih standardnih sporazuma (protokola) o načinima razmene informacija i jedinstvenog sistema adresiranja.

Do danas je internet stekao neviđenu popularnost. Prema procjenama stručnjaka, internet povezuje više od 100 miliona računara. Više od 300 miliona ljudi u 170 zemalja koristi internet usluge.

Sa funkcionalne tačke gledišta, Internet je:

ü jeftino, brzo sredstvo komunikacije između pretplatnika širom svijeta;

ü neuporedivo skladište informacija o bilo kojoj oblasti znanja;

ü novo obećavajuće okruženje za aktivnosti.

Utjecaj Interneta se ne proteže samo na tehnološko područje kompjuterskih komunikacija, on ima i društvenu orijentaciju i prožima čitavo društvo, jer se operativna sredstva za stjecanje znanja i elektronska trgovina sve više šire.

Najčešći i najpopularniji internet servis danas je WWW (World Wide Web). Informacije na WWW-u su predstavljene u obliku tzv. hipertekstualnih (ili, šire, hipermedijskih) dokumenata, koji mogu sadržavati formatirani tekst, grafiku, audio i video fragmente. Glavna karakteristika hipertekstualnih dokumenata je prisustvo aktivnih zona su osjetljivi na klik mišem, fragmenti teksta mogu biti aktivni, a klikovi na aktivnu zonu izazivaju preuzimanje (ciljnog) dokumenta.

Da biste naučili kako postavljati materijale na Internet, prvo se morate upoznati sa jezikom za označavanje hiperteksta HTML (H yperT ext M arkup L anguage)

HTML osnove

Jezik za označavanje hipertekstualnih dokumenata HTML je skup naredbi koje se nazivaju oznake (sa engleskog tag HTML oznake koje se nalaze u tekstu dokumenta se tumače od strane pretraživača prilikom prikazivanja dokumenta.

Pregled HTML dokumenata se vrši pomoću programa - pretraživači(sa engleskog Pretraživač), koji prikazuju dokument prema HTML oznakama i pružaju navigaciju hipervezom. Najčešći pretraživači su Microsoft Internet Explorer iz Microsoft Corporation i Netscape Navigator iz Netscape Communications Corporation.

Pošto je HTML dokument tekstualna datoteka, može se pripremiti u jednostavnom uređivaču teksta, kao što je Notepad ( Notepad), ali je vrlo radno intenzivan. Češće koriste specijalizovane uređivače dizajnirane posebno za pripremu HTML dokumenata, koji vam omogućavaju da ubacite oznake pomoću dugmadi na traci sa alatkama ili komandi menija, i da postavite atribute oznaka u dijaloškim okvirima, na primer, Macromedia Dreamweaver, Microsoft FrontPage, HomeSite, itd.

HTML dokument se može dobiti pretvaranjem u HTML format, na primjer, iz formata dokumenta Microsoft Office. Treba napomenuti da se s takvom transformacijom izvorni tekst HTML dokumenta ispostavlja izuzetno suvišnim i treba ga ispraviti. Mnogo je efikasnije koristiti posebne HTML uređivače.

Sintaksa HTML oznake

HTML oznaka je napisana u ugaonim zagradama (znakovi) i sastoji se od imena, koje može biti praćeno listom atributa (opciono za većinu oznaka). Imena i atributi su engleske riječi i skraćenice.

Oznake se mogu podijeliti u dvije grupe:

Uparene oznake (takođe se nazivaju kontejneri) imaju dvije komponente: otvaranje (početno) i zatvaranje (konačno); završna komponenta ima isto ime, ali kada se napiše, imenu prethodi kosa crta (simbol / ). Tekst dokumenta i druge oznake mogu se nalaziti između komponenti za otvaranje i zatvaranje. Fragment dokumenta koji se nalazi između otvaranja i zatvaranja oznake kontejnera formatira pretraživač prema značenju oznake, na primer, tekst koji se nalazi između oznaka biće prikazan podebljanim slovima (ime oznake je sa engleskog). bold). Uparene oznake mogu biti ugniježđene, ali se ne smiju preklapati.

Neuparene oznake (također tzv autonomna) nemaju završnu komponentu kada se interpretiraju, jedan ili drugi objekat se ubacuje u prikazani dokument. Na primjer, oznaka , koji se pojavljuje u tekstu HTML dokumenta, uzrokuje umetanje grafičke slike iz pict.gif datoteke.

Atributi na listi su odvojeni jedan od drugog jednim ili više razmaka, ili znakova tabulatora, ili znakova za novi red. Velika većina atributa se koristi kao par naziv atributa = vrijednost atributa. Kada je vrijednost atributa više od jedne riječi ili jednog broja, treba je staviti u jednostruke ili dvostruke navodnike. Atributi nisu navedeni u završnim komponentama oznaka.

Evo primjera oznake s atributima:

Naziv oznake Ime atributa

Vrijednost atributa

Ime atributa

Vrijednost atributa

Zdravo !

Nakon što je naišao na takvu oznaku u HTML dokumentu, pretraživač je interpretira, prikazujući tekst koji slijedi iza oznake u znakovima uvećanim u odnosu na osnovnu veličinu (SIZE=+2) i crvenoj boji (COLOR=RED); ovo oblikovanje teksta se primjenjuje sve dok se ne naiđe na završnu oznaku.

Velika i mala slova u unosima oznaka i atributa nisu bitna.

Struktura HTML dokumenta

HTML dokument je zatvoren u oznakama i Između ovih oznaka postoje dva odeljka: odeljak zaglavlja (između oznaka i) i deo tela dokumenta (između oznaka i) Odeljak zaglavlja sadrži opis parametara koristi se prilikom prikazivanja dokumenta, ali se ne odražava direktno u prozoru pretraživača. Sekcija tijela dokumenta sadrži glavni tekst namijenjen za prikaz od strane pretraživača, oznake za formatiranje, postavljanje slika, tabela, hiperveza itd.

HTML kod najjednostavnijeg dokumenta pogodnog za postavljanje na Internet izgleda ovako:

< TITLE >Naša prva stranicaTITLE >

Najjednostavniji HTML dokument

Ovaj kod se može ukucati u uređivač teksta Notepad i sačuvati kao fajl sa ekstenzijom . htm ili. html - u ovom slučaju, dokument će se otvoriti u podrazumevanom pretraživaču instaliranom na vašem računaru. Pregledač će prikazati ovaj dokument tako što će u svom prozoru prikazati red "Najjednostavniji HTML dokument" koji se nalazi u dijelu tijela dokumenta. Izraz "Naša prva stranica" će se pojaviti u naslovnoj traci pretraživača.

HEAD section

Odjeljak zaglavlja obično sadrži oznake koje su nevidljive korisniku, ali ipak mogu aktivno utjecati na izgled dokumenta.

Tag	Svrha
	Određuje naziv cijelog dokumenta. Naziv se obično prikazuje u naslovnoj traci prozora pretraživača. Ovaj element je neophodan za bilo koji HTML dokument i može se navesti najviše jednom.
	Određuje osnovnu adresu (URL) trenutnog dokumenta koja će biti početna tačka za izračunavanje relativnih adresa unutar dokumenta. Element nema završnu oznaku. Najmanje jedan od argumenata mora biti prisutan: HREF - specificira osnovnu adresu (URL) trenutnog dokumenta. TARGET - specificira naziv okvira koji će se po defaultu koristiti u hipervezama. Ovo može biti korisno ako želite da otvorite sve veze u dokumentu u drugom okviru.
< STYLE TYPE= "text /css " >	Koristi se za umetanje kaskadnih listova stilova (CSS - Cascade Style Sheet) u dokument. TYPE je obavezan atribut čija je vrijednost obično "text/css".
< МЕТА …>	META element se koristi za tehnički opisivanje dokumenta. Uz pomoć ovog elementa u naslov dokumenta se unose dodatne korisne informacije, nevidljive korisniku, ali ponekad jednostavno nezamjenjive za ispravno indeksiranje vaše stranice od strane robota pretraživača. Element nema završnu oznaku. NAME - definira naziv meta posta. Postoji mnogo unaprijed definiranih imena, od kojih neke možete vidjeti u primjeru ispod. CONTENT - dodjeljuje vrijednost meta unosu definiranom u parametru NAME.

BODY section

Ovaj odjeljak uključuje glavni sadržaj web stranice - tekst dokumenta, slike, tabele, itd. Element BODY ne smije se pojaviti više od jednom u dokumentu i može uključivati ​​sljedeće atribute:

Sintaksa atributa	Svrha
MARGINHEIGHT= broj	Određuje širinu (u pikselima) gornje i donje margine dokumenta. Radi samo u Netscape pretraživačima
TOPMARGIN= broj	Određuje širinu (u pikselima) gornje i donje margine dokumenta. Radi samo u Internet Explorer pretraživačima
MARGINWIDTH= broj	Određuje širinu (u pikselima) lijeve i desne margine dokumenta. Radi samo u Netscape pretraživačima
LEFTMARGIN= broj	Određuje širinu (u pikselima) lijeve i desne margine dokumenta. Radi samo u Internet Explorer pretraživačima
BACKGROUND= URL	Određuje sliku koja će "ispuniti" pozadinu (pozadinska slika). Vrijednost je navedena u apsolutnoj ili relativnoj adresi slike (pogledajte odjeljak Postavljanje slika)
BGCOLOR= boja	Određuje boju pozadine dokumenta. MicrosoftInternetExplorer podržava 16 standardnih naziva boja (aqua, crna, plava, fuksija, siva, zelena, limeta, kestenjasta, mornarska, maslinasta, ljubičasta, crvena, srebrna, teal, žuta, bijela) Drugi način je korištenje koda boje u obliku šestocifrenog heksadecimalnog broja koji određuje intenzitet crvene (prve dvije cifre), zelene (sljedeće dvije cifre) i plave (zadnje dvije cifre) komponenti. Intenzitet svake komponente u heksadecimalnom obliku kreće se od 00 do FF. Kada navedete boju kao vrijednost atributa za oznaku, heksadecimalnom broju prethodi znak #. Na primjer, unos COLOR ="#0000 FF " znači plavo Unatoč osnovnoj mogućnosti specificiranja miliona boja, mora se uzeti u obzir da pretraživači prikazuju samo 256 boja, a svaki pretraživač ima svoju paletu boja. U ovoj paleti pretraživač će odabrati boju koja je najbliža navedenoj
TEKST= boja	Određuje boju teksta u dokumentu
LINK= boja	Određuje boju hiperveza u dokumentu
ALINK= boja	Definira boju isticanja hiperveza kada se klikne.
VLINK	Definira boju hiperveza na već pregledane dokumente

Formatiranje teksta Formatiranje znakova

Sve oznake za formatiranje znakova imaju i početnu i završnu komponentu i djeluju na tekst zatvoren između njih.

Glavna oznaka je ... FONT>, koja se mora koristiti s jednim ili više atributa koji mijenjaju veličinu, boju i font fonta:

Sintaksa atributa	Svrha
VELIČINA = značenje	Veličina je navedena ili kao apsolutna vrijednost (broj od 1 do 7) ili u odnosu na osnovnu veličinu fonta (u obliku +n ili -n).
BOJA= boja	Boja
LICE = lista fontova	Tipografi za prikaz teksta; imena su navedena po želji odvojena zarezima, npr. FACE="Verdana, Helvetica, Arial, Sans-Serif" Također možete odrediti jedan od fontova, ali imajte na umu da ovaj font možda neće biti instaliran na korisnikovom računaru, a "egzotični" fontovi neće biti prikazani u pregledniku

Osim toga, oznake se koriste za promjenu stila znakova:

. .. (od engleskog bold) − podebljan font;

.. . (od engleskog italic) - kurziv;

... (od engleskog TeleType) – monospace font;

... (od engleskog underline) - podvučeno;

... S > (iz engleskog s trikethrough) - precrtano;

... (sa engleskog s ub script) – indeks;

... (iz engleskog sup erscript) je superskript.

Tekst zatvoren između oznaka

i (iz engleskog pre formatirano), prikazuje se onako kako je prethodno formatirano, sa svim razmacima i prijelomima reda.

Formatiranje pasusa

Tekst se prikazuje u prozoru pretraživača reč po reč kada se dostigne desna ivica prozora, sledeća reč se automatski pomera u novi red. Čak i ako je u kodu stranice uneseno nekoliko razmaka ili je tekst napisan u novom redu, ove radnje neće biti prikazane kada se pregledaju u pretraživaču. Stoga, da biste prikazali niz uzastopnih razmaka ili nekoliko praznih redova u tekstu, morate koristiti različite oznake.

Tag
(iz engleskog b reak)prekida tekstualni tok i umeće novi red bez kreiranja više uzastopnih oznaka
se tumače kao nekoliko praznih redova. Oznaka nema završnu komponentu.

Oznaka (sa engleskog str aragraph)počinje pasus od prethodnog se odvaja dvostrukim proredom, odnosno nekoliko uzastopnih oznaka

se tumače kao jedan (za razliku od oznake
).Komponenta za zatvaranje

opciono, budući da se prethodni pasus završava tamo gde počinje novi. Oznaka ima opcioni atribut ALIGN koji ukazuje na tip poravnanja pasusa, koji može imati vrednosti LEFT, CENTER, DESNO i JUSTIFY, određujući poravnanje ulevo, centar, desno i širina. Tekst zatvoren u tagovima će također biti centriran.

...

Ako je komponenta za zatvaranje

izostavite, navedeni tip poravnanja se zadržava do sljedeće oznake koja specificira poravnanje ili do kraja dokumenta.

HTML vam omogućava da kreirate paragrafe formatirane kao numerisane liste ili liste sa nabrajanjem. Fragment teksta, koji je lista, sadržan je u oznakama:

naređena (numerisana) lista (sa engleskog o rdered l ist)

nesređena (nabrajana) lista (od engleskog u nordered l ist)

Svaki element uređene ili neuređene liste je zatvoren u tagovima ... (od engleskog l ist i tem). Prilikom prikaza teksta, svaki element liste će biti postavljen u novi red, označen brojem ili markerom. Osim toga, lista može imati naslov, koji je određen oznakom (iz engleskog l ist h eader). Završne oznake nisu potrebne.

	Numerisana lista	Označena lista
Element koda	< O L> Naslov Prvi element Drugi element Treći element	< U L> Naslov Prvi element Drugi element Treći element U L>
Prikaz pretraživača	Naslov 1. Prvi element 2. Drugi element 3. Treći element	Naslov · Prvi element Drugi element · Treći element

Lista na više nivoa može se organizovati kombinacijom numerisanih lista i lista sa nabrajanjem.

Tag ima opcione atribute:

Sintaksa atributa	Svrha
TIP = formatu	Format numeracije može imati sljedeće vrijednosti:
		arapski brojevi (zadano)
		velika slova
		mala slova
		veliki rimski brojevi
		malim rimskim brojevima
START = vrijednost	prvi broj na listi (podrazumevano 1)

Tag ima opcioni atribut

Sintaksa atributa	Svrha
TIP = formatu	Format tokena može imati sljedeće vrijednosti:
	Disc	disk (zadano)
	Krug	krug
	Square	Square

Paragrafi se takođe mogu formatirati kao naslovi nivoa (od n = 1 do n = 6), u tu svrhu se koriste oznake oblika ... n>. Naslov prvog nivoa se prikazuje najvećim fontom.

Oznake

, ... ,

može imati atribut poravnanja ALIGN sa vrijednostima LIJEVO, DESNO i CENTER.

Postavljanje crteža

Slike koje pregledač prikazuje prilikom pregleda web stranice pohranjuju se u zasebne datoteke u gif, jpg (jpeg) ili png formatu, a u kodu stranice pravi se link do željene datoteke. Za to se koristi neupareni tag, koji ima jedan obavezni i niz opcionih atributa.

Potreban atribut:
SRC= url	Adresa grafičke datoteke (relativna ili apsolutna)
ALT= tekst	Alternativni tekst prikazan u načinu preglednika bez učitavanja slika (mora biti stavljen u navodnike)
GRANICA = značenje	Debljina ivice u pikselima, 0 znači da nema ivice (zadano)
BOJA GRANICA = boja	Postavlja boju ivice
VISINA = značenje	Visina slike u pikselima (originalna po defaultu) ili kao postotak visine prozora preglednika
WIDTH= značenje	Širina slike u pikselima (originalna po defaultu) ili kao postotak širine prozora pretraživača
HSPACE = značenje	Slobodni prostor lijevo i desno od slike u pikselima
VSPACE = značenje	Slobodni prostor iznad i ispod slike u pikselima
ALIGN = značenje	Poravnava sliku horizontalno. Ako je postavljeno LIJEVO ili DESNO, slika će biti vodoravno poravnata u skladu s tim, postavljanjem ovih vrijednosti će se tekst omotati oko slike

Pogledajmo bliže apsolutne i relativne metode adresiranja datoteke.

Obraćanje u apsolutnom obliku koristi se kada se odnosi na resurse koji se nalaze na drugim serverima. Univerzalna adresa koja određuje lokaciju informacijskog resursa naziva se URL (Uniform Resource Locator). URL se sastoji od dva dijela, odvojena dvotočkom. Prvi dio označava tip mrežnog protokola, koji ovisi o vrsti resursa. Na primjer, ako se resurs nalazi na WWW serveru, ovo je protokol http.Drugi dio uključuje ime računara (servera) u sistemu imena domena i (ako je potrebno) ime putanje datoteke. Kada pišete ime putanje, nazivi direktorija su odvojeni kosom crtom (znakom /) u nazivima datoteke i direktorija razlikovati velika i mala slova, razmaci nisu dozvoljeni. Evo primjera URL-ova:

http://www. vshu. kirov .ru/ site / images / picture 1. jpg

http://195.21.123.13:8110

ftp://everything.com/soft/prog.zip

mailto:Ova adresa el. pošte je zaštićena od spambotova. Trebate omogućiti JavaScript da biste ga vidjeli.

Zadnji URL koji upućuje na protokol mailto i adresa e-pošte ne vodi ni na jedan izvor informacija; Ovo je jedini tip URL-a koji ne uključuje dvije kose crte naprijed nakon dvotočka.

Adresiranje slika u apsolutnom obliku se praktički ne koristi pri izradi web stranice.

Obraćanje u relativnom obliku koristi se kada se odnosi na resurse koji se nalaze na istom serveru. Prilikom pisanja putanje do datoteke, nazivi direktorija su odvojeni kosom crtom (simbol /), kretanje kroz direktorije sistema datoteka jedan nivo naviše je označeno sa dvije tačke (simboli..). Da bi bilo jasnije, zamislite računar, na primjer, sa sljedećom strukturom direktorija koja sadrži HTML datoteke:

SHAPE\* MERGEFORMAT

MySite

Stranice

Slike

Stranica1.htm Stranica2.htm Pict1.jpg Pict2.jpg

Index.htm Slika.jpg

U ovom slučaju, na primjer, moguće su sljedeće opcije za pisanje IMG oznake:

ü < IMG SRC = Picture . jpg >(Slika .jpg slika se nalazi na Index .htm stranici)

ü < IMG SRC = Images / Pict 1. jpg >(slika Slika 1. jpg se nalazi na stranici Indeks. htm)

ü < IMG SRC =../ Picture . jpg >(Slika .jpg slika se nalazi na strani 1. htm )

ü < IMG SRC =../ Images / Pict 1. jpg >(slika Slika 1. jpg se nalazi na strani 1. htm)

Unatoč činjenici da je formalno potreban samo atribut SRC, u praksi je također potrebno specificirati alternativni tekst (ALT atribut), budući da mnogi ljudi rade sa pretraživačem u načinu rada bez učitavanja slika.

Visina i širina područja u kojem se prikazuje crtež određuju se pomoću atributa širine i visine u pikselima ili kao postotak veličine ekrana. Kada se navede jedan od ovih atributa, crtež se skalira tako da njegova visina ili širina odgovara navedenoj. Druga veličina se postavlja automatski, u odgovarajućoj proporciji. Primjena samo jednog od atributa mijenja obje dimenzije crteža.
Ako eksplicitno postavite oba atributa, slika će biti skalirana duž dvije ose u skladu sa navedenim dimenzijama. Atributi visine i širine ne mijenjaju vrijeme učitavanja slike, već samo njen izgled (veličinu) na ekranu.

Hiperveze

Hiperveza je objekat (tekst, slika, fragment slike) koji, kada se klikne mišem, vodi do novog dokumenta ili fragmenta dokumenta. To su hiperveze koje vam omogućavaju da organizirate prijelaz između bilo kojeg dokumenta objavljenog na Internetu.

Tekstualne hiperveze

Veza između HTML dokumenata i fragmenata dokumenta organizirana je pomoću oznake ...(iz engleskog a nchor - sidro).

Oznaka se koristi i za kreiranje veze sa drugim dokumentom i za povezivanje sa fragmentom dokumenta.

Potreban atribut:
HREF = url	Adresa ciljnog dokumenta (može biti predstavljena u apsolutnom i relativnom obliku)
Osnovni izborni atributi:
NAME=" Ime"	Označava ono između< A >i A > fragment dokumenta kao mogući objekt veze. Kao vrijednost, trebate napisati latinicom svaku riječ indeksa koja je jedinstvena za ovaj dokument. Na primjer, oznaka Section1 kreira takozvanu oznaku (bookmark) za odlazak na odjeljak 1. U ovom slučaju, možete se pozvati na označeno područje jednostavnim navođenjem njegovog imena nakon naziva dokumenta (prethodi mu #). dakle,< A HREF =" Index . html # part 1">Do 1. dijela A > će vas odvesti u odjeljak "1. dio" indeksne datoteke. html i < A HREF ="# part 2">Na odjeljak 2 A > − na odjeljak "dio 2" trenutnog dokumenta, pod uslovom da dokument ima odgovarajuću oznaku
TARGET = " ime"	Naziv okvira (okvira) ili prozora za prikaz ciljnog dokumenta. Ovaj atribut se koristi samo u sprezi sa HREF parametrom. Vrijednost mora biti ili ime jednog od postojećih okvira ili jedno od sljedećih rezerviranih imena: _self - označava da dokument naveden u HREF parametru treba biti prikazan u trenutnom okviru; _parent - označava da dokument treba da bude prikazan u nadređenom okviru trenutnog okvira (u potpunosti zauzima prozor pretraživača); _blank - specificira da dokument treba biti prikazan u novom prozoru
TITLE= " tekst!}"	Prikazuje opis alata kada pređete mišem preko hiperveze

Tekst i slike smješteni između oznaka postaju aktivno područje dokumenta, osjetljivo na klik mišem koji uzrokuje učitavanje ciljanog dokumenta. Tekst hiperveze je istaknut podvlačenjem i bojama navedenim kao vrijednost atributa LINK, A LINK, V LINK oznake (ili zadane boje).

Hiperlinkovi-slike

Da biste cijelu sliku učinili hipervezom, također možete koristiti oznaku ...., samo umjesto teksta (ili zajedno s tekstom) između< A >i A > oznaka se nalazi< IMG …>sa svim relevantnim atributima.

Na primjer , .

Mapa hiperlinka

Oznaka vam omogućava da fragment teksta ili cijelu sliku učinite aktivnom zonom; Da bi se različiti fragmenti jedne slike povezali s različitim ciljnim dokumentima, morat ćete koristiti oznaku koja implementira sliku karte.

Za oznaku kontejnera, jedini potrebni atribut je NAME, čija će vrijednost biti ime (na primjer, NAME=" mymap " , koji se mora koristiti kada se opisuje USEMAP atribut IMG oznake koja opisuje sliku koja služi kao mapa (sa # − USEMAP="#mymap")

Unutar kontejnera, svako područje slike osjetljivo na miša mora imati oznaku sa sljedećim atributima:

Sintaksa atributa	Svrha
COORDS= lista	Lista koordinata aktivne zone odvojene zarezima (u zavisnosti od tipa datog oblika zone)
HREF = url
OBLIK = formu	Definira oblik jezgra. Moguće vrijednosti za ovaj atribut: krug(krug – određen koordinatama centra i radijusom u pikselima); rect(pravougaonik - određen koordinatama gornjeg lijevog i donjeg desnog ugla); poli(poligon - definisan koordinatama njegovih vrhova) U svim slučajevima koordinate se mjere od gornjeg lijevog ugla slike u pikselima, osa X usmjerena je udesno, a osa Y usmjerena je prema dolje.
NOREF	ponekad je potrebno naznačiti da određena zona (određena atributom SHAPE i koordinatama COORDS) nije aktivna, nema reakcije na klik mišem

Stolovi

Tabele u HTML dokumentima se ne koriste toliko za postavljanje podataka u uokvirene ćelije, već za raspoređivanje dijelova teksta i slika jedan u odnosu na druge.

Tabele u HTML-u se grade red po red. Svi tabelarni podaci su zatvoreni u tagovima

; opis svakog reda ćelija (redova) sadržan je u oznakama ...; sadržaj svake ćelije je sadržan u oznakama ... (obične ćelije) ili ... H> (zaglavlja).

Dakle, da biste opisali, na primjer, tablicu od dva reda, od kojih svaki sadrži dvije ćelije, morat ćete kreirati sljedeću konstrukciju:

Ćelije tabele mogu sadržavati tekst, slike, ugniježđene tabele itd. Ne biste trebali ostaviti ćelije tabele prazne; ako se neka ćelija čini prazna, stavite u nju razmak bez prekida.

Tekst postavljen u ćelije tabele automatski se postavlja od strane pretraživača po podrazumevanoj vrednosti; tekst se prikazuje reč po reč; Kada se dostigne desna ivica ćelije, sljedeća riječ se pomiče u novi red.

Ćelije tabele mogu da obuhvataju više redova ili kolona kada se opisuju takve ćelije, atributi ROWSPAN (ćelija čija oznaka sadrži ovaj atribut je „rastegnuta“ za određeni broj redova) i COLSPAN (ćelija je „protegnuta“ za nekoliko kolona); korišteno. Evo primjera organiziranja tabele sa spojenim ćelijama:

< TR >

< TD ROWSPAN=2>1-1 TD >

Oznake koje opisuju tabele imaju brojne opcione atribute.

Atributi oznake određuju parametre tablice u cjelini:

	Sintaksa atributa		Svrha
ALIGN = vrijednost		Poravnanje u odnosu na tok teksta moguće vrijednosti su lijevo, desno i središte
POZADINA = url		Pozadinska slika za cijelu tablicu
BGCOLOR= boja		Boja pozadine
BOJA GRANICA = boja		Boja ivice
BORDERCOLORDARK = boja		Boji desnu i donju ivicu glavnog okvira te lijevu i gornju ivicu svake ćelije navedenom bojom
BORDERCOLORLIGHT = boja		Boji lijevu i gornju ivicu glavnog okvira i, shodno tome, desnu i donju ivicu svake ćelije u navedenoj boji
CELLPADDING = vrijednost		Udaljenost od granica ćelije do njenog sadržaja u pikselima
CELLSPACING = vrijednost		Udaljenost između ćelija u pikselima
HSPACE = značenje		Slobodni prostor lijevo i desno od tabele u pikselima
VSPACE = značenje		Slobodni prostor iznad i ispod tabele u pikselima
WIDTH= značenje		Širina tabele (postavljena u pikselima ili kao procenat trenutne širine prozora pretraživača)

Atributi oznake određuju parametre date serije (ako se pojave kontradikcije, atributi navedeni u oznaci se poništavaju). Poravnanje sadržaja ćelije su moguće vrijednosti lijevo, desno i u sredini

POZADINA = url

Pozadinska slika za ćelije datog reda tabele

BGCOLOR= boja

Boja pozadine za ćelije u ovom redu

GRANICA = značenje

Debljina ivice koja okružuje ćelije ovog reda BORDER=0 označava nevidljivu ivicu

VALIGN = značenje

Vertikalno poravnanje sadržaja ćelije su gornje, središnje i donje

Atributi oznake određuju parametre date ćelije (ako dođe do nedosljednosti, navedeni atributi i oznake se poništavaju).

Sintaksa atributa	Svrha
ALIGN = značenje	Poravnajte sadržaj ćelije; moguće vrijednosti su lijevo, desno i centar
POZADINA = ur l	Pozadinska slika za ćeliju tabele
BGCOLOR= boja	Boja pozadine za ćeliju
GRANICA = značenje	Debljina okvira koji okružuje ćeliju
VALIGN = značenje	Vertikalno poravnanje sadržaja ćelije su gornje, središnje i donje
WIDTH= značenje	Širina ćelije u pikselima ili postotak širine tabele
ROWSPAN= značenje	Označava broj redova pokrivenih ćelijom
COLSPAN = značenje	Određuje broj kolona koje pokriva ćelija

Kada radite sa tabelama, imajte na umu da je navedena vrijednost za atribut WIDTH u mnogim slučajevima samo "bilježena" od strane pretraživača. Date proporcije se retko održavaju tačno, pretraživač pokušava da prikaže tabelu što je moguće bolje (u svom razumevanju).

Ticker

Korištenje tickera na web stranici čini je dinamičnijom i omogućava vam stvaranje efekta kretanja objekta. Kreiranje oznake pomoću oznake< MARQUEE >... MARQUEE >.

Između< MARQUEE >i MARQUEE > mogu se locirati fragmenti teksta i slike. Tekst se može formatirati pomoću odgovarajućih oznaka, a grafike se ubacuju pomoću .

Sintaksa atributa	Svrha
BGCOLOR= boja	Boja pozadine. Ako je pozadina navedena, pretraživač crta obojenu traku na ekranu duž koje se kreće tekst ili slika.
VISINA = značenje	Visina trake pozadine. Vrijednost je navedena u pikselima ili kao postotak visine prozora pretraživača. Na primjer, ako navedete atribut HEIGHT=25%, traka tickera će zauzeti četvrtinu visine prozora
WIDTH= značenje	Širina tiker trake, naznačena u pikselima ili kao procenat širine prozora pretraživača
DIRECTION= značenje	Smjer kretanja linije: lijevo - lijevo (zadano), desno - desno, gore - gore, dolje - dolje
PONAŠANJE = značenje	Atribut kontrolira ponašanje tickera: skrolovanje (podrazumevano) – kada dođe do ivice prozora, linija se gubi iz vidokruga, a zatim se pojavljuje na suprotnoj strani; slajd - linija se pojavljuje s ruba prozora, stiže do suprotne i zaustavlja se; naizmjenično - linija se pomiče udesno ili ulijevo, "reflektirajući se" od rubova prozora i mijenjajući smjer kretanja
HSPACE = pixel offset	Pomaknite oznaku vodoravno udesno
VSPACE = Vi co ta u pikselima	Stvaranje praznog prostora iznad i ispod trake
LOOP = značenje	Broj prijelaza linija preko ekrana
SCROOLAMOUNT = značenje	Broj piksela koji linija prelazi svaki korak. Podrazumevani režim je približno 10 px/korak. Ovaj atribut vam omogućava da prilagodite brzinu kretanja linije
SCROLLDELAY = značenje	Definira vremenski interval (u milisekundama) između koraka, koristeći ovaj atribut možete natjerati da se linija trzavo kreće
TRUESPED	Kada je postavljena ova zastavica (atribut bez vrijednosti), koristit će se navedena vrijednost SCROLLDELAY. Ako zastavica nije postavljena, vrijednost je SCROLLDELAY