Hemsida » Kodning » Hur man validerar accelererade mobilsidor (AMP)

    Hur man validerar accelererade mobilsidor (AMP)

    I vår senaste AMP-handledning har vi visat dig hur du adopterar AMP (Accelerated Mobile Pages) för att få en betydande hastighetsökning samt bättre exponering i Googles mobila sökresultat för din webbplats i mobilmiljön.

    Har sett AMPpotential, antar jag att du kanske har börjat eller har planer på att börja göra ändringar på dina webbplatser för att följa AMP. Följ noggrant riktlinjerna på dokumenten och komponera din CSS för att utforma AMP-sidorna för att passa din visuella aptit.

    Nu finns det en sista sak att göra: att validera dessa sidor.

    AMP Validators

    Det finns flera sätt att validera dina AMP-sidor:

    1. Lägg till i # Utveckling = 1 spår i slutet av AMP-webbadressen. Rapporten kommer att projiceras i Trösta fliken under DevTools.
    2. Alternativt kan du använda den elektroniska AMP-valideraren.
    3. Du kan också använda Chrome AMP-tillägget.

    Dessa verktyg kommer att skapa en rapport som anger fel eller varningar inom sidorna. Baserat på detta kan du välja vad som ska åtgärdas.

    AMP-felrapport i DevTools Console.

    AMP-validering styr primärt användningen av HTML-element, de s, och den stildeklarationer. Se till att dessa saker på sidan är alla AMP-kompatibla, och att ingenting som bryter mot AMP-riktlinjerna finns kvar där. Annars kommer din AMP-sida inte att visas någonstans.

    Datastruktur

    AMP kräver också Schema-datastrukturen. Denna data är uppbyggd inom huvud tagg av sidan i JSON-format. Den innehåller kontextuell information om sidan, inklusive titeln, förlagets logotyp och namn, datumet publicerades och ändrats, etc.

    Beroende på syftet med sidan kan de uppgifter som ska inkluderas variera: Artiklar, recensioner, recept, videor etc. Du kan referera till dokumentation för datatyper i Google för detaljer om datatyp.

    Det krävs några data som kommer att ge upphov till fel om de inte levereras. några andra typer av data är frivilliga och kommer endast att producera varningar. Dessa typer av fel kommer emellertid inte att visas i ovannämnda AMP-validerare.

    I stället visas de i Google Structured Data Testing Tool samt på ditt Google Webmasters konto.

    AMP-konsumenter eller en klient som stöder AMP, som Google Search och Twitter Moments, kan använda den här uppsättningen data för att presentera AMP-innehåll på deras resultatsida.

    AMP karusell i Google SERP

    Så, förutom att följa AMP-riktlinjer med deras egna egna HTML-element, måste de nödvändiga Schema-data vara på plats också.

    Förbises fel

    De flesta fel noteras i dokumenten explicit och kan enkelt hämtas i en glimt. Några fel är dock kontextualiserade med variabler som vi kanske misslyckas med att märka som “Ogiltigt attributvärde”, som säger "Attributet '% 1' i taggen '% 2' är inställt på det ogiltiga värdet '% 3'.".

    Denna felrapport nämner inte eller listas exakt vilket värde är ogiltig . Men det jag vet är att vi inte kan ställa in bredd och den höjd av element till 100% eller bil. Dessa attributvärden måste vara den exakta storleken på bilden för att bevara bildförhållandet.

    Detta är bara ett exempel. Det finns ett antal anpassade element - amp-img, amp-iframe, och amp-annonser - med sina egna uppsättningar av valideringsregler mot användningen av ett attribut och dess värde.

    Detta skulle kunna göra att AMP Page är en skrämmande uppgift, särskilt om vi tar hundratals (eller kanske) tusentals äldre innehåll som publicerats år sedan.

    Slutlig tanke

    AMP är fortfarande i sitt tidiga skede. Det är i väldigt aktiv utveckling med gemensamma ansträngningar från Google och webbutvecklingsgemenskapen. Men AMP kommer säkert att utvecklas. På samma sätt som HTML5 kan det finnas element, attribut och vissa metoder som kommer att avskrivas i framtiden. Så se till att dina AMP-sidor ständigt valideras från tid till annan baserat på de senaste ändringarna av riktlinjerna.