Suunniteltu mobiilikäyttöön

Silktide lataa jokaisen sivun simuloidulla mobiililaitteella ja tarkistaa, onko se ylipäätään suunniteltu toimimaan siellä – mukautuuko se kapeaan näyttöön vai näyttääkö se vain kutistetun työpöytäsivun.

Miksi tämä on tärkeää

Yli puolet verkkoliikenteestä tapahtuu mobiililaitteilla, joten sivu, joka toimii vain työpöydällä, epäonnistuu useimpien käyttäjiensä kohdalla heti ensimmäisellä napautuksella. Kävijät, jotka kohtaavat pientä tekstiä ja loputonta nipistyszoomausta, poistuvat sivulta; hakukoneet, jotka indeksoivat ensisijaisesti sivujen mobiiliversion, sijoittavat sivuston sen mukaisesti.

Tämä tarkistus havaitsee perustavanlaatuisen ongelman – sivun, jolla ei ole lainkaan mobiilisuunnittelua – eikä viimeistelyyn liittyviä ongelmia. Tarkistuksen läpäisseellä sivulla voi silti olla pienempiä mobiiliongelmia, jotka muut tarkistukset kattavat.

Näin korjaat ongelman

Kestävä ratkaisu on , jolloin sama sivu mukautuu mille tahansa näytön leveydelle. Jos sivustosi on luotu ennen responsiivisen suunnittelun yleistymistä, tämä tarkoittaa yleensä uudelleenrakennusta tai uutta teemaa – useimmat nykyaikaiset -teemat ovat oletusarvoisesti responsiivisia. Tarkemmin:

Määritä jokaisen sivun head-osioon mobiilin :

<meta name="viewport" content="width=device-width, initial-scale=1">

Käytä joustavia asetteluja ja -mediakyselyjä, jotta sisältö järjestyy kapeilla näytöillä uudelleen yhdeksi palstaksi sen sijaan, että sivu lukittaisiin työpöytäleveyteen.
Pidä leipäteksti mobiilissa luettavan kokoisena – vältä suunnitteluja, jotka kutistavat koko sivun mahtumaan näyttöön.
Testaa oikealla puhelimella tai selaimesi laite-emuloinnilla, aina noin 320 pikselin leveyteen asti.

Näin Silktide testaa tämän

Lataa sivu simuloidulla mobiililaitteella.
Tarkista, että sivu määrittää käyttökelpoisen näkymäalueen. Puuttuva näkymäalue tai yli 480 pikselin levyiseksi lukittu näkymäalue hylkää sivun – tämä on mobiilituen vähimmäisvaatimus.
Mittaa näkyvä teksti: jos yli 35 % siitä renderöityy lukukelvottoman kokoisena (alle 10 pikseliä zoomauksen jälkeen), sivu hylätään.
Tarkista, kuinka paljon sivu loitontuu mahtuakseen näyttöön: alle 60 %:n zoomaus normaalikoosta tarkoittaa, että sivu käyttää käytännössä työpöytäasettelua, ja se hylätään.
Sivu läpäisee tarkistuksen, kun siinä ei ilmene mitään näistä ongelmista. Silktide raportoi myös, kuinka monta sivua ei ole suunniteltu mobiilikäyttöön ajan mittaan.

Vianmääritys

Sivuni näyttää hyvältä puhelimessani

Jotkin sivut voivat vaikuttaa hyväksyttäviltä, vaikka ne silti epäonnistuvat jonkin yllä mainitun signaalin vuoksi – esimerkiksi vanhan työkalun luoman kiinteäleveän viewport-tagin takia. Tarkastele sivun lähdekoodia ja varmista, että <meta name="viewport">-tagi vastaa suositeltua muotoa.

Tarkistus läpäistään, mutta mobiilikokemukseni on heikko

Läpäisy tarkoittaa, että sivu täyttää perusvaatimukset, ei että se on optimaalinen. Katso pieniin teksteihin, pieniin napautuskohteisiin ja käytöstä poistettuun zoomaukseen liittyvät tarkistukset.