Talent Base: Sisällönhallinta ja responsiivinen web design

1,379 views

Published on

Mitä tarkoittaa responsiviinen verkkosisällön esitystapa? Mitä sisällönhallinnassa tulee ottaa huomioon? Käytännön haasteita ja ratkaisuja.

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,379
On SlideShare
0
From Embeds
0
Number of Embeds
16
Actions
Shares
0
Downloads
10
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • CMS:
    Filenet, IBM DB2 Content Manager, Documentum, Coremedia...
    WCM:
    Sharepoint, Wordpress, Joomla, Drupal, Coremedia, IBM WCM, Open Text, SDL Tridion, Adobe, Opensource
  • Selaimet: Firefox, Internet Explorer, Chrome, Opera, Netscape
    Käyttöjärjestelmät: Windows, Linux, Mac OS-X
    Mobiilialustat: Windows Phone, iOS, Android, Symbian, Meego, Blackberry, jne. jne.
  • Perinteinen malli internet-sivun ja sisällön toteuttamiseen.
    Suunnittelu ja toteutus usein yhdelle kiinteällä näyttökoolle. Erilaisten työpöytäselainten tukeminen voi olla haastavaa.
    Photoshop design, yksi layout, sisältö suunniteltu sopimaan ruudulle

    http://veikonkala.org/responsive/index.html
  • Visuaalinen suunnittelu, UI design
    Sisällön suunnittelu ruudulle
    Photoshop
    Toteutus voidaan saadaan vastaamaan staattista Photoshop-suunnitelmaa.
    Sisällönhallinta ylläpitää sisällön järjestelmässä
  • Työpöytäselaimet: näyttö, hiiri, näppäimistö
    Tabletit: näyttö, kosketus
    Mobiili: näyttö, kosketus, näppäimet, muisti, hitaampia, Flash, javascript, HTML5, datayhteyden laatu jne.
  • Lisää tuettavia laitteita tuo myös lisää huomioitavaa suunnitteluun, toteutukseen ja sisältöön
    Erilaisia variaatioita / yhdistelmiä sisältöä esittävistä laitteista voi olla valtavasti
    Kaikkien variaatioiden tukeminen on mahdotonta ja erilaisia toteutustapoja tulee pohtia tarkoin.
    Mitä ja ketä halutaan saavuttaa ja missä halutaan säästää – suunnittelussa, sisällöntuotannossa, toteutuksessa?
  • Vaihtoehto jonka valitsemista kannattaa harkita huolella.
  • Vain hyvin rajatulle määrälle erilaisia päätelaitteita
    Raskasta ja kallis suunnitella, ylläpitää ja toteuttaa. Mitä enemmän laitteita sitä enemmän käyttöliittymätoteutuksia
    Päädytään helposti kaaokseen kun sisällön esittäminen erilaisissa päätelaitteissa toimii eri tavalla
    Vrt. erilliset mobillisovellukset eri alustoille!
  • Suositeltava vaihtoehto.
  • Yksi sisältö suunnitellaan skaalautuvaksi erilaisille näytöille
    Hyödyntämällä Progressive Enhancement –lähestymistapaa suunnittelussa ja toteutuksessa saadaan heti alusta tuki vanhoille laitteille.
    Samaa käyttöliittymää rikastetaan moderneille internetselaimille niin että käyttökokemus on rikkaampi ja näyttävämpi selaimen kyvykkyyksien ja ominaisuuksien mukaisesti.
    Säästetään design-, suunnittelu- ja toteutusvaiheissa
    Esitystapa voi toimia eri tavalla erilaisissa päätelaitteissa, mutta sisältö on aina esitettävissä
  • Ensimmäisiä toteutuksia, tunnettu esimerkki
    Pitkälle viety toteutus skaalautuu laajasti erilaille päätelaitteille

    http://veikonkala.org/responsive/index.html
    http://bostonglobe.com
    http://yle.fi/uutiset/
  • Oma esimerkki.
    Staattinen html sivu kolmella breakpointilla, CSS3, HTML5
    480px (esim. matkapuhelimet) + 768px (esim. tabletit) + 900px (työpöytäselaimet)

    http://veikonkala.org/responsive/index.html
  • Sisällön esitystapa vaihtelee päätelaitteittain (resoluutio, sisällön sijoittelu, fontit, navigointi, kuvamateriaali)
    Käyttöliittymän suunnittelu on huomattavasti joustavampaa verrattuna perinteiseen Photoshop malliin. Tarvitaan internetselaimia ja HTML koodia!
    Työkaluja ja metodeja löytyy suunnittelun avuksi mutta kokemuksen perusteella Photoshop-tasolta on hyvä siirtyä mahdollisimman HTML-prototyyppiin oikealla sisällöllä.

    Yksi design kattaa kaikki näytöt -> Tarvitaan osaava suunnittelija ja prototyypin kehittäjä.
    Sama sisältö esitetään kaikille näytöille -> Hyvä CMS suunnittelu ja toteutus takaa ettei sisällöntuotannon työkuorma kasva suuresti.
    Suunnitellaan ja kehitetään yhtä käyttöliittymää -> Progressive Enhancement auttaa rakentamaan ensin perustoiminnot ja moderneja selaimia varten on helppo kehittää rikkaampi käyttökokemus
  • Mikäli responsiivinen esitystapa valitaan etenemisvaihtoehdoksi, niin mitä asioita sisällönhallinnan tulisi huomioida?
  • Ennen kuin lähdetään toteuttamaan ja luomaan sisältöä responsiiviseen käyttöliittymään kannattaa huomioida seuraavia asioita:
    Toimintamallin kehittäminen joustavaksi ja ketteräksi on oleellisen tärkeää koska esim. käyttöliittymän tai sisällön suunnittelua on lähes mahdotonta tehdä ns. Staattisesti!
    Responsiivisen käyttöliittymän ja sisällön suunnitteleminen on mahdotonta ainoastaan Photoshopissa ja paperilla. Vähemmän Photoshopia – enemmän protoilua oikealla sisällöllä! Useita näkymiä erilaisille näytöille ja laitteille, interaktiot, breakpointit

    Yhteistyö ja kommunikointi liiketoiminnan, visuaalisen- ja sisällönsuunnittelun sekä teknisen toteutustiimin kanssa onnistuu parhaiten juuri prototyypin avulla. Lisäksi eri osapuolet voivat hyödyntää prototyyppiä monella tapaa:
    Uusien visuaalisten elementtien suunnittelu, uusien konseptien kokeileminen, uuden sisällön kokeileminen ja suunnittelu, kommunikointi ja ohjeistus käyttöliittymän toiminnasta, käyttöliittymäkoodi varsinaiseen tekniseen toteutukseen, toiminnallisuuksien ja sisällön testaaminen erilaisilla päätelaitteilla, sisällönhallinnan ohjeistaminen
  • Mitä sisällönhallinnassa tulisi huomioida?
    Ennen varsinaisen toteutuksen ja sisällön suunnittelua tarvitaan linjauksia ja vaatimuksia.
    Millainen yleisö halutaan tavoittaa?
    Millaista tarjottava sisältö pääasiallisesti on?
    Staattista sisältöä: kuvia & tekstiä vai rikasta sisältöä: video, Flash, toiminnallisia komponentteja
    Miten erilaisia päätelaiteryhmiä ja selainten ominaisuuksia priorisoidaan. Esim. Onko tärkeintä että sisältö toimii hyvin vanhoissa laitteissa ja pienillä näytöillä vai halutaanko aloittaa enemmän uusiin laitteisiin ja ominaisuuksiin? PE!
    Esim. Erilaiset laitteet tukevat erilaisia mediaformaatteja. iOS -> ei tue Flash
    Lokalisointi, RTL, LTR
  • Mitä sisällönhallinnassa tulisi huomioida?
    Käyttöliittymä tulee suunnitella oikealle sisällölle. Ensin sisältö, sitten design ja prototyyppi!
    Mikäli olemassa olevaa CMS-järjestelmää aletaan jatkokehittämään responsiivisen esitystavan käyttöön, hyödynnä olemassa olevaa sisältömallia prototyypin suunnittelun perustana.
    Huomioi olemassaolevan sisällön uudelleenkäyttö uudessa käyttöliittymässä!
    Suunnittele optimoitu sisältö erilaisille näyttölaitteille!
    Nopeuttaa sivun lataamista ja optimoi ladattavan sivun kokoa
    Vaatii esimerkiksi eri resoluutiolle optimoidut kuvatiedostot -> aikaa vaativaa suunnittelua
    Itsenäisten esityskomponenttien toiminnallisuudet ja käyttäytyminen sisällön esittämisessä voidaan suunnitella, toteuttaa ja testata pienemmissä osissa. -> helpompaa
  • Mitä sisällönhallinnassa tulee huomioida – CMS järjestelmän toteutus
    Media ja binääritiedostot!
    Kuva- ja videosisällön skaalaaminen ja optimointiratkaisut
    Työnkulut, sisällön esikatselu
    Oikeat laitteet ja esikatselu!
    Sisällön muotoilujen rajoittaminen editorissa auttaa responsiivisen esitystavan toteutuksessa.
    Esim. sisällön sijoittelu (kuva vasemmalla, oikealla, päällä, alla) menettää merkityksensä responsiivisessa esitystavassa. Erilaisissa näytöissä sisällön sijoittelu elää!
    Käyttöliittymä määrittelee tekstin ja sisällön sijoittelun!
    Vanhemmille selaimille voidaan toteuttaa esim. erillinen käyttöliittymä ja käyttäjä voidaan ohjata käyttöliittymään esim. päätelaitetunnistuksen avulla!
  • Mitä sisällönhallinnassa tulee huomioida – operatiivinen työ!
    Optimoitu CMS-järjestelmä tukee sisällönhallintaa responsiivisessa esitystavassakin eikä merkittäviä muutoksia tarvita verrattuna esim. vain työpöytä selaimille tarkoitettuun julkaisuun.
    Sisältömalli vaatii laajennuksia esim. kuva tiedostojen osalta. Tarvitaan useampia kuvakokoja erilaisille näytöille (optimointi)
    Testaamisessa ja esikatselussa kannattaa ehdottomasti käyttää myös oikeita päätelaitteita ja datayhteyksiä
    Ennalta määritellyt kuvakoot ja kuvasuhteet erilaisiin käyttötarpeisiin mahdollistaa kuvien automaattisen käsittelyn ja optimoinnin!
    Tekstimuotoilut kannattaa rajata minimiin (vasen, oikea, jne.) koska esim. sijoittelut menettävät merkityksensä responsiivisessa esitystavassa
  • Muutos toimintatavoissa:
    Kiinteä layout, yksi näkymä, sisällölle varattu tila tiedossa, selaimen fold -> Joustavampi toimintamalli, skaalautuva esitystapa, sisällölle varattu tila ja sisällön sijoittelu vaihtelee
    Sisällönhallinta on aikaisemmin voinut vaikuttaa paljon esim. sisällön sijoitteluun ja muotoiluun -> käyttöliittymälogiikka vastaa sijoittelusta responsiivisessa esitystavassa!
    Kommunikaatio:
    Kaikkien osapuolten tulisi ymmärtää toimintatapojen muutos ja responsiivinen esitystapa.
    Avainsanoja: joustavuus, ketteryys ja HTML prototyyppi, tiimit läsnä paikan päällä!
    Käyttöliittymän ja toiminnallisuuksien suunnittelu:
    Prototyyppi, ei pelkkää Photoshop-suunnittelua
    Online komponenttikirjasto sisällön esittämiseen (sisällön suunnittelu, uusien näkymien suunnittelu)
    Kokemus yhdessä: design + ratkaisusuunnittelu!
  • Sisällön suunnitelu:
    Käyttöliittymä ja sisältö erotetaan selkeästi.
    Sisällön suunnittelussa hyödynnetään prototyyppiä. Testataan uusia konsepteja
    Kuvakoot, media standardoidaan, jotta sisällön optimointi saadaan automatisoitua
    Tuettavien päätelaitteiden ja selainten valitseminen:
    Ei keskitytä yksittäisiin päätelaitteisiin vaan ominaisuuksiin ja valitaan sen mukaan kattava valikoima laitteita testaamiseen
    Voidaan päätyä helposti laitekohtaiseen optimointiin!
    Kuvat, videot, interaktiivinen media:
    PE. Suunnitellaan sisältö niin että sisältö tarjoaa informaation ilman rikasta mediaa (animaatiot, video), tarjotaan rikkaampaa sisältöä niitä tukeville selaimille
    Standardoidaan ja automatisoidaan kuvien ja mediatiedostojen hallinta.
  • http://gs.statcounter.com/#mobile_vs_desktop-ww-monthly-200807-201207
  • Talent Base: Sisällönhallinta ja responsiivinen web design

    1. 1. SISÄLLÖNHALLINTA JA RESPONSIIVINEN WEB DESIGN SISÄLLÖN- & DOKUMENTTIEN HALLINTA Jukka-Pekka Kääriäinen Senior Consultant, Talent Base
    2. 2. Sisällönhallinta ja responsiivinen web design 1. Mitä tarkoittaa responsiivinen verkkosisällön esitystapa? 2. Mitä sisällönhallinnassa tulee ottaa huomioon? 3. Käytännön haasteita ja ratkaisuja 4. Miltä tulevaisuus näyttää?
    3. 3. Termistöä • Content Management System (CMS) – Sisällönhallintajärjestelmä • Web Content Management (WCM, WCMS) – Web-sisällönhallinta • Responsive Web Design (RWD) – Tapa suunnitella ja esittää verkkosisältöä päätelaitteen ominaisuuksien mukaisesti parhaalla mahdollisella tavalla • Progressive Enhancement (PE) – Suunnitellaan ja toteutetaan ensin vankka perusta perusselaimille – käyttökokemusta parannetaan ja rikastetaan moderneille laitteille • Vastakohta: Graceful Degradation (GD), ensin rikas toteutus moderneille selaimille, yksinkertaistetaan tukemaan vanhempia
    4. 4. 1. Mitä tarkoittaa responsiivinen verkkosisällön esitystapa?
    5. 5. Esimerkki: Uutta sisältöä internetsivulle Työpöytäselaimet – Design-ohjeistus, graafinen ohjeistus, sisältöstrategia – Käyttöliittymän leveys max. 930 px (1024 ruudulle ->) – Kuvan ja tekstin asemointi määritetty kiinteäksi – Yksi kuvakoko
    6. 6. Design • Photoshop design • Kuvat, teksti Suunnittelu ja toteutus • Arkkitehtuuri • HTML, JS, CSS • CMS/WCMS Sisällönhallinta Sisällön hallinta CMS/WCM- järjestelmässä Web Loppukäyttäjät Perinteinen malli: Sisältöä työpöytäselaimeen Design, sisältö Tekstisisältö - Otsikko - Tiivistelmä - Leipäteksti Käyttöliittymä Otsikko Tiivistelmä Navi Otsikko Tiivistelmä Työpöytäselaimet 1920 x 1080 CMS
    7. 7. 3.7” 480x800 Kosketus 3.5” 640x960 Kosketus, puhe 4,65” 720x1280 Kosketus 4,3” 540x960 Kosketus 3” 320x480 Kosketus, näppäimet ”Tabletit” 9.7” 1024x768 2048 x 1536 Kosketus ”Työpöytä” 24” 1920x1080 Hiiri, näppäimistö Työpöytäselaimet , lisää laitteita...
    8. 8. ... lisää laitteita, lisää huomioitavaa • Erilaisia päätelaitteita: näytön koko, resoluutio, orientaatio: – 245 variaatiota matkapuhelinten & tablettien näyttöresoluutioille (otos: 4685 laitetta, http://cartoonized.net/cellphone-screen-resolution.php) • Käyttöjärjestelmiä: – Windows, Linux, Mac OS X, iOS, Android, Symbian, WP7... • Internet selaimet ja ominaisuudet: – Chrome, Firefox, Internet Explorer, Safari, Opera, HTML5, CSS3, Javascript, Flash • Laitteen käyttöliittymän ohjaustavat: – Kosketus, näppäimet, ääni, liike • Erilaisia yhdistelmiä valtava määrä
    9. 9. Esimerkki 1: Erillinen sisältö ja erilliset käyttöliittymät – raskasta ylläpitää ja kehittää Verkkosisällön esittäminen erilaisille päätelaitteille
    10. 10. CMS Matkapuhelimet... Tabletit 2048 x 1536 1536 x 2048 480 x 800 800 x 480 Design, sisältö Tekstisisältö - Otsikko - Tiivistelmä - Leipäteksti Käyttöliittymä 1 Otsikko Tiivistelmä Leipäteksti Navi Otsikko Leipäteksti Työpöytäselaimet 1920 x 1080 CMS Design, sisältö Tekstisisältö - Otsikko - Tiivistelmä - Leipäteksti Käyttöliittymä 2 Otsikko Tiivistelmä Navi Otsikko Leipäteksti CMS Design, sisältö Tekstisisältö - Otsikko - Tiivistelmä - Leipäteksti Käyttöliittymä 3 Otsikko Leipäteksti Otsikko Leipäteksti Navi
    11. 11. Esimerkki 2: Responsiivinen esitystapa - Suositeltava vaihtoehto Verkkosisällön esittäminen erilaisille päätelaitteille
    12. 12. CMSSisältö Responsiivinen esitystapa Yksi sisältö Yksi sisältö + yksi esitystapa  yhdenmukainen sisällön esitystapa optimoituna erilaisille päätelaitteille työpöytäselaimista matkapuhelimiin! Matkapuhelimet... Tabletit 2048 x 1536 480 x 800 800 x 480 Työpöytäselaimet 1920 x 1080 Tekstisisältö - Otsikko - Tiivistelmä - Leipäteksti Responsiivinen käyttöliittymä Otsikko Tiivistelmä Leipäteksti Navi Otsikko Leipäteks ti 1536 x 2048 Responsiivinen esitystapa
    13. 13. Käytännön esimerkkejä Responsiivinen esitystapa
    14. 14. The Boston Globe : www.bostonglobe.com iPhone 4 640x960 LG U970 240x320 Windows 7 Chrome 1400x900px
    15. 15. Esimerkki Windows 7 Chrome 1400x900px 900px 768px 480px • Tekstin ja kuvien asettelu • Kirjasinkoko • Navigaatio • Kuvan koko ja näkyvyys
    16. 16. Responsiivinen esitystapa - tiivistelmä • Ei ole vain yhtä esitystapaa ja designia! • Responsiivinen käyttöliittymä tunnistaa päätelaitteen ominaisuudet sekä selaimen kyvykkyydet ja esittää sisällön parhaalla mahdollisella tavalla: – Näytön leveys, orientaatio – Selaimen kyvykkyydet – Ohjaustapa: hiiri, näppäimistö, kosketusnäyttö • Sisällön esitystapa voi vaihdella päätelaitteissa ja selaimissa: – Kuvien koko, sijoittelu, näkyvyys – Tekstisisällön ja kirjasimen koko, sijoittelu, näkyvyys – Käyttöliittymäkomponenttien sijoittelu, näkyvyys • Ei tarvitse kehittää ja ylläpitää useita erillisiä sisältöjä ja käyttöliittymiä erilaisia päätelaiteryhmiä varten!
    17. 17. 2. Mitä sisällönhallinnassa tulee ottaa huomioon? Responsiivinen esitystapa sisällön esittämiseen päätelaitteissa
    18. 18. HTML proto- tyyppi Design Loppu- käyttäjät Tekninen suunnittelu ja kehitystyö Sisällön- hallinta Toimintamalli ja kommunikaatio Sisältö ja design Loppukäyttäjät Suunnittelu ja toteutus Sisällön ylläpitäjät Vähemmän Photoshopia – enemmän protoilua aidolla sisällöllä! Prototyypin käyttöliittymäkoodin hyödyntäminen, käyttöliittymän määrittelyt, UX ohjeistuksena, sisältömalli Tiivis yhteistyö: liiketoiminta, design, sisällön suunnittelu, tekninen suunnittelu, toteutus, sisällönhallinta! Uusien konseptien testaaminen prototyypin avulla. Erilaiset päätelaitteet, loppukäyttäjillä Sisällön testaaminen ja esikatselu. Laitteiden erilaisuudet! Prototyyppi keskeisessä roolissa suunnittelussa ja kommunikoinnissa
    19. 19. Vaatimusmäärittely • Selkeät tavoitteet toiminnallisuuksille ja sisällölle ohjaavat sisällön ja esitystavan suunnittelua • Sisältöstrategia: Mikä on tärkeää, ketä halutaan tavoittaa? – Interaktiivinen sisältö, videot ja kuvamateriaali. Päätelaitteiden rajoitteet & kyvykkyydet! – Sisällön priorisointi sivulla ja päätelaitteissa, voidaanko jotain jättää näyttämättä? – Monikielisyys, lokalisointi eri maihin
    20. 20. Käyttöliittymän ja sisällön suunnittelu • Responsiivisessa käyttöliittymässä sisällön esitystapa voi vaihdella erilaisissa päätelaitteissa • Responsiivista esitystapaa ei suunnitella ja toteuteta yksittäisille päätelaitteille vaan esitystapa reagoi käytettävän selaimen ominaisuuksien mukaisesti • Käyttöliittymän suunnittelussa lähtökohtana tulisi olla oikea sisältö! • HTML-prototyyppi on korvaamaton työkalu suunnittelussa • Suunnittele uudelleenkäytettäviä käyttöliittymäkomponentteja ja rakennuspalikoita sisällön esittämiseen - ei yksittäisiä sivuja! • Suunnittele ensin vanhoille selaimille, rikasta moderneille selaimille (PE) • Huomioi sisältömalli (content model) käyttöliittymän ja sisällön suunnittelussa
    21. 21. Esitystavan ja CMS-järjestelmän toteutus • HTML-prototyypin toteutus hyödynnettävissä lopullisessa toteutuksessa • Toteuta ensin perusta sisällön esittämiseen peruslaitteissa, rikasta ja paranna käyttökokemusta uudemmille laitteille (PE) • Huomioi media- ja binääritiedostojen hallinta! Optimointi! • Optimoi CMS-järjestelmä sisällönhallinnan helpottamiseksi • Käytä oikeita päätelaitteita ja datayhteyksiä! • Sisällönhallintajärjestelmässä hallitaan sisältöä, ei sisällön esitystapaa! • Responsiivisen esitystavan toteutuksissa hyödynnetään usein uusimpia standardeja kuten HTML5, CSS3 ja javascriptiä. Huomioi myös vanhemmat mobiililaitteet ja selaimet!
    22. 22. Operatiivinen sisällönhallinta • Optimoidun CMS-järjestelmän avulla sisällönhallinta- ja ylläpitotyö ei muutu suuresti • Julkaistava sisältö ei näy ainoastaan yhdellä esitystavalla vaan erilaisia päätelaitteita ja esitystapoja on paljon • Sisällön testaaminen ja esikatselu • Responsiivinen sivun esitystapa voi ohjata esim. tekstin ja käyttöliittymäelementtien sijoittelua, fonttikokoja ja näkyvyyttä • Tekstisisällön muotoilut kannattaa pitää minimissä • Kuvamateriaalin standardoiminen mahdollistaa automatisoinnin (koko, kuvasuhde)
    23. 23. 3. Käytännön haasteita ja ratkaisuja...
    24. 24. Käytännön haasteita ja ratkaisuja... Haaste Ratkaisu Siirtyminen työpöytäselaimelle optimoidusta suunnittelusta ja sisällöntuotannosta responsiiviseen esitystapaan • Toimintamallin kehittäminen, protoilu osaksi suunnittelua ja kommunikointia. • Tiedottaminen ja koulutus! Kommunikaatio eri osapuolten kanssa. Esim. liiketoiminnan edustajat, ratkaisusuunnittelu, sisältö, käyttöliittymä, tekninen suunnittelu, toteutus jne. • Prototyypin hyödyntäminen, koulutus ja tiedottaminen, odotusten hallinta • Edes hyvä dokumentaatio ei vastaa ”face to face” -työskentelyä! Käyttöliittymän design ja toiminnallisuuksien suunnittelu • Prototyyppi! Esim. on-line - käyttöliittymäkomponenttikirjasto, jossa esimerkkejä oikeasta sisällöstä • Suunnittelu ja toteutus selainten kyvykkyyksien mukaan, ei erilaisten päätelaitteiden • Suunnittelijalta tarvitaan todellista kokemusta responsiivisesta lähestymistavasta!
    25. 25. Käytännön haasteita ja ratkaisuja... Haaste Ratkaisu Sisällön suunnittelu • Sisällön suunnittelussa ei suunnitella käyttöliittymää vaan sisältöä • Sisällön testaaminen hyvissä ajoin aidosti internetselaimessa ja prototyypissä Tuettavien päätelaitteiden ja selainten valitseminen • Valitaan testaamiseen monipuolinen otos erilaisia alustoja ja päätelaitteita. Keskitytään selainten ominaisuuksiin eikä yksittäisiin laitteisiin! • Linjaus tuettavista laitteista: Vanhat laitteet, älypuhelimet, tabletit, työpöytäselaimet... Kuvien, videoiden ja interaktiivisen median tarjoaminen eri päätelaitteille • Progressive Enhancement - lähestymistapa helpottaa suunnittelua. Perustoiminnot ensin! • Kuvakokojen ja videon automaattinen optimointi. Adaptiivinen mediasisällön lataaminen eri näyttöresoluutiolle!
    26. 26. 4. Miltä tulevaisuus näyttää?
    27. 27. Miltä tulevaisuus näyttää? • Responsiivinen esitystapa on yleistynyt nopeasti • Mobiililaitteiden selaimet kehittyneet ja esim. älypuhelinten Internet- käyttö on noin moninkertaistunut viime vuosina • Erilaisten mobiililaitteiden, sähköisten lukulaitteiden ja kodinelektroniikkalaitteiden internetkäyttö yleistyy samalla kun perinteisten työpöytäselainten osuus pienenee • Nopeammat datayhteydet, jatkuva tavoitettavuus • Verkkosisällönsuunnittelun, sisällöntuotannon ja -hallinnan täytyy kehittyä mukana vastaamaan tarpeeseen • Sisällönhallinnassa ja –suunnittelussa tulisi panostaa sisällön käytettävyyteen eri medioissa • Internetselaimet, standardit, HTML5 (draft), CSS3, yhdenmukaistumassa ja toiminnallisuudet monipuolistumassa
    28. 28. Esityksen tekijä • Jukka-Pekka Kääriäinen, senior konsultti, Talent Base • Internet- ja webkehityksessä vuodesta 1997 • Ohjelmointia, suunnittelua, IT arkkitehtuuri- ja vaatimusmäärittelytyötä, ratkaisusuunnittelua • Suuria tietojärjestelmä- ja palvelukehityshankkeita, internet, intranet, extranet, portaalit • Suuntautuminen vahvasti dokumenttien- ja sisällönhallinnan eri osa-alueilla, web-sisällönhallintaratkaisut, sähköinen asiointi
    29. 29. Lisätietoja Jukka-Pekka Kääriäinen, Talent Base Oy + 358 40 511 6827 jp@talentbase.fi www.talentbase.fi

    ×