Responsiivinen ulkoasu kaikille päätelaitteille

EsittelyKäyttöohjeet › Responsiivinen ulkoasu kaikille päätelaitteille

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 ↗. Kaikki valmiit ulkoasupohjat läpäisevät Googlen mobiililaitesoveltuvuustestin ↗.

Responsiivinen ulkoasu on tässä ohjelmistossa lähes portaatonta. Erillisiä mobiili- ja tietokoneversioita ei ole olemassa, koska jako kahteen ei ole järkevää. Jako kahteen pudottaisi muun muassa tabletit pois pelistä. Portaaton responsio toimii parhaiten kaikenkokoisilla päätelaitteilla kännyköistä taulutelevisioihin.

Tekninen toteutus

Responsiivinen ulkoasu on toteutettu CSS3:n ominaisuuksiin kuuluvilla mediakyselyillä (media queries). Jokaisen mediakyselyn sisällä on päätelaitteen koolle sopivat CSS-tyylit.

@media (max-width: 799px) {
    div.tb_cart_columns {}
}
@media (min-width: 800px) {
  div.tb_cart_columns {
    display: table;
    width: 100%;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
  }
}

Verkkokauppias voi halutessaan lisätä ja muokata mediakyselyjä verkkokaupan ulkoasun suunnittelun yhteydessä. Mediakyselyjä ei ole lukittu millään tavalla tiettyihin mittoihin eikä ohjelmiston ytimeen. Tämän ansiosta ohjelmisto on valmiiksi yhteensopiva responsiivisen suunnittelun tulevaisuuden kanssa.

asetukset / koodit ja ulkoasu

Laajennettu responsiivisuus

Responsiivisuus voi olla muutakin kuin pelkästään ulkoasuun liittyvää. Ohjelmistolla toteutetun verkkokaupan sisältöä, kuten kategorioita, tuotteita, maksutapoja, toimitustapoja ja tilauslomakkeessa kysyttäviä tietoja, voidaan kohdentaa asiakasryhmiin.

Scroll to Top