Kiirendatud mobiililehed: AMP WordPressi mobiilside optimeerimiseks

WordPressi kiirendatud mobiililehed

Internetis surfamine ja sirvimine peaks olema kiire ja lihtne. Veebimeistrid üritavad seda pidevalt veebisaidi toimivuse optimeerimise ja saidi kiiruse parandamise kaudu võimaldada ning suurepärane viis selle saavutamiseks on WordPressi abil loodud AMP.


Veebisaidid olid mõeldud peamiselt suurema ekraaniga kuvamiseks. Kuid väiksemate ekraanide arv kasvab ja isegi ületab sülearvuteid ja personaalarvuteid. Mobiilid esindavad nüüd 65% digitaalse meedia ajast. Käeshoitavad seadmed vajavad lehtede laadimist sama kiiresti kui suurematel ekraanidel, kui mitte kiiremini.

Sisu kiire laadimise nõudluse rahuldamiseks on konkreetsetele mobiilplatvormidele mõeldud rakendused saadaval Apple’is (Uudised), Facebookis (Instant Artiklid) ja Snapchatis (Avasta). Selle aasta alguses. Google tutvustas kiirendatud mobiililehte (AMP), et kiirendada mobiilisisu edastamist ja pakkuda paremat kasutajakogemust.

Mis on AMP?

AMP WordPressi jaoks: AMP projekt

AMP projekt kuulutas välja Google oktoobris 2015, ja see valmib 2016. aasta veebruaris. See on avatud lähtekoodiga algatus, mis annab kirjastajatele vahendid mobiilseadmetele optimeeritud sisu loomiseks üks kord ja selle koheseks laadimiseks mobiilsesse veebi..

24. veebruaril 2016 alustas Google nende mobiilse otsingutulemite lehel karussellis AMP-iga ühilduva sisu juurutamist. Kasutajad saavad karusselli libistada ja puudutada üksust, mida nad tahavad lugeda. Pinterest teatas, et lehed on 4 korda kiiremini, kasutades 8 korda vähem andmeid kui tavalised mobiilile optimeeritud lehed. See on võimalik lehtede vormindamise ja kättetoimetamise viisi tõttu.

2016. aasta augusti seisuga on Google’i otsingus üle 150 miljoni AMP-dokumendi ja see kasvab kiirusega 4 miljonit nädalas. Augusti alguses alustas Google ka a Google’i otsingu eelvaade ampeeritud sisuga. Laiemalt loodab ta selle rakendada hiljem sel aastal.

AMP WordPressi jaoks: AMP otsingu eelvaade

AMP otsingu eelvaates

Saate pilguheit kiire laadimisega lehtedele AMP-toega otsingus siin. Vaadake seda oma mobiiltelefoni lingi kaudu (ei tööta lauaarvutites).

Millised veebisaidid peaksid AMP-d kasutama??

Veebruaris algatati projekt kirjastajate jaoks. Kuid AMP kasutuselevõtt on laialt levinud kirjastustööstuses meelelahutuse, reisimise, e-kaubanduse ja mujal.

Varastelt kasutuselevõtjatelt saadakse soodsaid teateid. AMP-dokumentide laadimisaeg on 88% paranenud, Washington Post teatab mobiiltelefonidest naasvate kasutajate arvu kasv 23%. eBay on üks suuremaid e-kaubanduse ettevõtteid, kes on AMP-ile üle minemas ja millel on ligi 15 miljonit AMP-põhist toote sirvimislehte. Lühikese aja jooksul loodetakse neid lehti üles leida, et need otsingu käigus avastada.

Millised veebisaidid peaksid AMP-d kasutama? Kindlasti need, mis sõltuvad liikluses suuresti mobiilist. Kuid arvestades, et üha enam kasutajaid otsustavad Interneti-sirvimiseks kasutada oma mobiilseadmeid, võib WordPressi (või mis tahes veebisaidi) AMP olla heaks lisandiks.

Mis erineb AMP-st?

See sisu edastamise süsteem põhineb AMP HTML-i raamistikul ja on tavalisest HTML-ist kiirem, kuna,

  • See on tavalise HTML-i raamistiku lahja versioon, millest on lahutatud kogu JavaScripti sisu. JavaScripti puhul tugineb raamistik ühisele AMP JS-i teegile.
  • Sisu on vahemällu salvestatud ja ühisesse pilve salvestatud, nii et serverilt päringute tegemiseks ja serverisse toomiseks kuluv aeg on välistatud.

Erinevusi on palju rohkem, kuid siin mainitud kaks peaksid andma teile kiire ja laialdase mõistmise.

Miks peaksid kirjastajad ja ajaveebid AMP-d lubama

Kuni mobiiltelefonide aeglase laadimisega lehtede lugemine jääb kasutajatele heidutavaks kogemuseks, kaotavad kirjastajad mobiiltelefonide reklaamist saadavat tulu. AMP aitab külastajaid pikema aja jooksul veebisaidile tuua ja neid hoida ning sellel on potentsiaalne teenida klikke.

AMP-lehed ilmuvad välgu ikooni kõrvale, et neid tavalistest veebilehtedest välja tuua. Sellel suvandil klõpsanud vaatajad suunatakse otse AMP-vaaturi AMP-lehtedele. Lisaks sellele on sisu koheselt saadaval Google’i otsingus ja juurdepääsetav sotsiaalsete platvormide kaudu nagu Twitter, LinkedIn, WordPress, Parse.ly, Adobe Analytics, Nuzzel ja Pinterest.

Lisaks on kirjastajatel juurdepääs Google Analyticsile, et jälgida nende lehtede toimimist. Nad saavad oma parima sisu välja tuua ja kasutada seda veebisaidi toimivuse ja kasutajakogemuse optimeerimiseks.

AMP pakub veel ühte eelist, kuna see hoolitseb suure jõudluse ja kasutajakogemuse eest, nii et avaldajate ressursid saavad keskenduda suurepärase sisu pakkumisele.

Milliseid optimeerimisi on AMP jaoks vaja?

AMP on tegelikult terve rida veebisaidi optimeerimisi tehtud ühtlaselt, nagu nõuab Google. Erinevad optimeerimised, mida peate tegema veebilehe AMP-iga ühilduvaks, on järgmised,

  • Luba ainult asünkroonne JavaScripti – selleks, et see ei viivitaks lehe renderdamisega. See tähendab, et te ei saa kasutada ühtegi teie loodud JavaScripti ja oma lehtede interaktiivse sisu haldamiseks peate toetuma AMP elementidele. JS on iframe’is lubatud, kuid ainult siis, kui see ei takista renderdamist.
  • Kõigi ressursside suurus staatiliselt – AMP laadib lehe, ootamata ressursside, näiteks piltide ja iframeide allalaadimist. Nende ressursside suurus tuleb avaldada HTTP-s, seega on nende ressursside suurus ja asukoht teada enne allalaadimise algust.
  • Ärge laske laiendusmehhanismidel renderdamist blokeerida – kui lehele soovitakse lisada mõni laiend, peab kohandatud skript süsteemi sellest teavitama. Nii luuakse laiendi jaoks ruum, isegi enne, kui AMP teab, mida see hõlmab. Valguskastide, Instagrami manustuste ja säutsude laiendused on korras, kuna need ei blokeeri lehe renderdamist, ehkki see nõuab täiendavaid HTTP-taotlusi.
  • Hoidke kõigi kolmandate osapoolte JavaScripti kriitilisest teest eemal – kohandatud JavaScripti kasutamine on lubatud ainult liivakastiga raamides. Nii ei blokeeri see pealehe laadimist.
  • Kõik CSS-id peavad olema seotud ja suurusega – see aitab vähendada HTTP-taotluste arvu kriitilisel teel.
  • Fondi vallandamine peab olema tõhus– AMP-süsteem ei luba HTTP-päringuid enne, kui fondid hakkavad alla laadima.
  • Minimeerige suuruse ümberarvutused – ümberarvutused viivitavad renderdamist, seega tuleb seda hoida minimaalsena.
  • Käitage ainult GPU-ga lubatud animatsioone – kõiki animatsioone peab olema võimalik GPU-ga (graafiline protsessor) kasutada.
  • Prioriteediks ressursside laadimine – Esmalt laaditakse ainult vajalik sisu, reklaamid ja pildid tõmmatakse nii kiiresti kui võimalik, kuid laaditakse ainult vajaduse korral. Nii hoitakse protsessori nõudlust minimaalsena.
  • Laadige lehti hetkega – eelrenderdamine võtab palju ribalaiust ja protsessorit. AMP eel Renderdamine laadib kõigepealt ainult vajaliku sisu ja laadib alla ainult kolmanda osapoole raamid ja muud ressursid ainult vajadusel.

Saadaval on standardsed reklaamivormingud, reklaamivõrgud ja -tehnoloogiad. Samal ajal saavad kirjastajad valida ka oma vormingud, kui see ei kiirusta kiirust.

Kuidas lisada WordPressile AMP

Google’il on juhendaja millele saate viidata põhiliste AMP HTML-lehtede loomiseks, nende järjestamiseks, nende AMP-iga ühilduvuse kinnitamiseks, avaldamiseks ja levitamiseks. AMP-lehtede valideerimine on oluline, sest nii on kolmandad osapooled, nagu Twitter ja Instagram, kindlad, et lehti kuvatakse nende platvormidel hästi.

Mis puutub WordPress.com-i hostitavatesse veebisaitidesse, siis toetatakse neid WordPressi jaoks automaatselt, ilma et nad peaksid midagi enamat tegema. Isetehtud WordPressi veebisaidid saavad pistikprogrammi installimisega lubada WordPressi AMP-d.

Automatticu plugin AMP WordPress

Automatticu plugin AMP WordPress

Kui olete alla laadinud, installige ja aktiveerige AMP pistikprogramm WordPressi veebisaidil on teie postitustel automaatselt dünaamiliselt loodud AMP-versioon. Nendele lehtedele pääsete juurde lisades amp oma URL-i lõpus (näide.com/my-post/amp). Kui teil pole päris püsilinke lubatud, lisage ?amp = 1 linkidele (mis näeks välja näiteks example.com/?p=100&amp=1). Ainus teine ​​samm on oma lehtede testimine ja kinnitamine, nagu eespool mainitud.

Te ei märka selle pistikprogrammi korral üldse seadeid ega funktsioone. AMP Analyticsi jaoks on üks lisatud juhtpaneeli variant, kuhu saate kleepida oma JSON-i konfiguratsioonikoodi, kuid see on kõik inimesed.

See pistikprogramm on Automattici talli ametlik pistikprogramm ja praegu ei toeta see lehti ega arhiive ning te ei saa neid lehti kohandada. Kuid see on väga lihtne ja hõlpsasti kasutatav võimalus ning leiate siit juhiseid dokumentatsioon Githubi kohta kohandamiseks.

AMP WP jaoks – kiirendatud mobiililehed

AMP WP tasuta WordPressi pistikprogrammi jaoks

Veel üks suurepärane tasuta võimalus on AMP WP jaoks. See tasuta WordPressi pistikprogramm pakub kiiret ja hõlpsat seadistamist – lihtsalt installige, lubage sätted ja alustage oma veebisaidile automaatselt AMP-i genereerimist. Boonus – see pistikprogramm ühildub ka mitme saidiga.

Seal on sisseehitatud seaded AMP lubamiseks (postitused, lehed, arhiivid), mobiilireklaamide alade lisamine, struktureeritud andmed (SEO oluline osa), Yoast SEO metamärgendite integreerimine, täpsemad indeksi / indeksita valikud, tõuketeade, native AMP kommenteerimine, kohandatud AMP tõlked (kui kasutate muud keelt kui inglise keel, siis soovite seda värskendada) ja palju muud. Seadistused on tasuta pistikprogrammi jaoks väga põhjalikud, mis on fantastiline.

Mis kõige parem, see pistikprogramm pakub disainivalikuid, nii et saate oma AMP-väljundi ilmet ja kohandada. Kasutage kaasasolevaid AMP-teemasid või kasutage neid AMP teemaraamistik luua omalaadne kujundus.

Samuti pakub AMP for WP lisatasu laiendid funktsioonide (nt kutse tegevusele või AMP vahemällu salvestamine) ja populaarsete pistikprogrammide (sh WooCommerce, Advanced Custom Field ja Contact Form 7) tugi.

Veel viise AMP lisamiseks WordPressile

Muidugi pole see ainus viis AMP lisamiseks oma WordPressi toega veebisaidile. Muud pluginad, mis võivad teid aidata WordPressi veebisaitide AMP-i kasutamisel, hõlmavad järgmist:

  • WP AMP – kohandatud AMP-kujunduse loomine ilma kodeerimiseta ja SEO täiustamiseks. Selle kohta saate rohkem lugeda siit.
  • Kiirendatud mobiililehed (AMP) WordPressile – oma veebisaidi jaoks AMP-teema loomine.
  • Kohandatud AMP – teie AMP sisu kohandamiseks.
  • Facebooki kiired artiklid ja Google AMP lehed – oma sisu avaldamiseks ja haldamiseks otse WordPressist Google’i AMP lehtedele koos reklaamide ja analüüsi toega.
  • Liim pärmi SEO ja AMP jaoks – tagada, et WordPressi vaikepistikprogramm kasutab õigeid Yoast SEO metaandmeid ja võimaldab muuta AMP lehe kujundust.

Kas peaksite WordPressile lisama AMP??

Ehkki AMP pole Google’i poolt veebilehtede avastamiseks kohustuslik, on üsna ilmne, et Google kavatseb lõpuks rakendada AMP projekti laiemalt. Praegu ei ole AMP-le vastavus eraldi tegur Google’i otsingu paremusjärjestus. Kuigi on mõistlik eeldada, et see on mingil hetkel oluline,

Kui arvestate sellega, et lehe laadimise kiirus on tegur otsimootorite paremusjärjestuses, pole teil tegelikult palju valikut, kui soovite olla osa mobiilsest internetist. Kui otsingumootori paremusjärjestus on teie jaoks oluline, võivad kaduda kõik teised mõtted AMP-tee käimiseks.

Kuid projekti osaliseks on vaja rangelt järgida Google’i nõutavat vormingut ja see ei pruugi olla kõigi tass. See piirab seda, mida saate oma veebisaidile panna, ja see võib muuta kõik ajaveebid mõnevõrra ühetaolisteks ja neil puudub individuaalsus. Mõni animatsioon pole lubatud ja vorme ei toetata. Ja niipalju kui maandumislehti läheb, ei pruugi AMP üldse hea mõte olla. Lisaks võib leiduda veebisaite, mis rõhutavad esteetikat ja kaubamärgi ületanud kiirust, kelle jaoks AMP võib osutuda summutajaks.

Kui soovite aga oma kasutajatele kiiret ja kaasahaaravat kogemust luua ning lasta neil end pikemaks muuta, peate tõsiselt kaaluma WordPressi (või mis tahes muud tüüpi veebisaidi, mida võiksite kasutada) AMP-d. Kui see on mõni koht Google’i otsingulehtede AMP-karussellil, mida soovite nurgata, liikuge edasi AMP-i vagunisse.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map