Projektovanje – životni ciklus web site-a

1. Projektovanje – životni ciklus web site-a

2. Principi projektovanja web site-a • Web site - lokacija se sastoji od jedne ili više web strana • Web strana je organizovani skup tekstualnih, grafičkih, multimedijalnih i svih drugih? elemenata koji kao celina ali i pojedinačno doprinose ukupnom izgledu – utisku o web strani, ali i čitavoj web lokaciji • Mnogo važnija od toga je informativna komponenta web strane i čitavog site-a • Informativna komponenta je suština postojanja web site-a

3. Faze projektovanja – životnog ciklusamodel vodopada

4. Napredniji – savremeniji pogled na projektovanje u širem smislu model fontane

5. Analiza • Zbog čega se pravi web site? • Kakvu poruku treba da prenosi web site? • Koji – kakav realni sistem se podržava web site-om? (institucija najčešće, ali može biti bilo šta drugo – promocija ideje, istraživanja, site grada, e-learning, itd.) • Web site treba da na neki način reprezentuje strukturu realnog sistema koji podržava. • Model sistema kakav treba da vide korisnici • Web site danas bi trebalo da bude remote user interface ka informacionom sistemu

6. Ko učestvuje u analizi? • Naručioci web site-a • Sistem analitičari (u teoriji) • Stručnjaci za izradu web site-a (u praksi) • Web dizajneri • Programeri • Bilo bi dobro uključiti i korisnike

7. Design – projektovanje u užem smislu • Analiza uključuje opšta razmatranja • Analizom se jasno definiše problem, šta se hoće, tj. pravi se model • Model ne omogućava implementaciju • Potrebna je još jedna faza – projektovanje • Smisao projektovanja je u prilagođavanju idejnog rešenja implementaciji – kodiranju • Razlikovati design kao fazu projektovanja od uređenja vizuelno – grafičkog izgleda web strane

8. Dobar – uspešan web site • Kao i drugi informatički projekti, i web site može biti uspešan – dugovečan • Aktuelnost u dužem vremenskom periodu • Održavanje – ažuriranje u dužem vremenskom periodu • Lako održavanje = dobra početna struktura • Dobra početna struktura = dobro projektovanje • Lako održavanje se uglavnom svodi na ažuriranje i po potrebi dodavanje novih elemenata na postojeću strukturu

9. Alternativa planskom pristupu – ad hoc • Često se faze analize i projektovanja koje prethode implementaciji web site-a zanemaruju • Web site se ne smatra ozbiljnom aplikacijom (to rade klinci...) • Ad hoc – prema prilici, trenutno, kratkoročno, bez planiranja • Tako se najbrže dolazi do početnih rezultata • Nažalost, na ovaj način se najčešće i ostaje samo na početnim rezultatima • Lakše je od početka praviti novu dobru strukturu, nego popravljati staru lošu

10. Koncepcije web strana • Web site-ovi i web strane mogu da imaju veoma različite koncepcije • Kreiranje web strana je upravo to, kreativan postupak • Kaže se da za kreaciju ne postoje pravila, obrasci i šabloni • Ako se uzme da je postojeći broj web strana ogroman – stotine miliona ili milijarde (IPv4 će se zameniti sa IPv6) teško je biti originalan • Ipak se formirala neka vrsta šablona, makar u vidu nekih opštih pravila

11. Sličnosti i razlike web strane i ppt prezentacije • Jasna preglednost bez suvišnih detalja • Prepoznatljiv vizuelni stil koji se ne menja od strane do strane već je zajednički za više strana ili za ceo site • Osnovna razlika je u navigaciji – ppt prezentacija je skoro isključivo namenjena linearnom prikazu strana, dok web site site ima daleko veće mogućnosti slobodne navigacije • Dužina web strane nije limitirana

12. Neka jednostavna pravila • Naručilac i kreator web strane nisu korisnici • Korisnici uglavnom nisu dizajneri i programeri • Testiranje web lokacije je primanje sugestija od strane zainteresovanih korisnika • Savremeni urbanisti asfaltiraju staze tamo kuda ljudi najčešće prolaze • Razvoj web site-a je iterativan, pri čemu treba uzeti u obzir mišljenja i utiske korisnika – feedback (povratna sprega) • Analizirati postojeća uspešna rešenja

13. Struktura web site-a • Struktura web site-a određuje raspored i povezanost web strana od kojih se web site sastoji • Fizička lokacija web strana (web server, web adresa) nije od presudnog značaja • Struktura povezanih web strana može biti jednostavna, ali i veoma složena što zavisi od strukture sadržaja koji se prezentuju • Web site može biti uspešan sa bilo kojom strukturom, pod uslovom da je ta struktura i odgovarajuća nameni web site-a

14. Web piramida

15. Statički, interaktivni i dinamički web site-ovi • Svi web site-ovi su interaktivni u određenom smislu • Statički web site-ovi omogućavaju slobodan izbor sadržaja i redosled kojim se pregledaju • Interaktivni web site-ovi omogućavaju neku razmenu podataka sa site-om • Dinamički site-ovi su specijalan slučaj interaktivnih site-ova sa daleko većim mogućnostima interakcije sa korisnicima

16. Personalizovane strane • Kod dinamičkih web site-ova moguće je kreirati personalizovane web strane koje korisnici mogu da menjaju i uređuju u okviru predviđenih mogućnosti. • Današnje web lokacije omogućavaju i čuvanje ličnih podataka korisnika u raznim oblicima – dokumenti - tekstovi, tabele, prezentacije, slike, kao i fajlova bilo koje vrste.

17. Logička i fizička struktura • Struktura web site-a se može razmatrati sa dva aspekta – logičkog i fizičkog • Logička struktura web site-a odražava strukturu sa aspekta korisnika web site-a • Fizička struktura je određena fizičkim razmeštajem stranica na web site-u, kao i korišćenim hardverom i softverom. • Poželjno je da stvarna fizička struktura web site-a bude nedostupna korisniku, jer se može zloupotrebiti i ugroziti bezbednost web site-a

18. Vrste web site-ova sa aspekta dinamike

19. Zahtev - odgovor

22. Logička struktura web site-a Postoje 4 osnovne logičke strukture web site-a: • Linearna struktura • Rešetkasta struktura • Hijerarhijska struktura • Mrežasta struktura Svaka od ovih struktura ima svoje podvarijante, a takođe se osnovne strukture sa podvarijantama mogu proizvoljno kombinovati da se dobije struktura koja odgovara nameni web site-a

23. Osnovna linearna struktura • Nametnut sekvencijalni redosled pregleda • Moguća navigacija napred – nazad • Sličnost sa ppt prezentacijom • Primenjuje se kada su ograničenja linearne strukture baš ono što se želi

24. Ova modifikacija čiste linearne strukture omogućava simulaciju interaktivnosti • Korisnik može da na različite načine prođe kroz ponuđeni sadržaj birajući ponuđene alternative • Izbor alternativa može da se nudi kroz odgovore na pitanja tipa DA/NE ili kroz višestruki izbor, u kom slučaju ima više od samo dve alternative

25. Osnovna linearna struktura dopunjena sa mogućnošću preskakanja redosleda, ali samo u osnovnom smeru • Izbor preskakanja se može povezati sa pitanjima i biranjem ponuđenih odgovora • Ovakva struktura slično kao i sa alternativama može da doprinese stvaranju utiska interaktivne ili dinamičke web lokacije.

26. Kontrolisano skretanje sa vraćanjem • Korisno za digresije koje objašnjavaju glavnu nit • Dodatna objašnjenja koja se mogu odabrati ili preskočiti ako nisu potrebna • Puno skretanja ovu linearnu modifikaciju pretvaraju u neke druge – stablo, hijerarhiju

27. Može se posmatrati kao dvojna – dvodimenziona struktura koja prirodno opisuje neki prostor • Koristi se za predstavljanje grupa srodnih stavki po dva različita kriterijuma • Korisnik ne može da se izgubi na lokaciji

28. Hijerarhijska struktura • Veoma čest oblik strukture koji se prirodno nameće kod predstavljanja složenih sistema • Omogućava istovremeno jasno i detaljno predstavljanje složenog sistema • Na višim nivoima preovlađuje jasan prikaz zbog manjeg broja detalja • Na nižim nivoima postupno preovlađuje detaljni prikaz, ali uz ograničenje obima prikaza • Korisnik nikada nije preopterećen detaljima • Biranje detaljnog prikaza po želji

30. Hijerarhijska struktura sa povratnim vezama

31. Stablo je varijanta hijerarhijske strukture Postoji istaknut koren stabla na vrhu bez pretka Svaka druga strana ima jednog pretka i eventualno potomke Koristi se za detaljan prikaz manjeg broja stavki Usko stablo daje prednost dubini u odnosu na širinu

32. Široko stablo – varijanta stabla sa širokom hierarhijom Veliki broj stavki koje se razmatraju Mala dubina – odsustvo detalja Cilj je da se na site-u obuhvati veći broj kompomenata, delova neke celine Pogodno kada se vrši obuhvaran pregled

33. Postoje različite mogućnosti za navigaciju po strukturi stabla • Postupni povratak unazad • Povratak na home stranu – koren stabla • Unakrsni prelazak sa jedne grane na drugu • Izbor najpribližnijeg mogućeg puta

34. Struktura potpune mreže • Naziv potiče od mogućnosti potpune navigacije • Sa bilo koje strane na bilo koju stranu • Broj veza je n*(n-1) • Prihvatljivo za manji broj strana • Najčešća je struktura delimične mreže

35. U praksi je najčešća mešovita struktura sa dominantnom hijerarhijom • Ostale pomenute strukture su ukomponovane u hijerarhijskoj strukturi • Mreža se javlja kao posledica mogućnosti za složenu navigaciju

36. Javlja se na site-ovima sa uvodnim prikazom koji vodi do glavne strane • Dobro je da postoji i mogućnost preskakanja uvodne sekvence koja je interesantna samo prvi put

37. Ovakva struktura omogućava jednostavnu navigaciju

39. Čista mreža karakteriše lokacije sa haotičnom i nerazumljivom strukturom • Previše nesistematskih veza kao i preskakanja zbunjuje korisnike • Korisno je kada postoje povezani dokumenti

40. Subjektivni doživljaj web lokacije • Osim u sasvim jednostavnim slučajevima, korisnici ne zamišljaju strukturu web site-a • Poimanje strukture site-a od strane korisnika nije ni važno, ukoliko je navigacija dobro rešena • Korisnici ne smeju da se “izgube” na site-u • Netrivijalni site-ovi u imaju složenu strukturu • Dobar logički raspored je bitan za lakše snalaženje korisnika kao i za lakše projektovanje, implementaciju i održavanje web site-a

42. Podela site-ova prema navigaciji • Porozna strukura • Poluporozna strukura • Neprobojna struktura

43. Korisnik ima kontrolu direktnog pristupa • Dostupna mašinama za pretraživanje • Teška evidencija korisnika • Težak prikaz opštih informacija o site-u

44. Poluporozna struktura

45. Laka evidencija i praćenje korisnika • Ne otkriva fizičku strukturu site-a • Lak za održavanje • Nedostupan mašinama za pretraživanje

47. Duboke i plitke lokacije • Dubina lokacije – broj horizontalnih nivoa • Širina lokacije – broj linkova na home strani • Duboke lokacije – mali izbor dug put • Plitke lokacije veliki izbor kratak put • Statistika i praksa pokazuju preferiranje plitkih lokacija • Zbog mogućnosti pogrešnog izbora, primenjuju se višestruke veze sa raznih mesta ka značajnim stranama, naročito na home page • Trikovi za prisilno gledanje reklama

48. Klasifikacija prema sadržaju • Komercijalne lokacije – informacije, prodaja, podrška, usluge, e commerce, zapošljavanje, podrška, odnosi sa javnošću, investiranje, zabava • Informativne lokacije • Učenje • Zabavne lokacije • Pretraživanje • Grupe, udruženja • Lične lokacije

49. Izbor strukture za web lokaciju

50. Postupak projektovanja site-a • Logičko i fizičko projektovanje • Na osnovu modela se bira odgovarajuća - najpribližnija logička struktura • Fizička struktura se određuje tek posle detaljne razrade logičke strukture • Na izbor konkretne fizičke strukture - resursi imaju uticaj i očekivane performanse sistema, procenjena frekvencija poseta web site-u, ukupni obim web site-a, eventualno već postojeći sadržaji i slično • Implementaciji se pristupa na osnovu detaljnog fizičkog projekta