Sustav koji nam pomaže pri pronalaženju podataka na Internetu zove se World Wide Web (skraćeno: Web, WWW ili W3).
Svaki dokument koji vidimo na Webu napisan je u jeziku zvanom HyperText Markup Language (skraćeno: HTML).
Mi ćemo se ovdje pozabaviti izradom HTML dokumenata pisanjem izvornog koda, što će nas uvesti u samu bit izrade HTML stranica.

ŠTO JE POTREBNO ZA IZRADU HTML DOKUMENTA

Za izradu HTML dokumenta potrebno je imati instalirane slijedeće programe:
- browser za pregled HTML dokumenta, u kojem upravo čitate ovaj sadržaj
- običan tekst editor (npr. Notepad) za editiranje HTML koda dokumenata.

KAKO OZNAČAVAMO HTML DOKUMENTE

Svaki HTML dokument ima svoje ime kojem je pridružena extenzija .htm ili .html
Potražite "Address" polje u vašem browseru i pogledajte kako se zove ovaj dokument.
Treba pisati: ...\index.html

KAKO VIDJETI IZVORNI KOD HTML DOKUMENTA

Nakon što u browseru vidite sadržaj nekog HTML dokumenta, do njegovog izvornog koda možete doći na dva načina:

1. - tako da u browseru kliknete desnom tipkom miša i izaberete opciju
"View Source", nakon čega će se otvoriti izvorni kod tog dokumenta.

2. - tako da otvorite svoj tekst editor (npr. Notepad) i pomoću opcije
"File" -> "Open" ... pronađete i otvorite .html dokument koji želite.

Pokušajte to odmah na ovom dokumentu. Kada vam uspije, nemojte ništa mijenjati da ne uništite ovaj dokument, već zatvorite Notepad.
Neka vas ne zbune nerazumljivi kodovi - to je taj HTML kod - koji će vam uskoro postati jasan...

KAKO VIDJETI IZMJENE KOJE SMO NAPRAVILI U IZVORNOM KODU HTML-a

Nakon što ste u svom tekst editoru (npr. Notepadu) napravili izmjene .html dokumenta, potrebno ih je spremiti pomoću opcije "File" -> "Save"
Zatim prijeđite na svoj browser u kojem je učitan taj isti .html dokument i kliknite na dugme "Refresh".

Ako ste dobro postupili, vidjet ćete izmjene koje ste napravili.
Ako izmjene ne vidite, možda ste pogriješili prilikom pisanja izvornog koda.
Vodite računa da HTML, ako naiđe na pogrešnu naredbu u izvornom kodu, ne daje poruku o pogreški već je jednostavno ignorira!

HTML - Hypertext Markup Language

HTML je jezik kojim je moguće formatirati izgled www stranice, koristi se od 1990. godine. Svaka www stranica koju poslužitelj šalje pretraživaču nije čisti tekst već sadrži niz informacija u skladu s HTML jezikom koje govore pretraživaču kako dokument treba prikazati. HTML predstavlja dogovor o zajedničkom jeziku između autora stranica i pretraživača - komunikacija i razmjena informacija je moguća isključivo ako obje strane govore isti jezik.

HTML ne valja doživjeti kao neku mističnu stvar koja je rezervirana samo za računalne stručnjake krvavih očiju i sa srčanom aritmijom od prevelikih količina kave koja ih drži budnima kroz noć. Naprotiv, HTML je razmjerno jednostavan jezik koji je moguće savladati uz vrlo malo truda. Tim više, nakon što se savlada osnovna averzija i probije početna barijera, izrada HTML (odnosno www) stranica može postati užitak. HTML jezik daje nam osnovni skup kodova koje možemo kombinirati na razne načine poštujući neka osnovna pravila. Za izradu stranica potrebna je samo još dovoljno mašte da se osnovni kodovi povežu na različite načine te kao rezultat može proizići www stranica visoke kvalitete.

Na Internetu povezano je vrlo mnogo različitih računala koja koriste različite unutarnje jezike za prikaz podataka. Također, www stranice moraju moći čitati osim računala i ljudi. Stoga je HTML jezik tekstualan. Kodovi HTML jezika su zapravo riječi (često skraćenice engleskog jezika) koje je moguće kombinirati na razne načine.

OSNOVNA STRUKTURA HTML DOKUMENTA:

Dakle, svojim HTML dokumentima uvijek dodijelite extenziju .html (na primjer: proba1.html ili proba1.htm).

Nadalje, kada u tekst editoru počnete pisati svoj HTML dokument, morate poštovati određena pravila.

Kao prvo, sve HTML naredbe moraju se nalaziti unutar oznaka < ... >
Sve što se napiše unutar tih oznaka neće biti vidljivo u browseru već će biti tretirano kao naredba HTML-a.
Sve što se nalazi izvan tih oznaka (npr: ovo je tekst koji će se vidjeti podebljano) bit će vidljivo u browseru.

Većina naredbi ima oznaku za svoj početak i oznaku za svoj kraj. Oznaka za kraj je uvijek znak "/".
Na primjer: je oznaka za početak ukošenih slova a je oznaka za kraj ukošenih slova.
Stoga, sve što upište između te dvije naredbe bit će u browseru vidljivo kao ukošeni ispis...

Naredbe možete i kombinirati. Na primjer:
ovo će biti ispisano i podebljano i ukošeno
... s tim da oznake za kraj stavljate obrnutim redom u odnosu na redoslijed otvaranja.

Kao drugo, svaki HTML dokument mora imati određenu strukturu:
- oznaku početka <HTML> i oznaku kraja </HTML>,
- zaglavlje <HEAD> </HEAD> unutar kojeg upisujemo opće definicije, poput kodne stranice, podatka o autorstvu, opis dokumenta i dr.
- tijelo <BODY> </BODY> unutar kojeg upisujemo sve ono što želimo da se vidi u browseru.

Evo primjera s objašnjenjem (crvenom bojom označene su naredbe HTML-a):

Izvorni kod HTML-a
(vidljiv u Notepadu)

Objašnjenje

Rezultat koji vidimo
u browseru

<HTML>

<HEAD>
<TITLE>Moj prvi HTML</TITLE>
</HEAD>

<BODY>

Prvi red teksta u dokumentu... 
Drugi red teksta u dokumentu...

</BODY>

</HTML>

početak HTML-a

početak zaglavlja
naziv dokumenta
kraj zaglavlja

početak tijela

tekst koji će biti
vidljiv u browseru
 prekida red

kraj tijela

kraj HTML-a

Moj prvi HTML

Prvi red teksta u dokumentu...
Drugi red teksta u dokumentu...

Obzirom da svaki HTML dokument ima istu strukturu (koju vidite u prvoj koloni gornje tablice), izradu novih HTML dokumenata možete si olakšati tako da tu strukturu spremite pod nekim nazivom (npr. blank.htm).
Zatim, kada trebate izraditi novi HTML dokument, prvo u tekst editor učitate taj blank.htm pa ga onda opcijom "File" -> "Save As..." preimenujete u željeno ime i nastavite raditi u njemu. Time izbjegavate stalni upis istih naredbi.

U prilogu ovog dokumenta nalazi se datoteka ds-blank.htm koju možete koristiti u te svrhe!.

I još nešto. Naredbe HTML-a možete pisati i velikim i malim slovima. Tu nema ograničenja. Međutim, bilo bi dobro da ih uvijek pišete velikim slovima kako bi ih lakše razlikovali od ostalog sadržaja.

Primjer koda HTML jezika jedne web stranice

<html>
<head>
<title>Naziv web stranice</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
</head>

Za sve one koji znaju engleski evo dobar HTML VIDEO TUTORIAL