MULTI- JA HYPERMEDIAN PERUSTEET

Slides:



Advertisements
Samankaltaiset esitykset
SkyDrive ja Office Web Apps –sovellusten käyttäminen
Advertisements

TILDA-Verkkotilastointi
Suorita menulta voit ottaa yhteyden iSeries:iin tai katkaista yhteyden sinne ja poistua RI400:sta.
Avonet Digilehtiö käyttö
Wikispace jatkokurssi Jarmo Heikkinen Karoliina Kemppainen Satu Kylmänen.
Internetin palvelut Matti Meikäläinen. Internet-sivut (WWW) •Internetin suosituin palvelu •Sivujen selailuun tarvitaan WWW-selain –Mozilla Firefox –Internet.
JavaScript oliot © Reiska, DOM Oliot  JavaScript sisältää paljon valmiita DOM olioita, on sisältänyt jo DOM level 0 (ns. Legacy DOM) alkaen  WWW-ympäristössä.
JavaScript (c) Irja & Reino Aarinen, 2007
Www-sivuston ja verkkopalvelun rakentaminen Miten tehdä yritykselle www-sivut?
1 Heli Lepomäki Yritysten ja muiden organisaatioiden käyttöön sähköinen työpöytä on jo leviämässä, koska niiden toiminta ja asiakaspalvelu.
1 Java-kieleen pohjautuvien ohjelmien käyttökohteita Ohjelmat Appletit JavaBeans JavaScript Java Server Pages (JSP) Java Servletit J2ME, mobiililaitteet.
© 2010 IBM Corporation1 Etusivun muokkaaminen  Portaalisivut ja niihin määritetyt komponentit muodostavat varsinaiset internet-sivut.  Etusivu muodostuu.
Mikä on internet? b Kymmenien tuhansien yhteen liitettyjen tietoverkkojen kokonaisuus b Internetin palvelut ovat ilmaisia - liittymät ovat maksullisia.
Verkot: internet ja HTML Jaana Holvikivi Metropolia.
HTML-kielen perusteet Osa 1 Vilho Kemppainen
Kotisivukoulutus Kirjastotalo Metso Osa 1 Tekstin kirjoittaminen ja muokkaaminen, linkitys.
Työskentely verkoissa Jaana Holvikivi EVTEK Tietojenkäsittelyn historiaa luku 2001 Ensimmäiset tietokoneet PC:t Suuret tietokoneet laskentaan,
vuorovaikutteiset www-sivut 1.Asiakas-palvelinmalli kuvana Request Response request.asp response.asp.
Julkaisukielet ja - tekniikat tMyn1 Julkaisukielet ja -tekniikat •Verkko-ohjelmointi voidaan jakaa kahteen osaan: asiakaspuolen ja palvelinpuolen ohjelmointiin.
Ubuntuun LAMP server sekä Samba tiedostonjako palvelu.
Erik Fallenius Kevät  Taustaa ◦ Ontologiat  Tavoitteet  Teknologiat ◦ Dojo/AJAX ◦ JSON ◦ SOAP  Projektin kulku  Lopputulos – demo.
Ohjelmistokehittäminen. Luku 1 – Mitä on ohjelmistokehittäminen?
W w w. h a m k. f i Wiki koulutus Leenakaija Lehto
EXtensible Markup Language
Internet  Lingua Franca, kaikkien ymmärtämä yhteinen kieli: TCP/IP tai UDP/IP. ”Kaikki maaiman tietokoneet, liittykää yhteen”.  Suomeen 1990-luvun alussa.
Power Point – esitysgrafiikkaohjelma lyhyesti
TVT ja SoMe Jonna ja Johanna.
Verkkotaitokoulutus Aloitus. Koulutuksen sisältö Verkonkäytön perustaitoja (3.11.) Tiedonhaku verkossa (10.11.) Työnhaku verkossa (17.11.) Asiointi ja.
 Kirjoita harkiten keskusteluryhmiin Jos kirjoitat viestejä julkisiin keskusteluryhmiin varmista, että viestisi liittyy ryhmän aiheeseen. Älä lähetä.
Tekoäly-sovellusten levittäminen WWW-ympäristössä
S Tiedonsiirto ja yhteyskäytännöt tietoliikenteen perusasioita top-down -lähestymistapa ohjelmistotekniikan näkökulma tavoitteena toimivat sovellukset.
URI Universal Resource Identifier Matti BrockmanMatti Brockman, , TKTLTKTL.
HTTP-protokollatMyn1 HTTP-protokolla HTTP (HyperText Transfer Protocol) on web-asiakkaan ja –palvelimen keskinäiseen tiedonsiirtoon käyttämä yhteyskäytäntö.
Vapaa aihe Kysymykset.
Maaseutu.fi on uudistunut -
Ohjelmointi.
Internet-projekti - MUM2TM Heikki Hietala Jukka Mutikainen TIKO – Malmi
XML -kielen perusteet SIMO Seminaari Antti Mäkinen.
Mikä ihmeen Office 365? Office 365
Office 365 –pilvipalvelut UEF:n opiskelijoille
Web 2.0 tiivistetysti 1. Ohjelmistoalusta on Web. Webtop korvaa Desktopin. Keskeistä yhteisöllisyys ja ”Software as a Service”. 2. Kollektiivisen älyn.
Kuinka tehdä blogi o365:ssä
RSS, Rich Site Summary © Reino Aarinen, RSS RSS (Rich Site Summary, joskus Really Simple Syndication) on menetelmä, joka käyttää XML merkkausta.
vuorovaikutteiset www-sivut1 Palvelinpuolen www- ohjelmointi Dynaaminen Internet  käyttäjän tai selaimen tunnistaminen  käyttäjän toiveiden.
XML Namespaces 1 XML Namespaces provide a method to avoid element name conflicts –name conflict will occur when two different documents use the same element.
CSS3 Teppo Räisänen
JohdantotMyn1 Johdanto Verkkopalvelun koostamiseen käytetään koosteohjelmia ja ohjelmointikieliä. Verkkopalvelun toteutus voi vaatia myös palvelinohjelmointia.
Lomakkeet © Reiska, Lomakkeet Varsinkin Web-sovelluksia ajetaan täyttämällä sivulla lomake ja lähettämällä tiedot palvelimella olevan Web-sovelluksen.
XHTML ja linkit Inline-elementti Linkki tehdään a-elementillä ja linkin kohde ilmoitetaan href- attribuutilla Absoluuttinen linkki Helian pääsivulle: Siirry.
XHTML-perusteita Teppo Räisänen
402T20E Digitaalisen sovellustuotannon työvälineet, 3 op Flash MX –perusteet Ari Vainionpää.
 MODx on julkaisujärjestelmän ja sovelluskehyksen risteytys, jonka lisenssinä on kaikille ilmainen avoimen lähdekoodin GNU GPL. MODx on suunniteltu ammattilaisten.
Kaksi- ja kolmitasoiset sovellukset Two and Three Tier Systems.
HTTP (c) Reino Aarinen, HTTP yhteyskäytäntö Web asiakasohjelmat (yleensä erilaiset selaimet) käyttävät HTTP protokollaa tiedon siirtoon WWW sivustojen.
II opponointi KOPPELO-projekti. Projektiorganisaatio Jäsenet: * Minna Hillebrand * Markus Silván * Antti Vanhanen * Marko Ylitalo Tilaajat.
Joni Kelloniitty & Niko Säyriö
1 2. Tietoverkot Internet: maailman laajuinen verkko tietokoneverkoista Transmission Control Protocol/Internet Protocol (TCP/IP) Tieto lähetetään paketteina.
XSL Teppo Räisänen
XSL Teppo Räisänen
Kottarainen Jyväskylän yliopisto - Sovellusprojekti WWW-pohjainen kyselysovellus.
Miika Kuusinen LTY/Tietoliikenteen laitos 2003
06/11/ Porin korkeakouluyksikkö © Jari Multisilta,2000 Rakenteinen dokumentaatio ja XML Jari Multisilta Porin korkeakouluyksikkö.
Helsingin normaalilyseo Jani Kiviharju Syksy 2016
WWW-sivuston ja verkkopalveluiden rakentaminen

MULTI- JA HYPERMEDIAN PERUSTEET
Web-sovellusten kehittäminen - Johdanto
JavaScriptin perusteet
Istuntojen hallinta PHP-sovelluksessa
PHP Tietokantaohjelmointi 1
Esityksen transkriptio:

MULTI- JA HYPERMEDIAN PERUSTEET © Irja Aarinen, 2005

Multi- ja hypermedia Multimedialla (multi=moni, media=viestintäväline) tarkoitetaan tässä digitaalista, tietokoneella tapahtuvaa tekstin, taulukoiden, grafiikan, valokuvien, äänen ja liikkuvan kuvan (animaatio, elokuva) yhdistä- mistä yhdeksi, yhdellä laitteella – tietokoneella, tai oikeammin ”media- koneella” – nautittavaksi kokonaisuudeksi. Hypermediadokumenteissa tiedostot on tallennettu vain kerran ja yhteen järjestelmään, mutta niihin voidaan viitata useasta eri paikasta ja kohdasta. Hypermediassa tieto on tallennettu solmuihin, jotka yhdistyvät toisiinsa linkein. Yhdessä solmussa voi olla kuva tai tekstin osa. Linkit liittävät nämä eri osat toisiinsa kokonaisuudeksi.

Internet ja WWW Internet tarkoittaa maailmanlaajuista digitaalista tietoverkkoa, joka perustuu yhteisiin teknisiin sopimuksiin ja menettelytapoihin. Se koostuu tuhansista pienemmistä kaupallisista, akateemisista tai valtiollisista verkoista, jotka on teknisesti liitetty toisiinsa Internet-protokollaperheen (TCP/IP) avulla. WWW (web) on vain yksi, joskin suurin Internetissä toimiva järjestelmä. Internetin käyttötapoja: Liiketoimintamalleja: Tiedon levittäminen e-lehdet, e-kirjat, ... Tiedon haku pelit Keskustelupalstat ja verkkoyhteisöt e-kaupat, e-pankit, e-hankinta ... Tiedostojen jako (FTP) erilaiset markkinapaikat Sähköinen kaupankäynti Palveluketjun tiettyyn osa-alueeseen Chat keskittyvät palveluntarjoajat Sosiaalinen media Virtuaaliset yhteisöt

Intranet, Ekstranet Intranet on yrityksen tai muun organisaation sisäinen verkko. Perus- tekniikat ovat samat kuin internetissä, mutta se on ulkopuolisilta suljettu, eli käyttäjät pääsevät verkkoon vain tunnuksilla. Voidaan käyttää yrityksen sisäiseen viestintään, koulutukseen jne. Ekstranet on yrityksen tai muun organisaation asiakkaitaan ja yhteistyö- kumppaneitaan varten perustama verkko. Ekstranetissä voidaan jakaa asiakkaille ja yhteistyökumppaneille tietoa, jota ei haluta yleiseen jakeluun.

WWW-tekniikan termejä HTML-dokumentti: Dokumentti, joka sisältää tekstiä ja HTML-merkkausta. Tiedostopääte on .htm tai .html Web-dokumentti: Yleisnimitys webissä käytettäville dokumenteille, jotka vaikuttavat web-sivun sisältöön ja muotoon. Esim. HTML- dokumentti, erilliset CSS-tyylisivut, DTD-määrittely, JavaScript- tiedosto, sovelma (Applet, Flash), kuva, äänite, video jne. Web-sivu: Kokonaisuus, joka muodostuu edellisen kohdan osista.

Kokonaisuus, joka teknisesti vastaa web-sivua, mutta voi sijaita Verkkosivu tai sivu: Kokonaisuus, joka teknisesti vastaa web-sivua, mutta voi sijaita vain intranetissä tai ekstranetissä rajoitetulle käyttäjäkunnalle. Sivusto (saitti, site): Sivujen muodostama looginen kokonaisuus, jossa sivut on linkitetty toisiinsa. Selain: Asiakasohjelma, joka pystyy esittämään verkkosivuja ja jolla voi kulkea, navigoida eri sivujen välillä Graafiset selaimet (Internet Explorer, Firefox, Chrome, Opera, Safari) Tekstiselain (Lynx) Puheselain. Braille-selain Hakukoneet

Palvelin Web-palvelin vastaa asiakasohjelmana toimivalta web-selaimelta tulevaan palvelupyyntöön esimerkiksi lähettämällä selaimelle web-sivun katseltavaksi. Tyypillisiä web-palvelimia ovat mm. Apache HTTPD ja MS Internet Information Server (IIS).

HTML (Hypertext Markup Language) HTML on Internetissä julkaistavien dokumenttien loogisen rakenteen kuvaamiseen käytetty kieli. HTML-dokumentin runko on ASCII-muodossa oleva tekstitiedosto, joka sisältää sekä itse aineiston, että aineiston rakennetta ja osin muotoiluakin ohjaavat komennot. HTML-tiedostoa voi siis selata ja muokata tavallisella tekstieditorilla. Dokumentissa voidaan viitata osoitteilla eli URLeilla esimerkiksi kuviin, äänitallenteisiin ja animaatiota tuottaviin ohjelmiin (esim. Applet, Flash).

HTTP (HyperText Transfer Protocol) HTTP on sovittu yhteyskäytäntö eli protokolla dokumenttien (tiedostojen) siirtämiseksi web-palvelimen ja selaimen välillä. Protokolla perustuu siihen, että asiakasohjelma (selain, hakurobotti tms.) avaa TCP/IP-yhteyden palvelimelle ja lähettää pyynnön. Palvelin vastaa lähettämällä sopivan vastauksen, tavallisimmin HTML-sivun tai binääridataa kuten kuvia, ohjelmia tai ääntä. Vastauskoodit (kolminumeroisia lukuja) kertovat selaimelle kuinka tiedonsiirrossa kävi: 1-alkuiset koodit ovat tiedottavia 2-alkuiset ilmoittavat onnistuneesta toiminnosta. Yleisin 200 OK 3-alkuiset kertovat uudelleenohjauksesta toiselle sivulle 4-alkuiset ovat erilaisia virhekoodeja, esim. 404 Not Found 5-alkuiset kertovat palvelimen virhetilanteista (server error)

URI (Uniform Resource Identifier) Resurssin identifiointi: Resurssi tarkoittaa verkkosivua tai yleisemmin, yksilöitävissä olevaa datan lähdettä. URI on yleisnimi, URN tai URL on konkreettinen nimi tai lokaattori (paikannin), vastaavasti. Paikannin tarkoittaa määrämuotoista merkkijonoa, jonka perusteella resurssi löytyy verkosta tai järjestelmästä. Esim. http://www.samk.fi https://192.49.222.187/omat/etusivu.aspx (https=HTTP secure) mailto:irja.aarinen@aariset.com

MIME (Multipurpose Internet Mail Extensions) Internet-mediatyypit eli MIME-tyypit on alkujaan kehitetty sähköpostia varten, jotta tekstin merkkivalikoimaa voitiin laajentaa ja lähettää myös muuta kuin tekstimuotoista tietoa. Sähköpostin lisäksi MIME-tyyppi on tärkeä myös WWW-sivuilla. Kun selain- ohjelmalla katsellaan sivuja, HTTP-palvelin ilmoittaa selaimelle, minkätyyp- pinen tiedosto on tarjolla. Palvelinohjelma liittää MIME-tyypin HTML-tiedoston otsikkotietoihin, jotka se lähettää selaimelle ennen varsinaista dokumenttia. MIME-tyypin selvittyä selain etsii ohjelman, jolla kyseinen tiedosto voidaan avata. Yleisin tyyppi on HTML-tiedoston text/html -tyyppi. Mediatyypin nimi muodostuu päätypistä ja alityypistä. text/html tarkoittaa text-päätyypin html-alityyppiä.

Webin evoluutio

XML ja HTML XML ei korvaa HTML:a, vaan ne täydentävät toisiaan. Standardeilla on eri päämäärät: XML on tarkoitettu datan kuvaamiseen HTML on tarkoitettu datan näyttämiseen

SGML XML HTML XHTML SGML = Standard Generalized Markup Language. SGML on yleinen ISO standardi sähköisen dokumentaation taltioimiseen ja siirtämiseen. HTML on SGML-sovellus XML = eXtensible Markup Language on metakieli kuten SGML. Metakieli on kieli, joka kuvaa standardin, jolla luoda ja kuvata muita kieliä. XHTML on eräs XML sovellus.

HTML:ään upottaminen ja linkittäminen Esim. kuva voidaan liittää HTML-dokumenttiin kahdella tavalla, upottamalla tai linkittämällä. Näiden välinen ero on tärkeä myös oikeudellisesti, sillä kuvaan linkittäminen on yleensä vapaata, kun taas kuvan upottaminen vaatii kuvan tekijänoikeuden haltijan luvan. Upotukseen voidaan käyttää img-, embed tai object-elementtiä, joka on kehotus selaimelle hakea elementissä mainittu kuva ja liittää se osaksi sivua. Linkityksessä esim. sana voidaan tehdä linkiksi. Jos käyttäjä seuraa linkkiä, selain pyytää kuvaa palvelimelta, jolloin se aukeaa joko samaan selainikkunaan HTML-dokumentin esityksen tilalle, tai uuteen ikkunaan.

Staattinen ja dynaaminen sivu Staattinen sivu jokaisella kerralla ja jokaiselle selaajalle samanlainen muutokset tehtävä sivun HTML-tiedostoon Dynaaminen sivu sivu luodaan joka kerta uudestaan eli tiedot luetaan esimerkiksi tietokannasta sivun HTML-tiedosto ei muutu muutokset tehtävä tietokantaan

Staattisen sivun teko Vaihtoehtoja staattisen sivun laatimiseksi: HTML-koodin kirjoittaminen tekstieditorilla Erilaiset sivugeneraattorit Perus toimisto-ohjelmat Word, Excel, PowerPoint jne. Frontpage, Dreamweaver,.. Ideana tuottaa puhdas HTML-tiedosto

Dynaaminen HTML-pohjainen ratkaisu Server Side Sivulla on HTML-koodin joukossa tietokantaa käsitteleviä lauseita (PHP, ASP, JSP ...) - CGI, PHP, JavaServlet, JavaServer Pages/Faces Palvelimella on ohjelma, joka tuottaa HTML-koodin, joka palautetaan asiakkaalle - Tietokantakäsittely tehdään sivun rakentamisen aikana - Tarvitaan sovelluspalvelin ja tietokantapalvelin Client Side JavaScript, E4X, AJAX CSS, DOM