Nyheter i Android, Telefoner, Prylar Och Recensioner

Hur du implementerar Google AMP på din WordPress-webbplats så enkelt som möjligt

Med nyheten att Google kommer att lansera sina Accelerated Mobile Pages (AMP) till alla organiska listor bortom “Top Stories”, skulle du bli förlåten för att du blir lite orolig.

Oroa dig inte. Det finns fem solida skäl till varför du inte ska få panik…

  1. Du har på dig till slutet av året
  2. Google AMP är inte tekniskt en rankningssignal
  3. Det är *ganska* lätt att implementera
  4. Cynikerna bland er kommer förmodligen att ha rätt i att Google bara blir av med allt efter ett år ändå (se: författarskap)
  5. Det finns förmodligen viktigare saker att oroa sig för

Just nu kommer vi dock att fokusera på dessa tre huvudpunkter, för att i slutändan möjliggöra AMP innebär att ge en snabbare, mer användarvänlig upplevelse för mobilsökningsbesökare och är, som jag sa, *ganska* lätt att implementera. Så du kan också prova.

Ja, det borde i alla fall ge den snabbaste, mest användarvänliga mobilupplevelsen på dina icke-AMP-baserade webbsidor. Och ja, Google skulle säkert vara bättre av att främja utbildning om hur man tillhandahåller bättre, snabbare mobilsidor, snarare än att insistera på att webbansvariga implementerar vad som i huvudsak är en snabb lösning.

Men just nu driver Google på AMP, och det är så (efter mycket frustration och bankande huvudet i en bärbar dator) jag framgångsrikt implementerade AMP för min egen sida.

1) Först behöver du…

Detta är mycket specifikt för min egen erfarenhet, och du kan ha en mycket lättare eller mycket svårare väg.

Men om du har en WordPress-webbplats behöver du bara ladda ner ett par plugins och ha tillgång till Search Console. Du kan också behöva tillgång till din värdplattform för webbutveckling om saker och ting inte fungerar korrekt.

Relaterad  YouTube Shorts kommer till USA, men det är ingen TikTok Killer... Ännu

2) Ladda ner insticksprogrammet Automattic AMP…

Vi använde initialt ett PageFrog-plugin som lovade att leverera AMP-innehåll och Facebook Instant Articles i ett bekvämt verktyg. Detta visade sig dock vara omöjligt och misslyckat.

Istället laddar vi ner Automattic AMP-plugin som rekommenderas av Yoast

Automatisk AMP

När du har aktiverat plugin-programmet lägger det till en standardmetatagg i rubriken på dina webbsidor för att hjälpa Google att känna igen att det finns AMP-aktiverade versioner.

Du kan kontrollera detta själv genom att lägga till suffixet /amp/ i slutet av en webbadress på din webbplats.

Detta är en av våra vanliga webbsidor på ditt skrivbord:

svaga webbsidor

Här är samma webbsida på ditt skrivbord med AMP-suffixet:

svaga AMP-sidor

Som du kan se är det väldigt grundläggande grejer. Men frukta inte, vi kan designa det!

3) Ladda ner Yoast Glue-plugin

Yoast har utvecklat ett eget lättanvänt plugin som heter Glue som lägger till stylingalternativ till Automattic plugin.

När du har aktiverat Glue kan du se inställningarna i SEO > AMP > Design. Här kan du ställa in färgerna och typsnitten så att de ligger närmare din ursprungliga skrivbordssida, samt ladda upp din egen logotyp och lägga till din egen anpassade CSS.

Här är ett snabbt exempel på vår AMP-sida efter ett par minuter i installationen…

Snygga tunn AMP-sidametoder

Det är inte perfekt än, men det börjar närma sig.

Därefter måste du kontrollera att Google indexerar dina AMP-sidor korrekt…

Om du inte har Search Console, registrera dig nu eller fråga din webbansvariga om tillåtelse.

När du är inne väljer du din webbplats i instrumentpanelen och klickar sedan Sökutseende > Accelererade mobilsidor.

Irriterande för oss, och fram till för bara några dagar sedan, berättade Google för oss att vi hade 258 AMP-sidor med fel, och detta antal ökade bara ju fler vi publicerade.

Relaterad  Ökar eller minskar volymen automatiskt i Windows 10? Så här åtgärdar du det

Search Console Accelerated Mobile Pages Report

Lyckligtvis tillhandahåller Google ett användbart verktyg för att kontrollera exakt vad orsaken kan vara.

5) Kör AMP-valideringsverktyget

Som du kan se har vi ett problem med “användarskapat Java-skript” som kan blockera Google från att indexera AMP-innehåll.

Klicka på det specifika problem du behöver åtgärda…

kartfel

Detta tar dig till en lista med webbsidor full av fel. Klicka på första sidan…

amop-sidor misslyckas

Du kommer nu att se ett tvåstegsverktyg för att upptäcka dina fel.

valideringsverktyg

1) Den tar dig till en hjälpsida med HTML-referensen för AMP.

2) Det kommer att köra valideringsverktyget för att testa för fel.

Klicka på siffran 2. Detta visar HTML-koden för webbsidan och pekar ut exakt var den misslyckas.

AMP misslyckas

För oss är det den där knepiga delen av Javascript som nämns ovan.

Att läsa koden avslöjade dess ursprung. Ett rapporteringsverktyg som heter New Relic, som vi hade aktiverat via vår Pantheon webbutvecklingsserver.

Det var helt vårt fel. Vi aktiverade det och insåg inte att Javascriptet som det placerade i vår HTML skulle blockera AMP.

Allt som krävdes för att åtgärda problemet var att logga in på Pantheon och inaktivera New Relic.

På några dagar såg vi en förbättring. Och efter ungefär sex dagar har vi nu 328 AMP-sidor indexerade! Se bara hur dessa bäckar korsar…

amp sidkontroll

Dessutom har de 67 sidorna som visar fel ännu inte indexerats. När jag kör valideringsverktyget visas de tydligt.

Så nu återstår bara att luta sig tillbaka och vänta på att AMP-sidor ska visas i organiska resultat och på att vår nya mobil-första målgrupp kommer.

*sätter sig med tummarna, tittar ut genom fönstret, suckar*