Vidya Drego - Trends in the Future of Online Experience – referaatti
IA instituten Vidya Drego puhuu presentaatiossaan nykyisistä webin trendeistä joissa yhtiö näkee tulevaisuuden webin suunnan. Hän toteaa, ettei näe webin löytäneen vielä lopullista muotoaan ja vertaa sitä auton kehitykseen. Autolla kesti 50 vuotta kehittyä nykyaikaisen malliseksi ja 100 vuotta nykypäivän autoksi. Yhtiö kiteyttää ajatuksensa tulevaisuuden webiin johtavista trendeistä mallillaan, jota kutsuu nimellä C.A.R.S. kustomoitu, aggregoitu, relevantti, sosiaalinen (Customized, Aggregated, Relevant, Social). Webin tulevaisuuden mallia varten tehty tutkimus perustui kolmeen kohtaan: laitteiden valmiudet, asiakkaiden tarpeet ja toiveet ja kilpailun määrä kentällä.
Laitteiden valmiuksia tarkastellessa Drego mainitsee hyvien valmiuksien omaavien alustojen määrän kasvaneen. Niistä on kasvanut myös juuri johonkin tiettyyn tarkoitukseen suunnitellut laitteet, kuten hänen esimerkkinä mainitseva sateesta muistuttava sateenvarjo, joka saa säätiedot internetistä. Mobiililaitteiden määrä on myös kasvanut samoihin lukuihin kun perinteiset desktop-laitteet. Mobiililaitteiden kehitys on myös mahdollistanut niille käytön monipuoliseen webselailuun. Puhuja mainitsee myös täysin uudenlaiset laitteet, uudenlaisilla käyttöliittymillä, kuten Microsoftin kosketuspöydän.
Asiakkaita tutkiessa yhtiö on Dregon mukaan todennut asiakkaiden kiinnostuksen kasvaneen esimerkiksi mobiililaitteisiin ja sosiaalisen webiin käyttöön. Suurimpana asiakkaiden toiveena on edelleen kuitenkin helppokäyttöisyys. Kilpailu on myös kasvanut ja se on tulevaisuuden webin kannalta tärkeää. Uusien sivustojen määrä internetissä on tuplaantunut neljän vuden sisällä.
Drego antaa myös esimerkkejä sivustoista, jotka ovat lisänneet C.A.R.S -atribuutteja. Asiaa selventääkseen hän mainitsee muutama vuosi sitten kiinnostusta herättäneen sivuston Mint.com, jossa käyttäjä voi agregoida finanssipalveluita, tilejä ja informaatiota yhteen monesta eri lähteestä yhteen paikkaan. Bundle lisäsi samaan ideaan vielä sosiaalisuuden ja käyttäjä voi vertailla finannsitietojaan saman ikäisiin henkilöihin sijainnista riippuen.
Zillow.com on kiinteistöjä etsivien käyttäjien sivu. Käyttäjä voi kustomoida kiinteistöjen haut itselleen sopiviksi. Sivusto agregoi kiinteistödataa monesta paikasta ja antaa mahdollisuuden tutkia sijainteja kartoista. Sivusto on myös tilanteelle ja laitteelle relevantti ja tarjoaa mobiiliversion. Zillow sisältää siis kolme C.A.R.S -atribuuttia: kustomoitu, agregoitu ja relevantti.
Kaikki neljä atribuuttia tarjoaa Weather.com, joka Dregon mukaan hiljattain lisäsi nämä ominaisuudet re-designissa. Käyttäjä voi kustomoida ja tallettaa omanlaisensa haut säätiedoille. Palvelu tajoaa myös kustomoidut johonkin tiettyyn aspektiin liittyvät säätiedot, kuten golf-säät. Sivusto on optimoitu relevantiksi monelle erilaiselle laitteelle, kuten puhelimelle tai ipadille. Sivusto on lisännyt myös sosiaaliset toiminnot. Käyttäjä voi jakaa omat sääkertomuksensta kuvien muodossa. Drego mainitsee Weather.comin kertoneen C.A.R.S -ominaisuuksien lisäämisen olleen suuri impakti sivustolle. Sen suosio onkin kasvanut huomattavasti uudistusten myötä.
Drego toteaa, että sivustot, jotka eivät lisää kyseisiä ominaisuuksia ovat vaarassa menettää asiakaskuntaa. Sivustot eivät kilpailun kovetessa pysty enää pitämään monopolimaista asemaa tietyn aktiviteetin tarjoajana yhtä helposti kuin ennen. Esimerkiksi ostoksia tekevät asiakkaat käyttävät ennemmin hintavertailu-palveluita, kuin yksittäisiä nettikauppoja. Siksi onkin tärkeää ilmoittaa hintansa tällaisessa palvelussa vaikka se olisikin kovempi kuin kilpailijalla. Näin ainakin sivusto pysyy näkyvissä.
Ethan Markku Tähtinen
0702799
12.4.2011 Eathan Marcotte: Responsive Web Design – referaatti
Eathan Marcotte antaa A List Apart -artikkelissaan Responsive Web Design, esimerkkejä ja näkökulmia selainlaitteeseen reagoivaan web-desiginiin. Hän toteaa web-lähteisiin viitaten, että mobiilin odotetaan ohittavan pöytäkoneen yleisimpänä web-selainlaitteena 3-5 vuodessa. Lähteiden mukaan monet sivut eivät silti tarjoa mobiililaitteille optimoituja sivuja.
Kirjoittaja toteaa törmänneensä viimeaikoina useisiin yhtiöihin, jotka haluavat ”iPhone-sivut” osaksi projektiaan. Hän näkee sen osaksi WebKitin hyvyydeksi selaimena ja yhtiöiden bisnesideana levittyä pöytäkoneen ulkopuolelle. Kehittäjille hän näkee sen kuitenkin tapana mennä sieltä missä aita on matalin. Voimme luoda mobiilin käyttökokemuksen erottamalla mobiilisivut, tai tarkemmin iPhone-sivut ”normaalista” sivusta subdomaineilla, mutta kirjoittaja epäilee voimmeko jatkaa kehittämistä jokaiselle useragentille erikseen.
Marcotte näkee joustavan sivurakenteen olevan oikea suunta tulevaisuuden web-layoutille. Tällä hän viittaa aikaisempiin artikkeleihinsa Fluid Grids ja Flexible Images, joissa hän antaa esimerkkejä prosenteilla määritettyjen elementtien muodostamiin layoutteihin. Tällainen sivurakenne on tarkoitus näyttää samalta näyttöikkunan kokoa, orientaatiota tai tarkkuutta muutettaessa. Mutta kun siirrytään mobiililaitteiden näyttöjen kokoihin, tällainenkaan suunnittelu sivut ei enää riitä. Kirjoittaja toteaa, että kehittäjien on joustavuuden lisäksi luotava sivustoja, jotka reagoivat niitä renderöiviin laitteisiin.
Hän kirjoittaa, että W3C on luonut CSS3 määrittelyihinsä media queryn, joka antaa mahdollisuuden tutkia sivua renderöivän laitteen fyysisiä ominaisuuksia. Tämä antaa mahdollissuden esimerkiksi tarkastaa onko laitteen näytön leveyspienempi kuin jokin tietty pikseliarvo ja antaa sille määritetty CSS-tyylitys. Samalla tavalla voimme esimerkiksi tarkastaa onko laite poikittain vai pystyssä ja näytön resoluution. Tarkistuksen voi sisällyttää myös suoraan CSS:ään.
Tämä mahdollistaa, että voimme järjestellä layoutin elementit laitteen koolle relevantiksi. Voimme jättää jotain näyttämättä tai korvata sen muulla. Toisin sanoen voimme antaa täysin uuden layoutin, jokaiselle resoluutiolle. Mutta reagoiva design ei rajotu pelkästää layout-muutoksiin. Media queryt antavat meille mahdollisuuden tarkkaan käytettävyyshienosäätöön. Voimme vaikkapa lisätä linkkien target-areaa sopivaksi kosketusnäytölle ja Fittsin lain mukaisiksi. Voimme myös parantaa lukukokemusta tekstiä esittävän näytön mukaiseksi.
Marcotte kirjoittaa, että media queryt toimivat useimmilla moderneilla selaimilla. Desktop-selaimet kuten Safari 3+, Chrome, Firefox 3.5+ ja Opera 7+ ja mobiiliselaimet kuten Opera mobile ja mobile WebKit, kaikki tukevat natiivisti media queryä. Microsoft on luvannut sisällyttää sen Internet Exploreriin, joka siis tällä hetkellä ei media queryä tue.
Kirjoittaja painottaa tekstissään, että näiden teknisten ainesten lisäksi reagoiva design vaatii kehittäjältä myös uudenlaista ajatustapaa, laitelähtöisen ajatusmallin sijaan. Kuitenkin joissakin tapauksissa mobiilin ja ei-mobiiilin eristäminen voi olla parempi lähtökohta, kuten esimerkiksi jos haluamme bisnesmallissamme esittää mobiilissa eri sisällön kuin muuten. Tämän ei tarvitse kuitenkaan olla vakioajatusmallimme.
|