Добавление изображения на AMP страницу

Большая часть стандартных тегов HTML благополучно мигрировала в AMP без каких-либо изменений. Но некоторые HTML-теги были немного доработаны. Большинство изменений коснулось тегов, связанных с графикой и видео. В частности, появился расширенный тег IMG, который отвечает за встраивание изображений и теперь выглядит так: amp-img.

Общий синтаксис атрибутов этого тега остался примерно таким же, каким он был в HTML:

<amp-img src="welcome.jpg" alt="Welcome" height="400" width="800"></amp-img>

Одна из основных причин замены данного тега на новый в том, что в HTML он не имел закрывающейся части (не было закрывающего парного тега), а в AMP нужно четко знать, как отрисовывать страницу.

Компонент amp-img, как и все остальные внешние ресурсы AMP, должны иметь явный размер (как по ширине, так и высоте) заранее, так что соотношение сторон может быть известно без извлечения изображения. Фактическое поведение макета определяется атрибутом layout.

Также, вместо указания width="900" и height="675" вы можете просто указать соотношение сторон width="1.33" и height="1".

Оставить комментарий

avatar
25412
  Подписаться  
Уведомление о