Oblikovanje mrežnih stranica

 

Naziv kolegija:
Oblikovanje mrežnih stranica
Šifra ISVU:
229625
Šifra MOZVAG:
IZZ305
ECTS:
5
Jezik izvođenja:
hrvatski
Preduvjeti upisa:
Odsjek:
ODSJEK ZA INFORMACIJSKE ZNANOSTI

Studij
Godina
Semestar
Status
INFORMATOLOGIJA - PRIJEDIPLOMSKI (jednopredmetni studij)
2.g.
zimski
obavezan

Nastavnik
Nositelj
P
V
S
Jakopec, Tomislav
15
30
0

 

Ciljevi i zadaci:

Ciljevi su kolegija upoznati studente s temeljnim tehnologijama koje se koriste prilikom oblikovanje mrežnih stranica. Prateći važeće standarde, studenti realiziraju valjane mrežne stranice koristeći označiteljski jezik, oblikuju ih prema stilskim odrednicama koristeći stilski jezik te ih obogaćuju dinamičnošću koristeći skriptni jezik na klijent strani. Studenti kreiraju mrežna mjesta koja su prilagodljiva različitim uređajima na kojima će se reproducirati.

Ishodi učenja:

Nakon uspješno završenoga predmeta studenti će moći:

  • povezati pojmovlje i nazivlje koristeći tehnologije za oblikovanje sadržaja na mreži
  • kreirati valjane mrežne stranice prema važećim standardima (HTML)
  • oblikovati kreirane mrežne stranice prema pravilima dobre prakse prilikom dizajniranja mrežnih stranica (CSS)
  • omogućiti dinamičnost mrežnih stranica na strani klijenta (JS)
  • kreirati mrežna mjesta prilagodljiva različitim širinama zaslona uređaja na kojima se prikazuje

Sadržaj predmeta:

Sadržaji predavanja:

  • upoznavanje s kolegijem, literaturom, načinom rada, ocjenjivanja i vrednovanja
  • Povijest HTML-a, CSS-a, JS.
  • Razdvajanje prezentacije od sadržaja
  • Grupe HTML elemenata
  • Grupe CSS svojstava
  • Stranice prilagodljive različitim širinama zaslona
  • Javascript skriptni programski jezik
  • Radne okoline za JS
  • Asinkroni način rada

 

Sadržaji vježbi:

  • postavljanje osnovne infrastrukture za rad, kreiranje standardne i valjane HTML datoteke
  • Sintaksa HTML-a i CSS-a, HTML Elementi: Osnovni, Metapodaci, Odjeljivanje sadržaja, Tekstualni; CSS svojstva: Boja, Pozadina i granica, Osnovni i fleksibilni model okvira, Tekst i oblikovanje teksta, fontovi
  • HTML Elementi: Definiranje semantike teksta; CSS svojstva: Orijentacija pisanja, Liste i brojači, Animacija
  • HTML Elementi: Ugrađeni sadržaj, Skripte, Praćenje promjena na tekstu, Tablice, Slike i multimedija; CSS svojstva: Tablice, Transformacije, Tranzicije, Osnovna svojstva korisničkog sučelja, Stupičasti predlošci
  • HTML Elementi: Obrasci (Forms), Interaktivni elementi (Interactive elements); CSS svojstva (4/4), Medij stranice (Paged Media), Generirani sadržaj za medij stranice (Generated Content for Paged Media), Vrijednosti slike i zamjenski sadržaj (Image Values and Replaced Content), Maske (Masking Properties), Razne Animacije (Marquee Properties)
  • Elementi mrežnog mjesta: Specijalni znakovi, hrvatski dijakritički znakovi na mreži, Metapodaci, Datoteke i struktura direktorija, Relativna naspram apsolutne adrese
  • "Javascript: Osnove, DOM (Document Object Model), Skrivanje/Prikazivanje sadržaja na stranici, Dodavanje/Oduzimanje elemenata DOM-a
  • Responsive web design frameworks
  • Javascript frameworks
  • jQuery sintaksa, događaji, efekti
  • Tehnologije za generiranje sadržaja na poslužitelju
  • AJAX način rada

 

 

Očekuje se da studenti kroz sadržaj predmeta usvoje sljedeća znanja, kompetencije i vještine:

  • za dani vizualni predložak odabrati prikladan skup HTML oznaka te ih primijeniti uz oblikovanje koristeći CSS svojstva
  • definiranu dinamiku stranice realizirati koristeći skriptni jezik ili radnu okolinu skriptnog jezika
  • prilagoditi sadržaj različitim širinama zaslona na kojima se prikazuje

Vrste izvođenja nastave:

predavanja, vježbe, samostalni zadatci

Povezivanje ishoda učenja, nastavnih metoda i procjena ishoda učenja:

2. 1. Nastavna aktivnost 2. 2. Aktivnost studenta 2. 3. Ishod učenja 2. 4 Metoda procjene
Predavanja slušanje predavanja i sudjelovanje u raspravama  
vladati napredno stručnom terminologijom i nazivljem koristeći tehnologije za oblikovanje sadržaja na mreži;
2 kolokvija ukupno 52 % ukupne ocjene (predavanja 20 %)
 
Samostalni zadatci
rješavanje samostalnih zadataka
 
  • kreirati valjane mrežne stranice prema važećim standardima (HTML)
  • oblikovati kreirane mrežne stranice prema pravilima dobre prakse prilikom dizajniranja mrežnih stranica (CSS)
  • omogućiti dinamičnost mrežnih stranica na strani klijenta (JS)
  • samostalno kreirati mrežna mjesta prilagodljiva različitim širinama zaslona uređaja na kojima se prikazuje
Domaća zadaća (23% ukupne ocjene)
 
 
 
 
Vježbe
 
rješavanje kratkih kvizova
 
  • kreirati valjane mrežne stranice prema važećim standardima (HTML)
  • oblikovati kreirane mrežne stranice prema pravilima dobre prakse prilikom dizajniranja mrežnih stranica (CSS)
  • omogućiti dinamičnost mrežnih stranica na strani klijenta (JS)
  • samostalno kreirati mrežna mjesta prilagodljiva različitim širinama zaslona uređaja na kojima se prikazuje
 
aktivnost u nastavi (25% ukupne ocjene)
 
 
Vježbe
 
Pisanje kolokvija
  • kreirati valjane mrežne stranice prema važećim standardima (HTML)
  • oblikovati kreirane mrežne stranice prema pravilima dobre prakse prilikom dizajniranja mrežnih stranica (CSS)
  • omogućiti dinamičnost mrežnih stranica na strani klijenta (JS)
  • samostalno kreirati mrežna mjesta prilagodljiva različitim širinama zaslona uređaja na kojima se prikazuje
2 kolokvija ukupno 52 % ukupne ocjene (vježbe 80 %)

 

 

Obveze i praćenje rada studenta:

Kontinuirana provjera znanja, Pisani ispit, Pohađanje nastave, Praktični rad, Zadaće

Način vrednovanja i ocjenjivanja:

pismeno

Elementi praćenja i provjeravanja:

Element
Opterećenje u ECTS
Udio u ocjeni
Kontinuirana provjera znanja 1 0%
Pisani ispit 2 0%
Pohađanje nastave 1,125 0%
Praktični rad 0,875 0%
Zadaće 1 18%

 

Način oblikovanja konačne ocjene:

Rad studenta na predmetu vrednovat će se i ocjenjivati tijekom nastave, kroz dva kolokvija i samostalne domaće zadaće. Samostalne domaće zadaće donose 23 % bodova, položeni kolokviji 52 % bodova (od čega 20% s predavanja i 80 % s vježbi), a kontinuirana provjera znanja  25 % bodova.

Primjer izračunavanja ocjene:

Ostale informacije relevantne za praćenje i vrednovanje studenta:

 

 

Obavezna literatura:

  1. Jakopec T.: Predavanja i vježbe
  2. K.Jamsa, K.King, A.Anderson : HTML i Web dizajn: kroz praktične primjere, Mikro knjiga, 2003.
  3. B. Pfaffenberger, S. M. Schafer, C. White, B. Karow: HTML, XHTML, and CSS Bible, 3. izdanje

Dopunska literatura:

  1. E. Castro: HTML za WWW i XHTML
  2. D. HAYES: VODIČ KROZ HTML I XHTML

 

Mrežna mjesta

https://www.w3.org/wiki/HTML/Elements

https://developer.mozilla.org/en-US/docs/Web/HTML/Element

https://developer.mozilla.org/en-US/docs/Web/CSS/Reference

http://validator.w3.org/

http://jigsaw.w3.org/css-validator/

 

 

Načini praćenja kvalitete koji osiguravaju razvoj znanja, vještina i kompetencija:

  • Provedba jedinstvene sveučilišne ankete među studentima za ocjenjivanje nastavnika koju utvrđuje Senat Sveučilišta.
  • Praćenje i analiza kvalitete izvedbe nastave u skladu s Pravilnikom o studiranju i Pravilnikom o unaprjeđivanju i osiguranju kvalitete obrazovanja Sveučilišta.

Ostale informacije: