Sådan valideres accelererede mobile sider (AMP)

I vores sidste vejledning i AMP har vi vist dig, hvordan du vedtager AMP (Accelerated Mobile Pages) for at opnå en betydelig hastighedsforøgelse samt bedre eksponering i Googles mobilsøgningsresultat til dit websted i mobilmiljøet.

Have set AMPpotentiale, antager jeg, at du måske har startet eller har planer om at begynde at lave ændringer på dine hjemmesider for at overholde AMP. Følg retningslinjerne på Dokumenterne nøje og komponer dit CSS for at formatere AMP-siderne for at passe til din visuelle appetit.

Nu er der en sidste ting at gøre: validering af disse sider.

AMP Validators

Der er flere måder at validere dine AMP-sider på:

1. Tilføj i # Udvikling = 1 sporet i slutningen af ​​AMP-siden URL. Rapporten vil blive projiceret i konsol faneblad under DevTools.
2. Alternativt kan du bruge online AMP-validatoren.
3. Du kan også bruge Chrome AMP-udvidelsen.

Disse værktøjer vil producere en rapport, der angiver fejl eller advarsler inden for siderne. Baseret på dette kan du vælge, hvad der skal løses.

AMP validering styrer primært brugen af ​​HTML-elementer, det s, og stil erklæringer. Sørg for, at disse ting på siden er alle AMP-kompatible, og at intet der overtræder AMP-retningslinjer, er tilbage der. Ellers vises din AMP-side ikke overalt.

Datastruktur

AMP kræver også Schema datastrukturen. Disse data er lagt ud i hoved tag på siden i JSON format. Den indeholder kontekstuelle informationer om siden, herunder titlen, udgiverlogoen og navnet, datoen den blev offentliggjort og ændret mv..

Afhængigt af formålet med siden kan de forskellige data variere: Artikler, Anmeldelser, Opskrifter, Videoer osv. Du kan henvise til Google Data Types Documentation for detaljer om datatype.

Der kræves nogle data, som vil medføre fejl, hvis de ikke leveres; Et par andre typer data er valgfrie og vil kun producere advarsler. Disse typer af fejl vil dog ikke blive vist i de førnævnte AMP-validatorer.

I stedet vises de i Google Structured Data Testing Tool såvel som i din Google Webmasters-konto.

AMP-forbrugere eller en klient, der understøtter AMP, såsom Google Search og Twitter Moments, kan bruge dette sæt data til at præsentere AMP-indhold på deres resultatside.

Så bortset fra at følge AMP retningslinjer med deres proprietære brugerdefinerede HTML elementer, skal de nødvendige Schema data også være på plads.

Overset fejl

De fleste fejl bemærkes eksplicit i Dokumenterne og kan let hentes i et glimt. Et par fejl er dog kontekstualiseret med variabler, som vi måske undlader at lægge mærke til som f.eks “Ugyldig attributværdi”, som siger "Attributten '% 1' i tag '% 2' er indstillet til den ugyldige værdi '% 3'.".

Denne fejlrapport nævner ikke eller listes nøjagtigt hvilken værdi er ugyldig . Men hvad jeg ved er, at vi ikke kan sætte bredde og højde af element til 100% eller auto. Disse attributværdier skal være den nøjagtige størrelse af billedet for at bevare billedforholdet.

Dette er blot et eksempel. Der er en række brugerdefinerede elementer - amp-img, amp-iframe, og amp-annoncer - med deres egne sæt af valideringsregler mod brug af en attribut og dens værdi.

Dette kunne gøre validering af AMP Page en skræmmende opgave, især hvis vi tager hundreder eller (måske) tusindvis af ældre indhold ud for år siden.

Endelig tanke

AMP er stadig i sin tidlige fase. Det er i meget aktiv udvikling med fælles indsats fra Google og webudviklingssamfundet. Men AMP vil helt sikkert udvikle sig. På samme måde som HTML5 kan der være elementer, attributter og nogle fremgangsmåder, der vil deprecere i fremtiden. Så Sørg for, at dine AMP sider løbende valideres baseret på de seneste ændringer i retningslinjerne.