Mobiiliviihde kasvaa nopeasti.

Älypuhelimet myyvät edelleen voimakkaasti, kun Apple vain ennustaa tuo 180 miljardia dollaria sen älypuhelimista vuoteen 2021 mennessä yli 224 miljoonaa älypuhelin käyttäjää Yhdysvalloissa, jolloin mobiiliverkko on keskeinen painopiste miltä tahansa sivuston omistajalta.

Mobiiliverkon käyttäjien jatkuva kasvu tekee suunnittelijoista ja front-end-kehittäjistä tärkeän ymmärtää nopeutettujen mobiilisivujen oikeanlaisen suunnittelun.

Kiihtyneiden mobiilisivujen käytäntö korostaa suunnitteluratkaisuja, jotka vastaavat mitä hakukoneet tunnistavat ystävällisiksi , mukaan lukien määritelty yleisö, laadukas sisältö, oikea muotoilu ja saumaton mobiilikäyttöinen yhteensopivuus. Huomaat useita nopeutettuja mobiilisivuja Google-selaimessa mobiililaitteissa lyhenne AMP hakutuloksissa .

Nopeutetut mobiilisivut käyttävät edelleen HTML: ää, vaikka niissä on erityisiä elementtejä, jotka asettavat nopeuden etusijalle mobiililaitteissa. AMP: n tekniset vaatimukset perustetaan AMP-hanke , sillä standardit toimivat yhdessä Googlen kaltaisten suurten liikenteenohjaajien rinnalla. Hanke on luotu vastaukseksi murehtimille käyttöliittymille ja hidas latausaikoja mobiililaitteen sivustojen selaamisen yhteydessä.

AMP korostaa nopeaa nopeutta ja perehtynyt ulkoasu, mikä antaa luojille mahdollisuuden muotoilla sivujaan AMP-puitteissa. Useimpiin AMP-sivuihin perustuva kuormalevyn keskeinen muoto antaa samanlaisen navigoinnin, vaikka sisällön esitys- ja värimallit eroavat toisistaan.

Tuloksena on nopeampi, yhtenäisempi selailukokemus, joka parantaa pudotusnopeuksia, lisää lukijan sitoutumista ja tuo esiin matkaviestinnän selaamisessa.

AMP: n voima ja potentiaali ovat niin ilmeisiä, että suunnittelijat pitävät alla olevia vinkkejä helpottaakseen AMP-kokemuksen optimointia, joten asiakkaat hyötyvät monin tavoin.

1. Harkitse AMP-karuselli kotisivulle

Tee vaikutelma sivulle, jonka suurin osa kävijöistä alkaa. Staattinen sisältö voidaan näyttää AMP: ssä esittelemään käytettävissä olevia tuotteita, mikä merkitsee sähköisen kaupankäynnin kohteiden kiinnostusta sekä yleisluontoista sisältöä.

AMP-carousel feature AMP-karuselli-ominaisuus antaa suunnittelijoille mahdollisuuden näyttää useita samankaltaisia ​​sisältöjä vaakasuoralla akselilla. Kun olet tuonut karusellikomponentin otsakkeeseen, voit käyttää tyyppiä = "karuselli", jolloin näkyviin tulee luettelo kuvista, jotka näkyvät jatkuvana nauhana. Se on silmiinpistävä ominaisuus, joka on ihanteellinen etusivulle, kun yrität yhdistää kävijöitä näkemään jotain etusivulta.

2. Näytä aiheeseen liittyvät viestit ja tuotteet

Kannustetaan sivuston kävijöitä kaivaamaan sisältösi syvälle. Voit suorittaa tämän näyttämällä luettelon liittyvistä tuotteista tai viesteistä, joita he nyt katsovat. Voit staattisesti julkaista asiaankuuluvan sisällön luettelon ja suorittaa sen välittömästi käyttämällä , joka peittää CORS-pyynnön amp-viikset-templaatti jotta voit luoda dynaamisesti luotua sisällön merkitystä, jota voit muokata haluamaasi asetukseen.

Jos kävijät syöttävät aloitussivun, joka ei vastaa heidän pyyntöihinsä, he jättävät sivuston tai etsiä lisää mitä he etsivät . Tuotevaihtoehtojen ehdotus on erinomainen tapa käyttää käyttäjän hakuprosessia, ainakin vetämällä ne enemmän sivustoon. Vaikka he eivät löydä etsimäänsä tarkasti, he saattavat löytää vaihtoehdon, joka tekee työtä yhtä hyvin.

3. Käytä AMP-Analyticsia etsimään alueita parantamaan

Mikä tahansa sivuston omistaja tietää, kuinka kävijät ovat vuorovaikutuksessa sisällön kanssa. component komponentti voidaan käyttää joko suoraan tai integroituna kolmannen osapuolen analyysilaitteeseen, mukaan lukien Google Analytics. Sisällä tunniste, lisää tyyppihyväksyntä ja aseta arvo valitsemaasi myyjään , joista on monia vaihtoehtoja. component will help website owners have a clearer picture of what pages and design elements are resulting in conversions and which components are experiencing low user engagement. komponentti auttaa sivuston omistajia selkeämpää kuvaa siitä, mistä sivuista ja suunnittelun elementeistä tuloksena on tuloksia ja mitkä komponentit kokevat alhaisen käyttäjän sitoutumisen.

On tärkeää pitää mielessä, kun analysoidaan analyysia, että AMP: n avulla kätevä välimuisti on luonnollisesti upotettu. Tuloksena on, että saatat nähdä tavallista vähemmän liikennettä. Pidä vain välimuistiinpanot mielessä analysoitaessa numeroita aluksi.

4. Käytä sisäänrakennettua validointia

Ideaalisti suunnittelijat eivät koskaan saa jotain väärää, mutta se voi tapahtua. Varmista, että kaikki toimii oikein sivulla, käytä AMP: n sisäänrakennettua validointia lisäämällä # kehitys = 1 sivun loppupäähän. Jos avaat Chrome Dev -työkalut ja näet viestin "AMP validation onnistunut", niin kaikki toimii. Jos ei, voit kaivaa syvemmälle, kunnes ongelma ratkaistaan. Voit myös käyttää Chrome-dev-työkaluja varmistaaksesi, että kaikki ulkoiset resurssit, jotka vaihtelevat kuvista ja videoista mukautettuihin fontteihin ja iframeihin, ladataan oikein.

Lisäksi voit vahvistaa metatiedot käyttämällä Googlen strukturoidun datan testaustyökalu , joko hakemalla URL-osoite tai lisäämällä koodinpätkä. Nämä työkalut auttavat varmistamaan, että kaikki on vahvistettu, joten hakukoneiden indeksointi on käytössä. Hakukoneen indeksoinnin huomautuksessa tarkista myös robots.txt-tiedostosi, tarkistaaksesi, että "Disallow: / amp /" ei ole missään rivissä. Jos se on olemassa, indeksoijat eivät voi käyttää AMP-tiedostoja.

5. Toteuta mainoksia AMP: n sisällä

AMP: n toinen etu on jo olemassa oleva kehys mainosten toteuttamiseksi. Amp-ad tai amp-embedded -komponentti on mainosmuodossa oleva kontti. Mainokset ladataan kaikkien muiden resurssien rinnalla mukautettu elementti.

JavaScript ei ole olemassa AMP-asiakirjan sisällä. Sen sijaan AMP lataa iframe-kehyksen iframe-hiekkalaatikosta. Voit määrittää leveyden ja korkeuden arvot , jossa on tyyppi- argumentti, jossa mainosverkosto näytetään. "Src" -attribuutti lataa määritetyn mainosverkoston komentotunnisteen, jolla on erilaisia ​​tietomääritteitä, jotta ne voivat mukautua mainosverkostoihin.

Voit myös asettaa paikanvaraajan tai vaihtoehdon käytettävissä olevalle mainokselle paikkamerkkitietokohdan kautta. Videomainokset ovat mahdollisia myös natiivitukeen, jossa on tarkka mediakomponenttien tuki .

Nopeutetut mobiilisivut auttavat lisäämään hakukoneiden näkyvyyttä mobiilikäyttäjien keskuudessa, varsinkin kun Google hakee AMP-sivuja hakutuloksissaan.

Lisäksi nopeampia latausaikoja, joustavaa personointia ja visuaalisia komponentteja, jotka pyrkivät parantamaan poistumisprosenttia, tekevät paremmasta mobiilikäyttökokemuksesta kuin koskaan.

Nopeutetut mobiilisivut tarjoavat loistavat puitteet mobiiliverkon käyttäjien jatkuvaan kasvuun.