Startpagina » Coding » Hoe versnelde mobiele pagina's (AMP) te valideren

    Hoe versnelde mobiele pagina's (AMP) te valideren

    In onze laatste AMP-zelfstudie hebben we u laten zien hoe u AMP (Accelerated Mobile Pages) kunt gebruiken om een ​​aanzienlijke snelheidsverhoging en een betere bekendheid te krijgen in het mobiele zoekresultaat van Google voor uw website in de mobiele omgeving.

    Gezien hebben AMPpotentieel, ik neem aan dat je misschien bent begonnen of plannen hebt om wijzigingen aan te brengen in je websites om hieraan te voldoen AMP. Volg de richtlijnen in Documenten zorgvuldig en stel uw CSS samen om de AMP-pagina's op uw visuele eetlust af te stemmen.

    Nu is er nog een laatste ding om te doen: die pagina's valideren.

    AMP Validators

    Er zijn verschillende manieren om uw AMP-pagina's te valideren:

    1. Voeg toe in de # Ontwikkeling = 1 sleep aan het einde van de URL van de AMP-pagina. Het rapport zal worden geprojecteerd in de Troosten tab onder DevTools.
    2. Als alternatief kunt u de online AMP-validator gebruiken.
    3. U kunt ook de Chrome AMP-extensie gebruiken.

    Deze hulpmiddelen zullen een rapport opleveren met fouten of waarschuwingen op de pagina's. Op basis hiervan kunt u kiezen wat u wilt oplossen.

    AMP-foutrapport in DevTools Console.

    AMP-validatie is primair van toepassing het gebruik van HTML-elementen, de s, en de stijlverklaringen. Zorg ervoor dat deze dingen op de pagina allemaal AMP-compatibel zijn en dat niets dat de AMP-richtlijnen schendt, daar wordt achtergelaten. Anders wordt uw AMP-pagina nergens weergegeven.

    Data structuur

    AMP vereist ook de Schema-gegevensstructuur. Deze gegevens zijn uiteengezet binnen de hoofd tag van de pagina in JSON-formaat. Het bevat contextuele informatie van de pagina inclusief de titel, het uitgeverslogo en de naam, de datum waarop het werd gepubliceerd en gewijzigd, enz..

    Afhankelijk van het doel van de pagina kunnen de gegevens die moeten worden opgenomen variëren: artikelen, recensies, recepten, video's, enzovoort. U kunt de documentatie voor Google-gegevenstypen raadplegen voor meer informatie over het gegevenstype.

    Er zijn enkele gegevens vereist die fouten opleveren als ze niet worden geleverd; een paar andere soorten gegevens zijn optioneel en geven alleen waarschuwingen. Dit type fouten komt echter niet voor in de bovengenoemde AMP-validators.

    In plaats daarvan worden ze weergegeven in de Google-tool voor het testen van gestructureerde gegevens en in uw Google Webmasters-account.

    AMP-consumenten of een client die AMP ondersteunt, zoals Google Search en Twitter Moments, kunnen deze gegevensset gebruiken om AMP-inhoud weer te geven op hun resultatenpagina.

    AMP-carrousel in Google SERP

    Dus naast het volgen van AMP-richtlijnen met hun eigen aangepaste HTML-elementen, moeten de vereiste Schema-gegevens ook aanwezig zijn.

    Overlooked Errors

    De meeste fouten worden expliciet in Documenten genoteerd en kunnen gemakkelijk in een oogopslag worden opgepikt. Een paar fouten echter zijn gecontextualiseerd met variabelen die we misschien niet zullen opmerken, zoals de “Ongeldige attribuutwaarde”, waarop staat "Het kenmerk '% 1' in tag '% 2' is ingesteld op de ongeldige waarde '% 3'.".

    Dit foutenrapport vermeldt of vermeldt niet precies welke waarde is ongeldig . Maar wat ik wel weet, is dat we de breedte en de hoogte van element voor 100% of auto. Deze attribuutwaarden moeten de exacte grootte van de afbeelding zijn om de beeldverhouding te behouden.

    Dit is slechts een voorbeeld. Er zijn een aantal aangepaste elementen - amp-img, amp-iframe, en amp-advertenties - met hun eigen sets validatieregels tegen het gebruik van een attribuut en de waarde ervan.

    Dit kan een validerende AMP-pagina tot een ontmoedigende taak maken, vooral als we rekening houden met honderden of (misschien) duizenden oudere inhoud die jaren geleden is gepubliceerd.

    Laatste gedachte

    AMP bevindt zich nog in de kinderschoenen. Het is in een zeer actieve ontwikkeling met gemeenschappelijke inspanningen van Google en de gemeenschap voor webontwikkeling. Maar AMP zal zeker evolueren. Net als bij HTML5 kunnen er elementen, attributen en sommige praktijken zijn die in de toekomst zullen verdwijnen. Zo zorg ervoor dat uw AMP-pagina's van tijd tot tijd voortdurend worden gevalideerd gebaseerd op de laatste wijzigingen in de richtlijnen.