HrvatskiHrvatski
HrvatskiHrvatski
EnglishEnglish
HrvatskiHrvatski
HrvatskiHrvatski
EnglishEnglish

UVOD U (X)HTML, JAVASCRIPT I CSS

Cilj

Temeljni cilj kolegija je osposobiti studente za samostalnu izradu web stranica koristeći sve tri temeljne front-end tehnologije: Html, CSS i Javascript. Studenti će naučiti sintaksu navedenih tehnologija i biti sposobni napisati i uređivati vlastiti kod stranice. Studenti će biti osposobljeni koristiti editore koda za uređivanje i testiranje stranica.
Primjenjujući poslijednje standarde studenti će biti sposobni izraditi statičke web stranice prilagodljive korisničkom računalu, uključiti na stranicu različite multimedijalne sadržaje, izraditi i isprogramirati obrasce na web stranici te objaviti web stranicu na web poslužitelju.

Uvjeti upisa

Nema.

Ishodi učenja

  • Konstruirati semantički ispravan html kod stranice.
  • Razviti elemente stranice CSS-om.
  • Kreirati programski kod Javascriptom služeći se ugrađenim objektima i metodama jednostavnije interakcije s korisnikom na stranici.
  • Kreirati statičku stranicu prilagodljivu korisničkom uređaju služeći se HTMLom, CSSom i Javascriptom.
  • Primijeniti jQuery i Bootstrap biblioteke.
  • Preurediti datoteke za objavljivanje na web poslužitelju.

Nastavni plan

  1. HTML5 - osnove sintakse
  2. Razumjeti način funkcioniranja web stranice unutar web preglednika.
  3. Definirati osnovne HTML elemente za strukturu stranice.
  4. Definirati osnovne elemente za ubacivanje sadržaja na stranici: elemente za rad s tekstom, poveznice, liste, tablice, div oznake.
  5. HTML5 - rad s obrascima
  6. Objasniti ulogu obrazaca na web stranici.
  7. Kombinirati različite elemente obrazaca za zadanu funkcionalnost obrasca.
  8. Ispravno označiti elemente obrasca.
  9. Uključivanje multimedijskih elemenata na web stranicu
  10. Uključiti na strancu različite vrste slikovnih datoteka.
  11. Uključiti video i zvučni zapis na stranicu.
  12. CSS - osnove sintakse i načini spremanja
  13. Razumjeti osnovnu sintaksu CSSa: element, svojstvo i vrijednost.
  14. Razumjeti sintaksu te primjenu css klasa, redefiniranja html elementa te složene stilove.
  15. Primijeniti oblikovanje na zadani element web stranice.
  16. Objasniti princip nasljeđivanja kod definiranja stilova.
  17. Spremiti stilove u zaglavlje i u zasebnu datoteku.
  18. CSS - oblikovanje blok elemenata
  19. Usvojiti svojstva i vrijednosti primjenjive na blok elemente stranice.
  20. Oblikovati boje i rubove blok elemenata.
  21. Ostvariti raspored elemenata na web stranici pomoću CSSa
  22. CSS - oblikovanje linijskih elemenata
  23. Usvojiti svojstva i vrijednosti primjenjive na linijske elemente web stranice.
  24. Koristiti svojstvo display za promjenu osnovnih svojstava html elementa.
  25. CSS efekti
  26. Koristiti korisničke fontove za izradu elemenata stranice.
  27. Primijeniti efekt sjene na blok elemente i na tekst.
  28. Koristiti gradijente za bojanje elemenata web stranice.
  29. Javascript - osnove sintakse
  30. Uključiti javascript kod na web stranicu.
  31. Uključiti javascript kod u zasebnu datoteku i povezati je s web stranicom.
  32. Javasript - najčešće korištena svojstva
  33. Primijeniti adresiranje elemanata web stranice za jednostavnu promjenu svojstva zadanog elementa stranice.
  34. Promijeniti tekst, boju ili položaj zadanog elementa web straniceputem javascripta.
  35. Javasript metode
  36. Objasniti događaje na web stranici i sintaksu za za njihovu primjenu u javascriptu.
  37. Koristiti ugrađene metode za otvaranje novih prozora.
  38. Koristiti ugrađene metode za provjeru ispravnosti obrazaca.
  39. Koristiti ugrađene metode za skrivanje i pokazivanje elemenata stranice te za onemogućavanje interakcije korisnika s pojedinim elementima.
  40. 11.Javascript funkcije
  41. Objasniti važnost korištenja funkcija prilikom pisanja javascript koda.
  42. Napisati vlastitu funkciju.
  43. Pozvati i primijeniti vlastitu funkciju na stranici.
  44. jQuery biblioteka za Javascript
  45. Objasniti problematiku adresiranja elemenata u javascriptu i prednosti uporabe jQuery biblioteke.
  46. Uključiti jQuery biblioteku na vlastitu stranicu s vlastitog poslužitelja i sa repozitorija na webu.
  47. Napisati jednostavan javascript kod koristeći jQuery.
  48. Izrada web stranica prilagodljivih korisničkom računalu
  49. Objasniti potrebu za dizajnom web stranice koji je prilagođen različitim korisničkim uređajima i medijima.
  50. Usvojiti osnovne postupke za kreiranje univerzalnih stranica prilagođenih za različite uređaje.
  51. Kreirati stilove za ispis stranice na pisaču.
  52. Korištenje Bootstrap biblioteke za efikasniju izradu prilagodljivih web stranica
  53. Objasniti potrebu za brzim razvojem stranica temeljenim na modelu stupaca.
  54. Objasniti korist od primjene Bootstrap modela.
  55. Uključiti Bootstrap biblioteke u vlastitu stranicu.
  56. Koristiti css stilove Bootstrap modela za dizajniranje stranice razmještaj elemenata stranice.
  57. Objavljivanje web stranica (2h)
  58. Objasniti postupak pribavljanja domene i zakupa prostora na web poslužitelju.
  59. Koristiti se ftp kljentom za postavljanje datoteka na poslužitelj.
  60. Prijaviti web stranicu na najvažnije tražilice.