AMP: kuidas kiirendada veebi laadimist mobiilseadmetele


Aasta alguses räägime selle 2017i SEO uudistes AMP-st ja selle massist SEO-s seoses mobiilseadmete veebisaitide laadimiskiiruse optimeerimisega. osta YouTube'i vaateid

AMP jah või ei?

Kõlav jah, võttes arvesse, et AMP-i lehtede versioonid vähendavad veebisaidi sisu miinimumini, nii et need laaditakse kiiremini kui kunagi varem.

Seega, kui Google soovitab AMP-d kasutada, peaksime sellele kindlasti tähelepanu pöörama. Eriti seetõttu, et see aitab meil parandada SERP-ide tulemusi.

Kuidas rakendada AMP WordPressi ajaveebis

Teie ajaveebi ühildamine AMP-ga on äärmiselt lihtne. Peate lihtsalt alla laadima pistikprogrammi, mis muudab selle ühilduvaks, ilma et peaksite täiendavaid seadistusi tegema. Laske see lihtsalt installida ja pistikprogramm hoolitseb ülejäänu eest automaatselt ja ilma, et peaksite selle vastu midagi tegema. Seejärel jätame lingid kahele seda funktsiooni täitevale pistikprogrammile.

Kuidas rakendada veebisaidil AMP-d

Veebilehel ei ole see nii lihtne kui teie WordPressis, kuna see on käsitsiprotsess ja seetõttu keerulisem ja delikaatsem.

Peame looma AMP versioonid igast viimasest lehest (toode, uudised, maandumised ...), mis on asjakohased Google'i ja mobiilikasutajate jaoks. Mis esitatakse koos teise URL-iga ja mis sisaldab teie koodis konkreetset HTML-märgendit.

An Lehe AMP-versioon on üks, mis:

  • Kõrvaldab rasked elemendid, näiteks pildid, iframe’id, vormid, või välistab nende kasutamise ... teabe edastamine lõppkasutajatele ei ole vajalik. Javascripti kasutamise võimaluse täielik kaotamine .
  • Ta kasutab oma HTML-koodis konkreetseid silte, et tuvastada see AMP-versioonina. Näiteks: asemel sina kasutaks  .

Lisaks stiililehtedel on oma piirangud AMP versioonis:

  • Väliseid stiililehti (CSS) ei saa kasutada.
  • CSS peab asuma ühes ja konkreetses AMP-spetsiifilises sildis: 
  • CSS-i reeglid nagu @import ja ! Tähtis täielikult kasutada keelatud .

Lehe kohandamine AMP-ga

Ülaltoodut arvesse võttes kahekordistame oma lehe ja redigeerime selle HTML-koodi, et muuta see AMP-ks.

Samm sammu haaval:

  • The silt peab olema olemas ja esiteks.
  • Siis muudame sildi ühele sellisele: , nagu näete, osutame lisaks sellele, et see on amp-leht, ka keele.
  • Toas alustame märgendist 
  • Vahetult pärast seda tutvustame järgmist raamatukogu:   .
  • Kopeeriva sisuga SEO probleemide vältimiseks on oluline sisestada a  silt, mis osutab teisendatava algse lehe URL-ile. See on oluline või Google karistab meid paremate positsioonidega premeerimise asemel.
  • Optimeerime sisu kuvamise seadme eraldusvõimele: 
  • Tutvustame CSS-i stiile   silt
  • Enne on oluline kopeerida ja kleepida järgmine kood, mis sisaldab konkreetseid stiile, mis on seotud lehe sisu visualiseerimisega.

Here the CSS styles (font types and sizes, colors …

body {-webkit-animation: -amp-start 8s steps (1, end) 0s 1 normal both; -moz-animation: -amp-start 8s steps (1, end) 0s 1 normal both; -ms-animation: -amp-start 8s steps (1, end) 0s 1 normal both; animation: -amp-start 8s steps (1, end) 0s 1 normal both} @ – webkit-keyframes -amp-start {from {visibility: hidden} to {visibility: visible}} @ – moz-keyframes -amp-start {from {visibility: hidden} to {visibility: visible}} @ – ms-keyframes -amp-start {from {visibility: hidden } to {visibility: visible}} @ – o-keyframes -amp-start {from {visibility: hidden} to {visibility: visible}} @ keyframes -amp-start {from {visibility: hidden} to {visibility: visible} } body {-webkit-animation: none; -moz-animation: none; -ms-animation: none; animation: none}

Need on põhiprotseduurid konkreetse lehe loomiseks AMP-s, järgides alati AMP-lehe alguses märgitud nõudeid. Kuid võime lisada ka schema.org metaandmed, mis tuvastavad lehe sisu: artikkel, uudised, blogipostitus ...

Soovitame teil külastada AMP projekti lehte ja avastada palju muud: 

Kas kasutate juba AMP-d? Kas olete märganud muudatusi SERP-i indekseerimises?