XML & CSS. WWW-sovellus??

Transkriptio

1 XML & Näkökulmia WWW-ympäristön sovelluksiin ja käyttöliittymiin ILKKA PALOLA Citec Information WWW-sovellus?? Informaationhallinta, julkaisutoiminta Verkkoviestintä ESIMERKKEJÄ käyttäjistä ja käyttökohteista: - Web-kirjakaupat ~ E-commerce - Verkkolehdet - Portaalit ~ SoneraPlaza - Virtuaaliyhteisöt ja -yritykset intranet, extranet... KÄYTTÖLIITTYMÄ SOVELLUS TIETOKANTA

2 WWW-sovellus?? Esimerkki: Projektitietokanta yrityksen sisäinen informaationhallintajärjestelmä WWW-selain WWW-selain (Netscape/IE) (Netscape/IE) WWW-selain WWW-selain (Netscape/IE) (Netscape/IE) HTTP/HTML/XML WWW Palvelin OHJELMA (perl) KÄYTTÖLIITTYMÄ SOVELLUS TIETOKANTA MySQL & XML Cascading Style Sheets = kaskadiset tyylisäännöt 1 (W3C Recommendation) 2 (W3C Recommendation) Asiasisältö (XML/HTML) Rakenne ja asiasisältö Selain Esitysmuodon kuvaus (/XSL) Ulkoasu (fontit, sijoitus, taustat, välistykset, värit, taittoelementit jne.)

3 & XML Selain Selain XML XML XML XML XML XML XML & XML :n (ja XML:n) etuja: standardi tapa ulkoasun kuvaukseen järjestelmä/laitteistoriippumaton mahdollistaa sisällön muokkauksen ja uudelleenkäytön helpottaa informaation ylläpitoa verkkoystävällinen merkkaus matala soveltamiskynnys monijulkaiseminen

4 & XML: monijulkaiseminen WWW CDROM Eri näkymät ja näkökulmat - käyttäjien mukaan - laitteistojen mukaan - käyttötark. mukaan a a a a a a a a a Paper Kieliversiot Intranet & XML ongelmia ja rajoituksia :n syntaksi poikkeaa XML:n syntaksista yksi uusi kieli opeteltavaksi Pelkästään ulkoasun kuvaamista ei rakenteen muokkausta (~XSL) Muokkaamiseen ja toiminnallisuuteen tarvitaan ohjelmointikieli Selainten XML& tuki? 1 siedettävä, 2 osittain mediatuki?? Grafiikkatuki?? Taulukoiden käsittely?? elementtien asettelu?? automaattinen numerointi?? tulostuksen ohjaus??

5 & XML VIHJEET JA VINKIT Hanki lähdemateriaali Opiskele dokumentin rakenne Tarkista tyylisääntöjen syntaksi validaattorilla Testaa tyylisääntöjen toimivuus eri käyttöympäristöissä (Unix, Mac, Win) eri mediassa (print, screen...) eri selaimilla (Mozilla, IE, Opera?) Valitse itsellesi sopivimmat työkalut. Parhaiten oppii kokeilemalla. Speksit ovat hakuteoksia eivät oppaita & XML ~ XUL Mozilla-selaimen käyttöliittymän (valikot, painikkeet, ikkunat jne. ) kuvaamiseen käytettävä kieli Netscape Communicator 5.0 perustuu tälle tekniikalle. XUL-tiedosto XML-syntaksin mukainen Käyttöliittymän ulkoasu kuvataan :llä. Käyttöliittymän toiminnallisuus ohjelmoidaan JavaScriptillä KÄYTTÖLIITTYMÄ

6 & XML ~ XUL SOVELLUSIDEOITA palvelinkohtaiset käyttöliittymät profiloidut käyttöliittymät esim. Lapset Lisätietoja: KÄYTTÖLIITTYMÄ & XML ~ XUL

7 & XML ~ XUL & XML ~ XUL

8 & XML ~ XUL Käyttöliittymä XUL Selain Sisältö ja ulkoasu XML & XML elementti määrite (attribuutti) <author class= company >Ilkka Palola</author> alkutunniste sisältö lopputunniste Elementtien rakenneosat

9 & XML tyylisääntö author { color: navy; font-family: Arial, sans-serif; } selektori deklaraatiot Tyylisääntöjen rakenneosat & XML Tyylisäännöstön liittäminen XML-dokumenttiin <?xml-stylesheet href= tyyli.css type= text/css?> Tyylisäännöstön liittäminen (X)HTML-dokumenttiin <link rel= stylesheet href= tyyli.css type= text/css > <?xml-stylesheet href= tyyli.css type= text/css title= Basic Style?> <?xml-stylesheet href= tyyli2.css type= text/css title= Plain Style alternate= yes?> <?xml-stylesheet href= tyyli3.css type= text/css title= Fancy Style alternate= yes?>

10 & XML Tyylisäännöstön kohdemedian määritteleminen <link rel= stylesheet href= tyyli.css media= xx type= text/css > xx = All Aural Handheld Print Projection Screen... kaikki mediatyypit puhesyntetisaattorit kannettavat (esim. kännykkä) Tulostimet Siirtoheittimet Tietokoneen näyttö & XML esitelma.xml <?xml version="1.0"?> <?xml-stylesheet href="start.css" type="text/css" title="start"?> <presentation xmlns:html=' <header> <title>:n käyttö XML-sovelluksissa</title> <author> <name>ilkka Palola</name> <company>citec Information</company> <address>silmukkatie 2</address> <postalcode>65200 Vaasa</postalcode> <tel> </tel> <fax> </fax> < >ipa@citec.fi</ > <www> </author> </header> <chapter> <title>1 JOHDANTO</title> <para>tekstipohjaisessa informaationhallinnassa XML:ään kohdistuvat odotukset ovat suuria. Stadler (1998) vakuutti XML:n tuovan helpotusta wwwylläpitäjien elämään ja vastaavasti XML:n sanotaan yksinkertaistavan SGML:n moniulotteista ja vaikeatulkintaista maailmaa. Myös eri yritykset ja yhteisöt ovat jo pitkään. /* Start View Style */ presentation { display: block; background-color: white; color: black; margin: 1em; font-family: Times, serif; font-size: large; } header:before { display: block; content: url(citec.gif); text-align: center; margin-top: 1em; margin-bottom: 2em; } header, author, chapter, subchapter { display: block; } tyyli.css

11 & XML Lähdemateriaalia, lisätietoa Ilkka Palola, Citec Information World Wide Web Consortium Mozilla Organisation MozillaZine Professional Style Sheets for HTML and XML Frank Boumphrey (1988)