Jak weryfikować przyspieszone strony mobilne (AMP)

W naszym ostatnim samouczku AMP pokazaliśmy, jak zaadoptować AMP (Accelerated Mobile Pages), aby uzyskać znaczny wzrost prędkości, a także lepszą ekspozycję w wynikach wyszukiwania mobilnego Google dla Twojej witryny w środowisku mobilnym.

Ujrzawszy AMPPotencjał, zakładam, że mógłbyś zacząć lub planować zacząć wprowadzać zmiany w swoich witrynach AMP. Ostrożnie postępuj zgodnie ze wskazówkami na Dokumentach i skomponuj swój CSS, aby dopasować strony AMP do swojego apetytu wizualnego.

Teraz jest jeszcze jedna rzecz do zrobienia: sprawdzenie poprawności tych stron.

Walidatory AMP

Istnieje kilka sposobów sprawdzania poprawności stron AMP:

1. Dodaj w # development = 1 ślad na końcu adresu URL strony AMP. Raport będzie wyświetlany w Konsola zakładka w DevTools.
2. Alternatywnie możesz skorzystać z internetowego walidatora AMP.
3. Możesz także użyć rozszerzenia Chrome AMP.

Narzędzia te wygenerują raport zawierający błędy lub ostrzeżenia na stronach. Na tej podstawie możesz wybrać, co naprawić.

Walidacja AMP dotyczy przede wszystkim wykorzystanie elementów HTML, s, i deklaracje stylu. Upewnij się, że te elementy na stronie są zgodne ze standardem AMP i że nic, co narusza wytyczne AMP, nie zostało tam pozostawione. W przeciwnym razie strona AMP nie pojawi się nigdzie.

Struktura danych

AMP wymaga również struktury danych schematu. Te dane są określone w głowa tag strony w formacie JSON. Zawiera informacje kontekstowe strony, w tym tytuł, logo wydawcy i nazwę, datę opublikowania i modyfikacji itp..

W zależności od celu strony dane, które należy uwzględnić, mogą się różnić: artykuły, recenzje, przepisy, filmy itp. Informacje o typie danych można znaleźć w dokumentacji typów danych Google.

Wymagane są pewne dane, które będą powodować błędy, jeśli nie zostaną dostarczone; kilka innych typów danych jest opcjonalnych i generuje tylko ostrzeżenia. Tego typu błędy nie pojawią się jednak w wyżej wymienionych walidatorach AMP.

Zamiast tego pojawią się w Narzędziu do testowania danych strukturalnych Google, a także na koncie webmasterów Google.

Konsumenci AMP lub klient obsługujący AMP, taki jak wyszukiwarka Google i chwile Twittera, mogą wykorzystać ten zestaw danych do prezentacji treści AMP na swojej stronie wyników.

Tak więc, oprócz przestrzegania wytycznych AMP wraz z zastrzeżonymi niestandardowymi elementami HTML, wymagane dane schematu muszą być również na miejscu.

Błędy pomijane

Większość błędów jest wyraźnie widocznych w Dokumentach i można je łatwo zobaczyć w mgnieniu oka. Kilka błędów jest jednak kontekstualizowanych za pomocą zmiennych, których możemy nie zauważyć, takich jak “Nieprawidłowa wartość atrybutu”, który mówi „Atrybut„% 1 ”w znaczniku„% 2 ”jest ustawiony na niepoprawną wartość„% 3 ”.”.

Ten raport o błędzie nie wymienia ani nie wymienia dokładnie która wartość jest nieważny . Ale wiem, że nie możemy ustawić szerokość i wysokość z element do 100% lub automatyczny. Te wartości atrybutów muszą być dokładnym rozmiarem obrazu, aby zachować współczynnik obrazu.

To tylko przykład. Istnieje wiele niestandardowych elementów - amp-img, amp-iframe, i amp-reklamy - z własnymi zestawami reguł walidacji przeciwko użyciu atrybutu i jego wartości.

Może to sprawić, że walidacja strony AMP stanie się trudnym zadaniem, zwłaszcza jeśli weźmiemy pod uwagę setki lub (być może) tysiące treści starszych opublikowanych przed laty.

Końcowa myśl

AMP jest wciąż na wczesnym etapie. Jest bardzo aktywnie rozwijany dzięki wspólnym wysiłkom Google i społeczności programistów. Ale AMP z pewnością ewoluuje. Podobnie jak w HTML5, mogą istnieć elementy, atrybuty i niektóre praktyki, które w przyszłości przestaną działać. Więc upewnij się, że Twoje strony AMP są stale sprawdzane od czasu do czasu w oparciu o najnowsze zmiany w wytycznych.