Responsiivinen ulkoasu

Käyttöohjeet › Responsiivinen ulkoasu

Ohjelmistolla toteutettu verkkokauppa on responsiivinen verkkokauppa, joka toimii kaikilla päätelaitteilla. Verkkokaupan asiakkaan ei tarvitse asentaa mobiilisovellusta eikä valita erikseen mobiilisivuja. Responsiivisuus on Googlen suositus ↗. Ohjelmistolla toteutetut verkkokaupat läpäisevät Googlen mobiililaitesoveltuvuustestin ↗.

Responsiivinen ulkoasu on toteutettu lähes portaattomasti. Uusimmat ulkoasupohjat ovat "mobile first". Erillisiä mobiili- ja tietokoneversioita ei ole olemassa, koska se ei ole enää järkevää (aiemmin jako kahteen saattoi olla perusteltua). Portaaton responsio toimii parhaiten kaikenkokoisilla päätelaitteilla kännyköistä taulutelevisioihin.

Tekninen toteutus

Responsiivinen ulkoasu on toteutettu CSS3:n ominaisuuksiin kuuluvilla mediakyselyillä (media queries).

#ultimate_top {
  margin: 0 auto;
  overflow: auto;
  padding: 45px 0px 25px 0px;
}

@media (min-width: 1100px) {
  #ultimate_top {
    width: 1050px;
  }
}
@media (min-width: 1400px) {
  #ultimate_top {
    width: 1350px;
  }
}

Verkkokauppias voi halutessaan lisätä ja muokata mediakyselyjä verkkokaupan ulkoasun suunnittelun yhteydessä. Mediakyselyjä ei ole lukittu tiettyihin mittoihin tai ohjelmiston ytimeen. Siksi ohjelmisto on myös yhteensopiva responsiivisen tulevaisuuden kanssa.