Onko responsiivinen sivusto oikein toteutettu, jos se on hidas?

Yritykset julkaisevat uudistettuja sivustoja mobiilikäyttäjien tarpeet huomioiden. Responsiivinen suunnittelu on tärkeä osa sivuston sovittamista eri kokoisille näytöille ja erilaisille laitteille.

Mikä on useimmin unohdettu osa-alue responsiivisuudessa?

Nopeus.

Aidosti responsiivisen sivuston on oltava nopea!

Mobiilikäyttäjä odottaa sivustosi näkymien muodostuvan alle 3 sekunnin. Jokainen sekunti hitaudessa vähentää mobiilikäyttäjien määrää, käyttökokemusta, sekä halua palata sivustollesi ja suositella sitä muille.

Case joulukuu

Joulukuussa analysoimme erään asiakkaan sivuston. Asiakas oli uudistanut sivustonsa ja toimittaja oli luvannut toteuttaa ne responsiivisesti. Asiakkaiden negatiivinen palaute ja asiakkaan omat kokeilut mobiililaitteilla saivat hälytyskellot soimaan.

Nopeusoptimointi paljastaa pullonkaulat

Nopeusoptimointi lähtee liikkeelle sivuston analyysistä, joten tutkimme sivuston toteutuksen sellaisena kuin asiakkaat sen näkevät. Nopealla laajakaistalla ja tietokoneella käytettäessä sivusto ei tuntunut erityisen raskaalta, mutta mobiilin käyttökokemus oli kelvoton. Käyttöliittymän rakenteessa oli responsiivisia ominaisuuksia, lähinnä sovittaminen eri kokoisille näytöille toimi odotetusti. Näkymää muodostettaessa näytettiin kymmeniä tuotteita ja jokaisesta yksi kuva. Kuviin liittyi kaksi suurta ongelmaa, a) näkymää muodostettaessa ladattiin kaikki tuotekuvat, vaikka vain yksi näytettiin käyttäjälle sekä b) kuvakoko oli liian suuri. Käyttäjälle näytettiin postikortin kokoisia kuvia postimerkin kokoisina.

Näkymän koko oli luokkaa 15-25mb ja selaimen oli suoritettava http request -kyselyitä noin 150 kappaletta. Kyselyiden kestäessä keskimäärin 300ms, kyselyiden määrästä johtuva viive on 5-6 sekuntia. Suuri latauskoko tarkoittaa 5Mbps nopeudella 32 sekunnin viivettä, vielä nopeilla 4G yhteyksilläkin latausviive on 4-6 sekunnin luokkaa. Tämän päälle tulee mobiililaitteen prosessoinnista johtuva hitaus, joka korostuu sivun ollessa äärimmäisen raskas.

Case Joulukuu odottaa vielä nopeusoptimointi-suositustemme toteuttamista toimittajan osalta. Asiakkaalle oli tärkeintä saada meiltä dokumentoitua tietoa koetun hitauden syistä ja mittakaavasta, sekä selkeät toimintaohjeet tilanteen korjaamiseksi.

Asiakas kiitti asiantuntemustamme, keskustelu sivuston toimittajan kanssa on helpompi kun hänellä on käytössään mitattua tietoa ja faktoja.

Lue lisää blogistamme Responsiivinen, mutta hidas? Nopeusoptimointi auttaa.