Izrada web stranica

Sta morate znati da biste mogli raditi web stranice?

Podjelit cemo tehnologije na osnovne i dodatne.

Osnovne:

• HTML
• CSS
• JavaScript

Dodatne:

• Server side scripting (php, jsp, asp...)
• Flash

HTML

HTML (hyper text markup language) je temelj svake stranice, i bez njega web stranica kao takva ne moze postojati. Svaki web browser koji ucitava neku web stranicu ocekuje da ce naci jednu od "verzija" HTML-a.

Ispocetka, HTML je bio zamisljen osnova svake web stranice, no razvojem je to iskljuceno. Sada sluzi samo kao osnova za "slaganje" elemenata web stranice kao sto su meniji, slike, linkovi, paragrafi, naslovi, tablice i slicno...

Za vizualno uredenje stranica (boje tekstova, boje i slike pozadina, margine, pa cak i za sam raspored HTML elemenata) koristi CSS.

Za savladavanje bilo koje tehnike potrebno je poznavanje ili bar razumjevanje engleskog jezika, jer, na tom jeziku kao svjetskom jeziku razvijene su sve kompjuterske tehnologije, sto se u slucaju HTML-a vidi iz samih takozvanih tagova.

<b> - bold
<br/> - break
<i> - italic
<table> - table
<tr> - table row
<th> - table heading
<td> - table data
<div> - division
i tako dalje...

Znaci, za kreiranje nekakvog HTML-a potrebno je znati koje tagove mozete koristiti i za sto. Posto bi bilo besmisleno objasnjavati sve tagove zasebno, i kako se koriste, preporucam vam kao osnovu W3C tutorial (World Wide Web Consortium) stranice za ucenje sto mozete raditi sa pojedinim tagovima.

Jednog dana kada saznate vise, primjetit cete da od svih tagova i njihovih atributa koristite samo njih 10%, a ostali su vam nepotrebni.

CSS

CSS (Cascading Style Sheets) sluzi za vizualno uredenje vaseg HTML-a. Prije CSS-a, za uredenje HTML-a koristili su se neki tagovi i njihovi atributi, sto se pokazalo jako nezgodnim ako ste htjeli promjeniti vizualni stil na svojim stranicama. Naime, terbali ste na svakoj zasebnoj stranici raditi tu izmjenu.

Sa CSS-om to je proslost!
No, kolkio god je CSS pomogao, tolko vi sada imate vise za uciti i vjezbati. Sto vise, CSS se ne ponasa jednako u svim web browserima jer su neki ljudi koji izraduju web browseri (u tome prednjaci MS Internet Explorer) jednostavno zamislili da se ne trabaju drzati nekih standarda (W3C standarda) i poceli su CSS prikazivati po svome...


Bit CSS-a je da mozete odrediti nekom/svim HTML tagu neku osobinu, ili pak svim elementima istu osobinu.

Ukoliko zelite, na primjer, svim elementima zadati da se prikazuju u fontu Arial, napisat cete
HTML Code:

* {font-family: Arial;}

Ako pak to ne zelite primjeniti na sav tekst, nego samo na "Heading 1" naslove (HTML tag <h1>), koristit cete
HTML Code:

h1 {font-family: Arial;}

Mozda cete imati slucaj da ne zelite na svim "Heading 1" primjeniti taj stil. U tom slucaju napravit cete CSS klasu koju na HTML tagu postavljate s HTML atributom class.
Dakle, HTML kod bi izgledao
HTML Code:

<h1 class="naslov1">

a CSS
HTML Code:

h1.naslov1 {font-family: Arial;}

No opet, mozda zelite da se taj stil odnosi i na specificne "Heading 1" i "bold" (HTML tag <b>)
HTML Code:

h1.naslov1 {font-family: Arial;}

HTML Code:

b.naslov1 {font-family: Arial;}

ili samo
HTML Code:

.naslov1 {font-family: Arial;}

Sa prvim primjerom kazete da se stil odnosi na tagove <h1 class="naslov1"> i <b class="naslov1"> dok sa drugim primjerom kazete da se stil odnosi na sve HTML tagove koji su specificirani s class="naslov1"

U CSS-u postoji takozvano pravilo nasljedivanja, sto jos vise olaksava posao.
Na primjer, zelimo da su nam svi h1 tagovi u fontu Arial, ali vazne h1 (koji, recimo imaju klasu class="vazno") zelimo prikazati u crvenoj boji:
HTML Code:

h1 {font-family: Arial;}
h1.vazno {color:red;}

Ovdje vam je objasnjen samo osnovni pristup CSS-u.

Za osnovni tutorijal vam opet preporucam W3C CCS tutorial http://www.w3schools.com/css/default.asp

dok za napredni imate doslovno tisuce kvalitetnih stranica iz kojih izdvajam

http://www.w3.org/Style/Examples/011/firstcss

http://www.echoecho.com/css.htm

http://www.tizag.com/cssT/

Posto je velik dio web developera krenuo raditi na laksi nacin, cemu su uvelike pridonjeli i dizajneri, te su za layout stranica poceli koristiti tablice koje su prvobitno bile namjenjene iskljucivo za tablisne prikaze, nakon sto savladate osnove HTML-a i CSS-a preporucujem vam da iskorijenite tu losu naviku i da pocnete raditi ispravan HTML na nacin kako je zamisljeno da on bude raden: HTML bez tablica


JavaScript

Nakon nekog vremena ljudi su shvatili da na webu ne zele imati samo neke staticne stranice koje bi im zamjenjivale neku vrstu novina, nego da zele imati i neku interakciju.

Tu je nastupio JavaScript.

JavaScript je doslovno programiranje sto ce se desiti u web browseru nakon sto posjetitelj napravi neku akciju, ili nakon sto se nesto desi (ucita stranica, ugasi prozor i sl.)
Posto se JavaScript "desava" iskljucivo na kompjuteru posjetitelja web stranice, radi sigurnosti posjetitelja, njegove su mogucnosti ogranicene, ali opet dovoljno velike da stranice naprave korisnim i atraktivnim.

http://www.w3schools.com/js/


Server side scripting

Za razliku od JavaScripta, kao sto i samo ime kaze, ovi jezici se izvrsavaju na serveru gdje je hostana web stranica, a ne na kompjuteru posjetitelja.

Vise o jezicima na:
http://www.php.net/
http://java.sun.com/products/jsp/
http://www.asp.net/

Flash

Flash je bio program za izradu animacija koje se koriste na web stranicama, no uz actionscript, koji je jako slican JavaScript-u, je postao i vise od toga.
Neki ljudi u njemu rade citave web stranice, neki aplikacije, neki igrice, neki za multimediju, no ja ga preporucam samo za animacije i multimediju, te eventualno igrice koje ce se moci igrati na web stranici.
Flash je jedna kompleksna stvar vrlo velikih mogucnosti, no, kao i svaka od nabrojenih tehnika, nauka za sebe.