WebML

1. WebML Ing. Martin Molhanec, CSc.ČVUT-FEL

2. Co je to WebML? • Web Modeling Language. • Jedná se o metodiku pro návrh webových sídel. • Vytvořena na polytechnice v Miláně. • V současné době komerčně orientovaná.Firma : WebRatio. • Je patentovaná ! Při komerčním použití je nutné platit.

3. Co jsou to metodiky pro návrh webových sídel? • Navazují na klasické metodiky – datové, funkční i objektové. • Navazují na hypermediální metodiky • Vetší důraz na návrh uživatelského rozhraní. • Například HDM (Hypermedia Design Method)

4. Co jsou to metodiky pro návrh webových sídel? • Jejich největším přínosem je analýza v oblasti navigace uživatele po webovém sídle. • Další podobné metodiky • OOHDM (Object Oriented Hypermedia Design Method) • …

5. Struktura metodiky • Strukturální model (Structural Model) • Odvozený model (Derivation Model) • Hypertextový model (Hypertext Model) • Model kompozice (Composition Model) • Navigační model (Navigational Model) • Uživatelský model (Personalization Model) • Prezentační model (Presentational Model)

7. Strukturální model • Jedná se o klasický datový konceptuální model. • Je možné využít libovolný datový model: ERM, UML, ODMG, … • Nicméně autoři WebML preferují UML. • Předpokládají se obvyklé konstrukty: Entita (třída), Atribut, Vztah. • Dále se předpokládá určitá množina typů atributu (number, string, date, …)

8. Strukturální model

9. Strukturální model • Strukturální model je možné zapsat i textovou formou. • Jako základ textové formy (nejen pro tento diagram) byl použit jazyk XML.

10. Odvozený model • Tento model se odvozuje ze strukturálního modelu. • Jedná se vlastně o modelování pohledů na data z hlediska určité webové stránky. • Podobné modely (konstrukty) se zavádějí i v jiných podobných metodikách: RMM, OOHDM. • Pro popis odvození se využívá WebML-OQL (WebML-Object Query Language)

11. Odvozený model • Odvozený model je možné zapsat i textovou formou. • Jako základ textové formy (nejen pro tento diagram) byl použit jazyk XML.

12. Hypertextový model • Je nejdůležitějším modelem celé metodiky. • Modeluje navigaci uživatele po webovém sídle. • Skládá se ze dvou modelů, které se kreslí do téhož diagramu: • Kompoziční model • Navigační model

13. Kompoziční model • Zachycuje z jakým logických elementů se skládá webová stránka. • Metodika definuje celou řadu elementů, které se na webových stránkách vyskytují. • Definuje: • Význam jednotlivých elementů • Grafické znázornění elementu v diagramu

14. Tento prvek slouží pro publikování (zobrazení) jednoho objektu (řádky) dané třídy (entity, tabulky). Například údaje o jednom konkrétním zpěvákovi z databáze zpěváků. Způsob zobrazení může být libovolný, toto není věc hypertextového modelu, ale modelu presentačního. Tento prvek slouží pro publikování několika objektů v rámci jedné stránky. Například přehled zboží z databáze skladu. Způsob zobrazení může být libovolný, toto není věc hypertextového modelu, ale modelu presentačního. Nejčastěji se jedná o prvky typu grid, browser, atp. Index představuje publikování několika objektů entity jako seznamu. Například seznam zboží. Po kliknutí na položku indexu se uskuteční akce navigace, například přechod na stránku s detailními informacemi o vybraném zboží.

15. Varianta Indexu, kdy je každý prvek seznamu spojen se zaklikávacím boxem. Tento prvek obsahuje dále tlačítko pro odeslání. Při odeslání se uskuteční akce navigace na jinou webovou stránku. Při této navigaci se informace o zaškrtnutých prvcích tohoto prvku přenáší jako parametry navigace do další stránky.. Prvek, který umožňuje krokovat (procházet se) mezi objekty dané entity. Obsahuje obvyklé možnosti vpřed a vzad, případně na začátek a na konec. Prvek, který představuje vstupní formulář. Slouží pro zadávání údajů. Po odeslání následuje akce navigace na další stránku. Vložené údaje se přenášejí jako parametry navigace a jsou zpracovány následující stránkou.

16. Navigační model • Modeluje jakým způsobem se uživatel pochybuje po webovém sídle. • Základní konstrukty • Webové stránky • Odkazy mezi stránkami • Kontextové (přenášejí stavovou informaci) • Bezkontextové • Ukážeme si na jednoduchém příkladě! • Webové sídlo věnované italským zpěvákům

17. Ukážeme si postupně!

18. Toto je vlastní diagram!

19. Toto je jednoduché grafické znázornění případných stránek.

20. Stránka zobrazující seznam zpěváků.

21. Stránka zobrazující informace o jednom zpěvákovi a přetáčecí prvek.

22. Odkaz mezi dvěma stránkami.

23. Odkaz v rámci jedné stránky.

24. Složitější příklad. Ukážeme si po jednotlivých částech!

25. Stránka zobrazuje seznam všech zpěváků.

26. Stránka zobrazuje údaje o jednom zpěvákovi.

27. Odkaz mezi dvěma stránkami.

28. Tento prvek zobrazuje stručné údaje o jednom zpěvákovi.

29. Tento element zobrazuje seznam alb jednoho zpěváka.

30. Odkaz v rámci jedné stránky.

31. Stránka, která zobrazuje údaje o jednom albu.

32. Element, který zobrazuje údaje o jednom albu.

33. Element zobrazuje seznam hudebníků.

34. Element zobrazuje seznam skladeb na albu.

35. Element zobrazuje stručná data o zpěvákovi.

36. Odkaz v rámci jedné stránky. Odkaz v rámci jedné stránky. Odkazy v rámci jedné stránky.

37. Jak se Vám to líbilo ? Zdá se Vám notace WebML užitečná?

38. Uživatelský model • Modeluje uživatele, kteří s webovým sídlem pracují. • Modeluje práva uživatelů k jednotlivým informacím, které jsou webovým sídlem poskytovány. • Využívá objektovou modelovací techniku s notací UML.

39. Uživatelský model Objektový model uživatelů systému (webového sídla).

40. Prezentační model • Modeluje vzhled a chování jednotlivých prvků webových stránek nezávisle na výstupním zařízení (HTML 3.2, HTML 4, WAP, … ). • Využívá technologie XSLT. • Pro její využití je nutné vývojové prostředí, které podporuje tento model. • Toto prostředí poskytuje například produkt firmy WebRatio.

43. Development process • Site Designer • Umožňuje vytvořit strukturální, hypertextový a uživatelský model. • Presentational Designer • Umožňuje navrhovat vzhled a polohu prvků na webové stránce. • Site manager • Nástroj, který umí sídlo instalovat a spravovat.

44. Development process

45. Porovnání • Podobně jako OOHDM používá objektový konceptuální model. • Podobně jako RRM a OOHDM: • Navrhuje jazyk pro práci s pohledy na dataWebML-OQL. • Navrhuje specifické modelování navigace po webovém sídle a elementů webových stránek. • Podobně jako OOHDM se snaží o dopracování do fáze implementace.

46. Závěr • Aktuální problematika – návrh webových sídel. • Teoreticky propracovaná – stále se rozvíjí. • Zahrnuje moderní prvky – například XML. • Staví na standardech – UML. • Mnoho článků, tutoriálů a příkladů. • Velice rozsáhlá a prakticky orientovaná. • Komerční orientace – firma WebRatio.

47. Závěr • Aktuální problematika – návrh webových sídel. • Teoreticky propracovaná – stále se rozvíjí. • Zahrnuje moderní prvky – například XML. • Staví na standardech – UML. • Mnoho článků, tutoriálů a příkladů. • Velice rozsáhlá a prakticky orientovaná. • Komerční orientace – firma WebRatio. Metodologie podobného druhu jsou nesmírně důležité!

48. Závěr • Aktuální problematika – návrh webových sídel. • Teoreticky propracovaná – stále se rozvíjí. • Zahrnuje moderní prvky – například XML. • Staví na standardech – UML. • Mnoho článků, tutoriálů a příkladů. • Velice rozsáhlá a prakticky orientovaná. • Komerční orientace – firma WebRatio. Jinak je návrh webových sídel amatérský a nikoliv inženýrský!

49. URL • WebML: http://www.webml.org • WebRatio: http://www.webratio.com

50. ČVUT-FEL, K-313 Technická 2 166 27 PRAHA 6 Tel.: ++420 2 2435 2118 Email: molhanec@fel.cvut.cz WWW: martin.feld.cvut.cz/~molhanec MOLHASOFT Křivenická 406 181 00 PRAHA 8 Tel.: ++420 233 55 05 21 Email: martin@molhanec.cz WWW: www.molhanec.cz Ing. Martin Molhanec, CSc. Děkuji za pozornost 