Šta je to html

ta je HTML

ta je to HTML?Da biste bili uspean stvaralac Web stranica morate znati HyperText Markup Language tj. HTML. On je relativno jednostavan jezik za opis dokumenata i njihovih meusobnih veza a koji se prikazuju u browserima. HTML nije zaista programski jezik u onom smislu u kom su to C++ ili Visual Basic, on je vie sintaksni jezik za formatiranje dokumenata, nastao je od SGML-a (Standard Generalized Markup Language), koji je daleko kompleksniji "meta jezik" a slui za specifiranje elemenata koje se koriste u dokumentima i znaenje tih elemenata. Rast HTML-a je inicirao Netscape, uvoenjem nestandardnih proirenja u jezik, a trenutno se proirenjima i novim verzijama bavi se W3C (www.w3.org) komitet. Znai HTML je iv jezik koji se intezivno razvija, pa se povremeno se pojavljuju problemi sa novitetima koje pojedini browseri ne podravaju. Da bi ste izbegli da izgled vae strane zavisi od browsera u kojem se pregleda, drite se podalje od elemenata koji su specifini za neki od browsera i nisu podrani u ostalima.

ElementiElementi predstvljaju strukturu HTML-a koji opisuju delove HTML dokumenta i mogu da se nalaze bilo gde u HTML dokumentu. Na primer, P element predstvlja paragraf dok EM element proizvodi neglaen sadraj. Svaki elemnt poseduje tri dela: poetni tag, sadraj i zavrni tag. Tag je specijalni tekst tkz. "markup" koji je ograen sa "". A zavrni tag ukljuuje i "/" posle " Meta tag sa HTTP-EQUIV="Refresh" ponovo uitava stranu to omoguuje komunikaciju sa serverom tkz. client-pull, ili, ukoliko sadri URL neke druge strane prosleuje korisnika na tu stranu. U navedenom primeru, "5" oznaava vreme u sekundama posle koga reload/redirekt poinje, a www.webautor.8m.com adresa oznaava adresu na koju bi korisnik bio prosleen posle 5 sekundi:

Center for Information Technology

strana 8

ta je HTML

Meta tag sa HTTP-EQUIV="Window-target" meta tag odreuje ime prozora u kome se pojavljuje stranica. To je korisno kada neko hoe da stavi vau stranicu u frejm (okvir) na njegovom sajtu, tako da izgleda da je i vaa strana deo sadraja njegovog sajta. Meta tag sa NAME atributom imaju najveu ulogu pri prijavljivanju vaih strana na pretrazivae (search engines), jer upravo oni sadre podatke koje pretraivai najvie cene (naravno, osim samog sadraja strane). To su npr. kljune rei (keywords) i opis strane (description)... Posle prijave vaeg sajta na pretrazivae, "robot" pretrazivaa poseti vau stranu i pokupi potrebne podatke za indeksiranje. Da bi taj proces bio bri, tj. da robot ne bi skupljao sve kljune rei iz teksta strane, potrebno je navesti meta tag sa atributom NAME="Keywords". Dok kljune rei sa HTML dokumenta navodite u okviru atributa CONTENT="rec1, rec2, ... ". Nabacati to vie rei (oko 100), tako da se va sajt pomene u to veem broju pretraga. Zajedno sa ovim meta tagom koristite i meta tag za opis vae strane Za browsere koji ne podravaju script potrebno je da skript bloka stavite u okvru komentara kao u prethodnom primeru, pri emu zavrni tag komentar zapoinje sa // to predstvlja linijski komentar u JavaScript-u. Korienjem atributa SRC moete ukljuiti eksterni skript. Poto ste upoznali osnovnu strukturu HTML dokumenta, sledi opis unoenja YU karktera i drugih specijalnih znakova, vie o tome na sledeoj strani.

strana 10

ta je HTML

TA SU TO SPECIJALNI ZNACI?Specijalni znaci ili entiteti obezbeuju metod da se unesu karakteri koji nemogu da se unesu sa tastature, ili su zauzeti npr. znak manje < nemoe da se koristi pri unosu sadraja poto se taj znak koristi za tagove.

EntitetiEntiteti imaju sledeu sintaksu: &naziv_entiteta; , broj_entiteta ili heksadecimalni_broj_entiteta. Samo neki karakteri imaju svoje nazive dok navoenjem broja karaktera tj. njegovog koda moemo ispisati bilo koji znak iz UNICODE kodnog rasporeda. Da bi ispisali znak manje moramo u HTML dokumentu otkucati < Entitet < > & &qout; Decimalna vrednost Heksadcimalna vrednost U Browseru &60 &x3C < &62 &x3E > &38 &x26 & &34 &x22 " &169 &xA9 &174 &xAE Blank na kome se nemoe &160 &xA0 presei red

Ovo je znak manje < a ovo je znak vee > a ovo su " i ovo su "Napravimo jo tri razmakakraj. Ovo je znak manje < a ovo je znak vee > a ovo su " i ovo su " razmaka kraj. Napravimo jo tri

KarakteriHTML 4.0. usvojio je Universal Character Set kao svoj karkter set. Ovaj karkter set je ekvivalent Unicode 2.0 kodnom rasporedu koji sadri karktere skoro svih svetskih jezike ukljuujii i na. Prethodne verzije HTML koristile su ISO-8859-1 kodni raspord koji je podravao samo karktere nekih Zapadno Evropskh jezika. Najednostvniji nain da koristite naa slova je da HTML dokument sa naim slovima snimite u UTF-8 formatu i da u zaglavlju HTML dokumenta tj. u okviru HEAD tagova unesete sledee: Ubacivanje naih slova pomou kodnog rasporeda CP1250 je vrlo jednostavno: 1. U HTML kodu svake stranice unutar HEAD tagova ubacite META tag : Napomena:Ovako se unosi LATIN-2 kodni raspored koji omoguuje prikaz naih latininih slova u prozoru browsera, a odgovara kodnoj strani 1250 u Windowsu.

strana 11

ta je HTML

2. U vaem HTML kodu na mestu gde treba da stoji neko nae slovo ubacite sledee ASCII kodove tj. simbole: za nae veliko za nae malo za nae veliko za nae malo za nae veliko za nae malo za nae veliko za nae malo za nae veliko za nae malo

Ovaj tekst e biti veliine 2, ljubiaste boje i bie prikazan u Verdana fontu ukoliko postoji na raunaru, ako ne onda se uzima drugi font Arial itd..

Ovaj tekst e biti veliine 2, ljubiaste boje i bie prikazan u Verdana fontu ukoliko postoji na raunaru, ako ne onda se uzima drugi font Arial itd..Po HTML 4.0 specifikacij svi HTML tagovi poseduju zajednike atribute, vie o njima na sledeoj strani.

TA SU TO ZAJEDNIKI ATRIBUTI?Po HTML 4.0 specifikaciji skoro svi HTML elementi podravaju jedan skup zajednikih atributa ("Common Attributes"). Ovi atributi omoguuju lako povezivanje elemenata sa stilovima i skriptovima, definisanja lokalnog jezika kao i mnoge skript dogaaje.

Id atributAtribut ID postvlja jedinstveni identifikator za element u dokumentu. Nemogu postojati dva elementa sa istom vrednou ID atributa u jednom dokumentu. U sledeem primeru ID atribut se koristi da identifikuje koji paragraf je prvi a koji drugi u dokumentu: Moj prvi paragraf. Moj drugi paragraf. Pragrafi u ovom primeru mogu da korz ID atribut poveu sa stilom definisanom u stil emi (Cascading Style Sheet): P#prvi { color: navy; background: transparent } P#drugi {

strana 12

ta je HTML

color: black; background: transparent } Takoe ID atribut koristi se da obezbedi jedinstveno ime za HTML element kako bi mu se moglo pristupiti iz scripta.

Class atributAtribut CLASS se koristi za povezivanje elementa sa stlom definisanim u emi stilova (style sheets). Naprimer: Home | Index | Search U ovom primeru koristimo CLASS atribut kako bi povezali stil sa elementom:: .navbar { margin-top: 2em; padding-top: 1em; border-top: solid thin navy } .navbar IMG { float: right } @media print { .navbar { display: none } }

Style atributAtribut STYLE omoguava da se navedi stil u okviru samog elementa tj. van okvira eme stilova na primer: Popularni font za itanje preko ekrana monitora je Verdana. Kada se STYLE atribut koristi potrebno je da se postvi style sheet language pomou META taga na sledei nain: Preporuujemo vam upotrebu CLASS ili ID atributa za postvljanje stilova u odnosu na STYLE poto ID i CLASS mogu da se primene na razliite medije i obezbeuju odvajanje sadraja i formatiranja prikaza.

Title atributAtribut TITLE obezbeuje naslov za element i implementiran je kao "tooltip" u brovserima. Primena ovog atributa mnogo koristi kod referenciranja, slika itd.

strana 13

ta je HTML

[email protected] CGI.pm Yahtzee is my favorite game!

Lang atributAtribut LANG definie jezik za sadraj elementa ukljuujiui i ostale HTML elemente koji se nalaze u njemu a nije naveden atribut LANG. Ovaj atribut je veom zanaajan za pretraivae interneta. Vrednosti atributa su definisani prema specifikaciji :RFC 1766; Evo nekoliko primera: sr za Srpski, en za Engleski, en-US za Ameriki engleski. Korienjem LANG atributa omoguava vam i lako menjanje stila sadraja zavisno od jezika. Osnovni jezik HTML dokumenta se postvlja korienjem LANG atributa kod HTML elementa ili korienjem Content-Language u HTTP zaglavlju pomou meta tagova.

Dir atributAtribut DIR definie smer ispisivanja teksta i moe imati vrednosti s leva na desno left-toright (DIR=ltr koji je unapred ve postvljen ili s desno u levo right-to-left (DIR=rtl).

Skript dogaajiBroj atributa koji definiu klijentski skript je zajedniki za veinu elemenata. Vrednost atributa je ili poziv funkcije ili pet kratkih komandi koji se izvravaju poto se dogaaj desi. Kada se koristi atribut za dogaaj potrebno je da se definie osnovni script jezik: Mogui dogaaji su sledei:

ONCLICK,

kada je nad elementom pristisnuto dugme na miustrana 14

ta je HTML

ONDBLCLICK,

kada je nad elementom nainjen dvostruki klik na kada se nad elementom dri pritisnuto dugme na

miuONMOUSEDOWN,

miuONMOUSEUP,

kada se nad elementom pusti dugeme na miu ONMOUSEOVER, kada se pree miem preko elementa ONMOUSEMOVE, kada se mi pomeri u okviru elementa ONMOUSEOUT, kada se miem pomeri sa elementa ONKEYPRESS, kada se pritisne tipka nad elementom ONKEYDOWN, kada se dri pritisnut taster nad elementom ONKEYUP, kada se pusti taster nad elementom

Napomenimo jo jednom da su ovi atributi zajedniki za skoro sve elemente i da se esto koriste. Poto ste se upoznali sa osnovama HTML slede elementi za formatiranje sadraja, vie o tome na sledeoj strani.

KAKO DA MODIFIKUJETE SADRAJ HTML DOKUMENTA?HTML obezbeuje elemente koje vam omoguuju da modifikujete tekst tj. da definiete naslove, podnaslove, podbljavate i istiete razne delove teksta, postavljate font itd. kako bi sadraj bio pogodniji za itanjie i lepi.

Hx elementi - NasloviU svakom dokumentu potrebno je prvo da definiemo naslov tj. tekst koji se prikazuje slovima veim od standardnih, kako bi bio upadljiviji. Na raspolaganju je est nivoa naslova (Headers). Najvea odgovaraju naslovu prvog nivoa , a najmanja naslovu obeleena kao . Ustvari H1 treba da predstavlja naslov knjige, H2 kao naslov sekcije a H3 kao naslov poglavlja itd. ali HTML standard to nezahteva. Tag Atributi align id class style lang dir align id class style lang dir align id class style lang dir Opis Primer

Naslov 1

Naslov 1Naslov 2

Naslov 2

Naslov 3

strana 15

ta je HTML

align id class style lang dir align id class style lang dir align id class style lang dir

Naslov 4

Naslov 5

Naslov 6

Pored zajednikih atributa koristi i ALIGN atribut sa vrednostima : left, right, & center

P elementPasus (pargarf) se definie tagom a sadri tekst i ostale HTML elemente osim TABLE i ADRESS elementa. Izmeu pasusa se prikazuje jedna prazna linija. Zavrni tag je opcioni ali vam preporuujemo da ga koristite pogotova ako povezujete ovaj element sa stil emom. Pored zajednikih atributa koristi i ALIGN atribut sa vrednostima : left, right, center & justify Tag Opis align id class style lang dir Atributi Primer

NoviPasus

Pasus Pasus 2 Pasus 3 Pasus l Pasus 2 Pasus 3 Kao to se iz primera vidi tekst moemo da poravnjamo sa levom ili desnom ivicom ekrana ili pak da ga centriramo, korienjem atributa ALIGN.

BR elementPrelazak u novi red vri se komndom
, skraenica od Brek Line (prelomi liniju).
tag nema zavrni tag poto nema nikakav sadraj.

strana 16

ta je HTML

Atributi clear id class style lang dir

Primer

Novi red

Prva linija
druga linija
treca linija.... Prva linija druga linija treca linija.... Pored zajednikih atributa koristi i CLEAR atribut sa vrednostima : left, right, all & none. Atribut CLEAR se koristi kod slika ili tabela da bi novi red zapoeo ispod ovih elementa. Ovde ide neki tekst i ako ovde postavimo tag
tekst ide u sledei red a ukoliko stavimo

Tekst zapoinje u novom redu ali ispod slike.

STRONG,EM,CITE,DFN,VAR,B,I & U elementKada treba neto isticati a ne predstvlja ni poseban pasus niti naslov koristimo podebljana ili iskoena slova. Za jako isticanje koristimo elementa . Neki browseri podrzumevaju da je > oznaka za kraj komentara. Komentar moe da se unese i pomou tagova Tekst izmeu ovih tagova se ne prikazuje u browseru tako da se izmeu njih moe napisati svata NAPOMENA: Ovaj element je podran od strane Internet Explorer i Mosaic-a.

ACRONYM elementPomou ovog elementa definiete skraenicu a zadaje se tagovima . Ovaj element je podran samo od strane Internet Explorer-a. HTML HTML

BLINK elementTekst koji se nalazi izmeu tagova u browseru trepti. Ovaj element je podran samo od strane Netscape Navigatora.

Ostali elementi za formatiranje sadraj:Tag Opis Subscript Superscript PrimerSub Super

script script

Precrtan tekst Veliki tekst Mali tekst Tekst sa pisae maine Tagovi sadre informaciju o adresi

Ba ovako

Ba ovakoBa ovako Ba ovako

Milan Skori Dobri Potok b.b. KRUPANj 15314 SRBIJA -

strana 22

ta je HTML

JugoslavijaPoto ste se upoznali sa modifikacijom sadraja, sledi povezivanje HTML dokumenta vie o tome na sledeoj strani.

KAKO SE POVEZUJU HTML DOKUMENTI?Najvanija osobina HTML dokumenta je ta da se oni mogu meusobno referencirti (povezati tj. da jedan ukazuje na drugi itd.), to je zapravo osobina hiperteksta.

A elementElemnt HTML koji omoguuje povezivanje HTML dokumenta naziva se Anchor "sidro" i definie se tagom i . Kako bi se razlikovala od ostatka teksta, veza izmeu dokumenta je obino podvuena i/ili drugoj boji. Tag Argumenti href target id name class style title Opis

Generie link ka drugom dokumentu ili servisu

Veza ka drugom dokumentu ostvaruje se navoenjem mesta gde se nalazi referencirani dokument, pomu atributa href (koji je inae obavezan a ostali atributi su neobavezni) u a tagu. Referencirani dokument moe da se nalazi u istom ili drugom katalogu (direktorijumu) ili na drugom raunaru koji je pak ak u Africi ili Aziji. Veza ka drugom dokumentu. Veza ka drugom dokumentu. Ako kliknemo na podvuenu re, automatski se otvara dokument sa zadate adrese. NAPOMENA: U prethodnom primeru ukoliko klknete na dati link nee se otvoriti drugi dokument, jer se samo opisuje postupak. Adresa je u optem sluaju u istom katalogu drugom ili u nekom drugom. Pri tome se koristi UNIX sintaksa sa desnim kosim crtama / i gde treba voditi rauna o malim i velikim slovima. Ukoliko se dokument nalazi u prethodnom direktorijum u odnosu na tekui u kome se nalazi i sam dokument refernca glasi: drugom A ukoliko se dokument nalzi u sledeem podktalogu u odnosu na tekui: drugom Ako je referncirana datoteka slika, klik na referncu e prikazati tu sliku na praznom ekranu: Pogledajte sliku veliine 20kb.

strana 23

ta je HTML

Pri referenciranje dokumenata na drugim raunarima, uz korienje raznih mrenih protokola navodi se kompletna URL adresa. Uniform Resurce Locator skraeno URL predstvalja adresu preko koje se pristupa odreenom mrenom servisu a sadri naziv protokola, adresu servera i putanju do dokumenta. RC ETF BG Pomou ove komande mogu se pozvati i drugi mreni servisi ( ovi podaci se navode u okvru href atributa ):

gopher://galeb.etf.bg.ac.yu/linux/texts/sendmail ftp://ubbg/net/internet/netscape/n601.exe telenet://afrodita.rcub.bg.ac.yu news:soc.culture.yu

Za Usent News se navodi samo naziv diskusione grupe, jer news serveri medjusobno razemenjuju iste poruke, a pristupa se najbliem. Ukoliko se nenavde ime datoteke u putanji, uitava se podrazumevana datoteka obino je to index.htm, index.html ili default.htm. Refernciranje na samom dokumentu se vri tako to se na mestima koje treba referncirati ostavljaju sidra, na sledei nain : ovde je pocetak a neto kasnije u istom dokumentu taj deo referencirati kao: Povratak na pocetak Ova refernca se moe pozvati iz drugih dokumenata na primer: Pocetak necega - naziv cega Uloga ovog naina oznaevanja teksta dolazi do izraaja kada je stranica sastavljena od dosta teksta, pa je potrebno mnogo skrolovanja da se pregleda itav sadraj. Ako je sadraj stranice takav da se moe podeliti na vie logikih celina (nekoliko poglavlja u istom tekstu), mogue je na poetak teksta postaviti rezime, sa linkovima ka poglavljima u tekstu. Prozori browser-a mogu imati imena, preko kojih se mogu referncirati dokumenta iz razliitih prozora. Kada se klikne na referncu koji referncira ka drugom prozoru, otvorie se dati prozor ukoliko ve prethodno nije otvoren. Ovakve akcije su mogue jedino u browser-ima koji podravaju frejmove. Oznaavanje prozora se cri pomou atributa TARGET: Link text Atribut TARGET atribut prima sledee vrednosti: window_name To moe biti bilo koje ime specifirano u okviru ili korienjem window.open u JavaScript-u. _self Upotrebom ove vrednosti otvara se dokument u istom prozoru u kome se nalazi i sam

strana 24

ta je HTML

link(referenca). _parent Korienjem ove rezervisane vrednosti otvarase dokument u prozoru koji je roditelj(matini) prozoru koji sadri link. _top Ova vrednost omoguava da se referncirani dokument u okviru frejmova otvori u istom prozori pri tome briui sve postojee frejmove (okvire). _blank Korienjem ove vrednosti dokument koji je referenciran se otvara u novom prozoru. Netscape dozvoljava unoenje teksta u subject liniju poruke pomou sledee sintakse: Komentari Internet Explorer 4.0 i noviji podrava i upisivanje teksta u podruje za mail (pismo): Lista slanja Povezivanje scripta i anchor taga vri se na sledei nain: Moja funkcija
Tip komentara:
Kritika Pohvala Sugestija
Izaberite sajt na koji se odnosi va komenatr:

strana 44

ta je HTML

Skola Radjevina Web Autor
Komentar:
Unesite va komentar
Ukoliko posedujete unesite vae:
Korisniko ime:
Lozinka:

U browser-u: Prezime i ime: Tip komentara: Kritika Pohvala Sugestija Izaberite sajt na koji se odnosi va komenatr: Komentar:Unesite vas komentar

Ukoliko posedujete unesite vae: Korisniko ime: Lozinka:Posalji Obrisi

Validnost uneenih vrednosti u polja formulara se proveravaju obino JavaScript funkcijama ili programiranjem u Javi i slino. I na kraju slede frjmovi tj. okviri, vie o njima na sledeoj strani.

FAMA O FREJMOVIMAFrejmovi omoguuju deljenje ekrana browsera na vie delova - okvira u kojima se prikaziuju razliiti dokumenti odjednom. Ekran se moe podeliti po vertikali ili po horizontali, i u svaki okvir se prikazuje zasebni HTML dokument.

strana 45

ta je HTML

FRAMESET, FRAME i NOFRAME elementFrejmove je izmislio Netscape podravi ih u svom brwseru od verzije 2.0 a slue da se definiu elementi stranice koji bi trebalo da su stalno na ekranu (naslovi, sadraji, navigacije itd.). Frejmove treba koristiti samo kada treba organizovati hijerarhijski veliku koliinu podataka i obezbediti laku navigaciju izmeu stranica. Tag Argumenti rows cols onload onunload Opis Vri deljenje ekrana. Sadri FRAME komandu i opciono NOFRAME komadu

name src longdesc frameborder marginwidth Okviri marginheigh t noresize scroling Definie prikaz bez okvira

FRAMESET zamenjuje BODY tag tako da odmah sledi posle HEAD taga. ... Unutar FRAMESET elementa moete zadati koliko hoete redova (ROWS) i/ili kolona (COLS) kao i veliinu okvira: Prethodni kod deli ekran po visini na prvih 50 taka i ostatak (Zadavanje u pikselima koristite prilikom prikaza slika). Prethodni kod deli ekran po irini na dva okvira zadatih relativnim irinama ekrana. Frejmovi mogu da se prikazuju i jedan u drugom ali treba biti obazriv. Stranice retko dele u vie od 3-4 frejma. U okviru FRAMESET taga definiu se atributi svagog okvira pomou FRAME elementa :

strana 46

ta je HTML

Pomou SRC atributa u okviru frejma definiete HTML dokument koji e se prikazati u okviru. Linkovanje se vri na sledei nain, jer je potrebno odrediti u koji okvir se alje dokument: Zato je potrbno definisati ime (NAME) u okviru FRAME taga. SCROLLING atribut u okviru FRAME definie skrolvanje datog okvira i ona moe imati vrednosti yes, no & auto. Ukoliko elite okvire bez ivica postavite atribut FRAMEBORDER na nulu, ukoliko se ne navede podrazumevana vrdnost je 1. NORESIZE atribut zabranjuje korisnicima da poveavaju/smanjuju frejm, ali ovaj argument ne treba korsititi. MARGINWIDTH & MARGINHEIGHT atributi definiu broj piksela koji se koriste za leve i desne margine kao i gornje/donje margine u okviru. Njihova vrednost mora biti vea od jednog piksela. Pomou NOFRAMES taga u okviru FRAMESET tagova definiete ta e posetilac da vidi u browserima koji ne podravaju frejmove. Uvek treba koristi ovaj tag i omoguiti pregled stranica bez frejmova. Table of Contents

HTML 4.0 Reference

HTML 3.2 Reference

CSS Guide

IFRAME elementInternet Explorer od verzije 3 omoguava korienje lebdeih frejmova. Slini su standarnim frejmovima, stim to mogu da se nalaze bilo gde u HTML dokumentu zajedno sa ostalim HTML elementima. Lebdei frjmovi zadaju se tagovima ... . Svaki HTML element koji se nalazi izmeu ovih frejmova bie prikazn u browserima koji ne podravaju

strana 47

ta je HTML

IFRAME element, dok HTML dokument koji je navedn u okviru taga bie prikaz ukoliko ga podrava. Ovaj sajt koristi lebdee okvire Prethodni HTML kod prikazee okvir pod imenom "content_frame" i u njemu HTML dokument "content_frame" u Internet Explorer-u, dok tekst 'Ovaj sajt koristi lebdee okvire' u svakom drugom browseru. Druga znaajna razlika u odnosu na standardne okvire je u tome to lebdei okviri podravaju atribute WIDTH, HEIGHT kao i ostale atribute kao kod taga kao to su HSPACE, VSPACE i ALIGN atributi, kako bi se postvila veliina i poloaj okvira u HTML dokumentu. to se tie refernciranje koriste istu tehniku kao i stndrdni okviri korienjem atributa TARGET kod A elementa i NAME atributa kod okvira. Indeks svih HTML elementa nalazi se na sledeoj strani.

INDEKS HTML ELEMENATAA B C D E F H I K L M N O P Q S T U W X

Šta je to html

Documents