Gift of the US Government UNITED STATES EMBASSY
Bosnia and Herzegovina

1. Korak po korak do vaše prve web stranice

Pripremite jedan web pretraživač (npr. Google Chrome ili Firefox) i jedan tekstualni editor (npr. Sublime Text, Notepad, Notepad ++ ili neki drugi)

Napravite novi folder i dajte mu naziv npr. MojSajt. Unutar njega snimaćete sve fajlove koji će biti dio vašeg novog sajta.

Sada ćete da kreirate vašu prvu web stranicu. Unutar praznog foldera MojSajt kliknite desnim tasterom miša i odaberite iz padajućeg menija opciju New > Text Document.

Dobijeni fajl preimenujte u index, a ekstenziju .txt zamijenite sa .html

Kliknite desnim tasterom miša na ovaj fajl i onda odaberite željeni tekstualni editor.

Prije kucanja HTML koda bitno je da znate sljedeće. Svaka web stranica počinje i završava se HTML tagom  (otvorenim <html> na početku i zatvorenim </html> na kraju), i svaka od njih ima dva osnovna dijela head i body, koji se označavaju, takođe, otvorenim (<head>, <body>) i zatvorenim HTML tagom (</head>, </body>).

U okviru head-a se nalaze informacije o dokumentu, i ovaj dio nije vidljiv u web browser-u. Ovaj dio opisuje dokument i način na koji on treba da bude predstavljen. U njemu možemo definisati jezik na kome je pisana web stranica, ključne riječi, autora dokumenta i sl. U okviru njega se nalazi, između ostalog, i title tag koji sadrži naslov dokumenta, a koji je vidljiv na kartici otvorene web stranice (Title Bar).

Tekst, slike, linkovi, liste i drugi elementi nalaze se u tijelu dokumenta, odn. između otvorenog i zatvorenog body taga (<body>…</body>), i ovaj dio je vidljiv u web pretraživaču.

Na slici (prezentacija je u prilogu) je HTML kod iskucan u Notepad ++. <!DOCTYPE html> kazuje pretraživaču da se radi o HTML dokumentu. Svaku promjenu u kodu potrebno je snimiti (Ctrl+S) prije provjere rezultata u pretraživaču. A da bi se rezultat prikazao u pretraživaču, potrebno je da osvježite stranicu pretraživača (Ctrl+R).

Lijevim dvoklikom na fajl index.html otvoriće se vaša veb stranica u odabranom web pretraživaču. Ona je još uvijek prazna.

Već smo pomenuli da se između otvorenog i zatvorenog title taga piše naslov dokumenta, i da je on vidljiv na kartici otvorene web stranice (Title Bar).

Sve ono što želimo da bude prikazano na ekranu kao sadržaj naše stranice, pisaćemo između otvorenog i zatvorenog body taga.

Bitno je da sve naslove pišete u okviru h (header) tagova, a ostatak teksta između p (paragraph) tagova. Pogledajte sliku na sljedećem slajdu i vidjećete kako to izgleda u Notepad ++.

Primijetićete da naslovi nisu iste veličine. Vratite se na sliku koda u Notepad ++ i vidjećete da h tagovi sadrže različite brojeve. Tačnije, vi možete odabrati neki broj od 1 do 6, u zavisnosti od toga koju veličinu naslova želite. Naslov je najveći ako koristimo 1, a najmanji ako stavimo broj 6.

Sada možete sami da otpočnete kreiranje svoje prve web stranice. Čestitamo! 🙂1. Korak po korak do tvoje prve web stranice

CERK
BRAVO studio
Teleklik
InfoArs
ICBL