1. Uvod u xhtml i html

2. Što je html? • HTML = HyperTextMarkupLanguage • Razvila ga ranih 1990.-ih znanstvena zajednica kako bi služio za razmjenu znanstvenih radova • Tijekom vremena postao manje znanstveni medij, a više popularan • Tržište je samo počelo dodavati nove funkcionalnosti - kaos

3. Što je html? • Vrsta opisnog jezika kojim se prikazuje izgled i sadržaj web-stranice • HTML 4 – standard, ali još uvijek kaotičan • Nedostatak: potrebna veća količina procesorske snage da se HTML prikaže kao konzistentna cjelina

4. xhtml • = eXtensibleHyperTextMarkupLanguage • „HTML sa strožim pravilima” • Stroža pravila pisanja bolja za računala – brže prikazivanje stranica

5. Zašto xhtml, a ne html? • Stroža pravila – manje varijacija – stranice se ponašaju isto na različitim platformama i uređajima

6. Verzije • HTML 4.01 – najnovija (1999.) • XHTML 1.0 – baziran na HTML 4.01, u širokoj upotrebi • XHTML 1.1 – vrlo stroga verzija, ovisi o CSS-u za izgled, rijedak • HTML 5 – nedovršen, mnogo novih funkcionalnosti

7. OSNOVNI POJMOVI

8. Opisna oznaka (eng. tag) • Najčešće se sastoji od: • Početne oznake (tag-a) • Sadržaja • Završnog oznake (tag-a) • primjer: • <title> Ovo je naslov </title> Sadržaj Element Početni tag Završni tag

9. Opisna oznaka (eng. tag) • Jedna opisna oznaka kao sadržaj može sadržavati druge elemente • <body> • <p> Ovo je paragraf </p> • </body> Početni tag Sadržaj Završni tag

10. Opisna oznaka (eng. tag) • Opisne oznake koje imaju sadržaj još se zovu containertags(spremnici) • Postoje i oznake koje nemaju sadržaj: • Pr. horizontalline: <hr /> • Napomena: moguće napisati i : <hr></hr>, ali standardno se koristi kraći oblik

11. Struktura <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Conforming XHTML 1.0 Transitional Template</title> </head> <body> </body> </html> Verzija i tip dokumenta „tijelo” dokumenta, sadrži sve elemente koje vidimo u pregledniku <head> oznaka, sve tehničke stvari Oznaka početka i kraja XHTML dokumenta

12. Tekstualne oznake

13. Odlomci (paragrafi) • <p> Ovo je odlomak </p> • Unutar <body> oznake • Isto kao i u Wordu

14. Poravnanje odlomaka <p align=„center”> Ovo je odlomak, koji je centriran!!! </p> Svi atributi se pišu u početnoj oznaci u formatu: ime_atributa=„neka_vrijednost” NAPOMENA: vrijednost se mora staviti u navodnike Atribut opisne oznake, dodatno opisuje što uraditi sa sadržajem

15. Poravnanje odlomaka • Ostale moguće vrijednosti atributa su: • right • left – podrazumijevan, i ne mora se navoditi • justify(hrv. obostrano) • Npr. <p align=„justify”> Obostrano poravnan odlomak! </p>

16. Whitespace • Razlika u prikazu: <p> Ovo je paragraf </p> <p> Ovo je paragraf </p> • NE postoji

17. Whitespace • Za kraj retka koristi se oznaka <br /> (eng. break) • Za dodatne razmake koristi se specijalni kod za znakove: &nbsp; (eng. non-breakingspace)

18. Korisni linkovi • XHTML predložak: http://www.webstandards.org/learn/reference/templates/xhtml10t/ • Notepad++ (dobar tekst editor): http://notepad-plus-plus.org/ • Dobar xhtml i csstutorial: http://htmldog.com/