Maanantaina, 24.6.2013

Tulisiko responsiivinen design ”pakottaa” k√§ytt√§j√§lle?

Sain mielenkiintoista palautetta sivuistamme viikonloppuna. Palautteen antaja oli katsonut sivuja puhelimella ja halunnut n√§hd√§ milt√§ sivut n√§ytt√§v√§t ”tietokoneversiona”. Kommentissa oli hyv√§ pointti, sivuja kun ei p√§√§se n√§kem√§√§n mobiilissa ty√∂p√∂yt√§versiona ollenkaan, sill√§ responsiivisessa suunnittelussa mobiilissa tietokoneversiota ei ole olemassakaan. Miksi ei? Annas kun kerron.

Responsiivinen suunnittelu, eli kansakielell√§ ”mukautuva” suunnittelu on sit√§, ett√§ sivut suunnitellaan n√§kym√§√§n yht√§ hyvin mahdollisimman monella laitteella. Sivut siis ”n√§ytt√§v√§t samalta”, mutta ovat ahdettuna pienemmille ja isoille n√§yt√∂ille oikeaoppisesti sopivaksi. Esimerkiksi pienemmill√§ n√§yt√∂ill√§ tarpeettomia graafisia elementtej√§ saatetaan piilottaa, mutta sama tieto l√∂ytyy (tai oikein suunniteltuna pit√§isi l√∂yty√§) my√∂s mobiilissa.

Lähtökohtaisesti näyttää samalta, elementit vaihtavat hieman paikkaa, mutta kaikki pysyy nätin näköisenä. Näet miten homma toimii kun pienennät tätä sivua selainikkunaasi vaakatasossa (olettaen, että selaat sivuja juuri nyt tietokoneella).

responsive

Vielä pari vuotta sitten erillinen mobiiliversio ja työpöytäversio oli arkipäivää. Vieläkin näkee sivustoa, jotka kehottavat puhelimella selattaessa siirtymään mobiiliversioon ja sivustoja jotka pakottavat aivan erinäköisen ja paljon kökömmän mobiiliversion puhelimella selattaessa. Joissakin on footerissa linkki työpöytäversioon, joissakin ei.

Mukautuvalla käyttöliittymällä pyritään varmistamaan, että sivusto on selvästi luettavissa ja palvelee automaattisesti käyttäjiään halutulla tavalla päätelaitteesta riippumatta.

Voiko verkkosivustoja enää suunnitella ilman mobiililaitteiden huomiointia? РDigitohtorit РMarkkinointi&Mainonta

Miten erillinen mobiiliversio ja mukautuva verkkosivusto sitten muka eroavat toisistaan? Siten, ett√§ mit√§√§n ”erillist√§” versiota sivustosta ei tehd√§, vaan sama sivusto toteutetaan skaalautumaan eri n√§yt√∂ille. Mobiilisivustojen ongelmana on ollut tunnetusti se, ett√§ sis√§lt√∂ ei pysy samana ja sit√§ jopa unohdetaan p√§ivitt√§√§.

Ongelmana on myöskin ollut mobiilin ja työpöydän välimuodot Рpädit, tabletit, muistiinpanolaitteet (Samsung Galaxy Note) ja muut mediavermeet, joissa näytön koko ei ole vakio. Responsiivinen suunnittelu korjaa nämä ongelmat, sillä sama sivusto skaalautuu kaikille näytöille ruudun koosta riippumatta.

sivut

Jonkin verran on k√§yty keskustelua siit√§ onko oikein ”pakottaa” k√§ytt√§j√§t selaamaan sivua mobiilissa ”mobiiliversiossa” ja ty√∂p√∂yd√§ll√§ ”ty√∂p√∂yt√§versiossa” ja pit√§isik√∂ k√§ytt√§j√§n saada p√§√§tt√§√§ mit√§ versiota haluaa selata. N√§m√§ keskustelut ovat niit√§ menneen talven peruja, jolloin Nokia-ajan Symbian-puhelink√§ytt√∂j√§rjestelm√§ kukoisti ja erillinen mobiiliversio oli ainoa keino saada sivuista edes jollain tasolla j√§rkev√§t puhelimella selatessa. Responsiivisen suunnittelun aikakaudella ei voida en√§√§ puhua ”versioista”, eik√§ n√§in ollen k√§ytt√§j√§√§ oikeastaan en√§√§ pakoteta mihink√§√§n.

Miksi emme n√§e en√§√§ sivuston alaosissa ”n√§yt√§ kokoversio” -valintaa? Vastaus on helppo: katselet jo valmiiksi kokonaista ”versiota”, sit√§ samaa mit√§ muillakin laitteilla.

  1. Työpöytäoptio on 90% tapauksista todella turhaa ja jopa hieman haastavaa toteuttaa, tarvittaessa se kuitenkin onnistuu
  2. Jos tällainen vaihtoehto olisi, se olisi sama kuin myöntäisit että responsiivinen suunnittelusi kusee, sillä sivujen pitäisi olla suurinpiirtein saman näköiset (joskin eri kokoisessa paketissa) ja toiminnaltaan samanlaiset kuin muillakin alustoilla.

Vielä yhteenvetona: responsiivisen designin tulisi olla jo arkipäivää. Jos haluat nähdä miltä sivut näyttävät tietokoneen näytöltä tarkasteltuna, mene tietokoneelle. Puhelimella ei ole tarkoitus yrittää venyttää ruutua puhelimen näytön ulkopuolelle, eikä missään tietokoneessa ole neljän tuuman kokoista näyttöä.

Ovatko sinun sivusi jo responsiiviset?

Pullopostia?

Koottuja kuulumisia sisältävä bittivirtojen pulloposti saapuu rantaasi noin kolmen kuukauden välein.