Google AMP для ускорения контентных страниц
Новая инициатива Google нацелена на улучшение веб-опыта пользователей мобильных устройств. Accelerated Mobile Pages – новый формат построения веб-страниц для оптимизации контента (картинки, JS, плагины соц. сетей) и увеличения отзывчивости мобильной версии сайта, по сути облегчая страницы.
Принцип работы
AMP состоит из трех частей:
- AMP HTML – немного видоизмененный язык разметки, в котором некоторые теги заменены на эквиваленты с упором на AMP, а часть и вовсе запрещена;
- AMP JS – ограничение на использование библиотеки AMP, которая заточена под асинхронную загрузку;
- Google AMP Cache – опциональная возможность кэширования страниц AMP на сервера Google для максимально быстрой отдачи пользователям.
Основные требования и ограничения:
- Только асинхронные скрипты;
- Только встроенный CSS;
- Стили ограничены размером 50 КБ;
- Необходимо указывать размер в HTML-ссылках на внешние ресурсы (картинки);
- JS всегда выполняется асинхронно;
- Поддерживаются только JavaScript для AMP;
- Шрифты загружаются при помощи тега ссылки или CSS @font-face rule.
AMP HTML
Разберем простую HTML-страницу, построенную по требованиям AMP:
<!doctype html>
****
****
” title=”
" title="
Полезные решения для тех,
кто пишет код
Присоединяйтесь
к сообществу:
Сообщить об опечатке
Текст, который будет отправлен нашим редакторам: