AMP

Reklamlar için AMP spesifikasyonları

Standard üzerinde herhangi bir değişiklik yapmayı teklif ederseniz, lütfen Uygulama Girişimi üzerinde yorum yapın.

AMPHTML reklamları, AMP sayfalarında hızlı ve iyi performanslı reklamlar oluşturma mekanizmasıdır. AMPHTML reklam belgelerinin ("AMP reklam öğeleri") tarayıcıda hızlı ve sorunsuz bir şekilde oluşturulmasını ve kullanıcı deneyimini düşürmemesini sağlamak için AMP reklam öğelerinin bir dizi doğrulama kuralına uyması gerekir. AMP biçim kurallarına benzer şekilde, AMPHTML reklamları izin verilen sınırlı sayıda etiket, özellik ve uzantıya erişebilir.

AMPHTML reklamı biçim kuralları

Aşağıda aksi belirtilmedikçe, reklam öğesinin buraya referans olarak dahil edilen AMP biçim kuralları tarafından koyulan tüm kurallara uyması gerekir. Örneğin, AMPHTML reklam Ortak Metni AMP standart ortak metninden sapar.

Ayrıca, reklam öğelerinin aşağıdaki kurallara uyması gerekir:

Kural Gerekçe
<html ⚡4ads> veya <html amp4ads> türleri kullanmalıdır Doğrulayıcıların, bir reklam öğesi belgesini genel bir AMP belgesi veya kısıtlı bir AMPHTML reklam belgesi olarak tanımlamasına ve uygun şekilde göndermesine izin verir.
Çalışma zamanı betiği olarak https://cdn.ampproject.org/v0.js yerine <script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script> kullanmalıdır. Kaynaklar arası iframe'lerde sunulan AMPHTML reklamları için özel çalışma zamanı davranışlarına izin verir.
<link rel="canonical"> etiketi içermemelidir. Reklam öğelerinde "AMP olmayan standart sürüm" yoktur ve bağımsız olarak arama dizine eklenmez, bu nedenle kendi kendine referans yapmak işe yaramaz.
HTML head bölümünde <meta name="amp4ads-id" content="vendor=${vendor},type=${type},id=${id}"> biçiminde isteğe bağlı üst etiketleri tanımlayıcı olarak içerebilir. Bu üst etiketler amp4ads-v0.js betiğinin hemen öncesine yerleştirilmelidir. vendor ve id değerleri sadece [0-9a-zA-Z_-] içeren metin dizeleridir. type değeri creative-id veya impression-id şeklindedir. Bu özel tanımlayıcılar, izlenimi veya reklam öğesini tanımlamak için kullanılabilir. Bunlar raporlama ve hata ayıklama için faydalı olabilir.

Örnek:

<meta name="amp4ads-id"
  content="vendor=adsense,type=creative-id,id=1283474">
<meta name="amp4ads-id"
  content="vendor=adsense,type=impression-id,id=xIsjdf921S">
<amp-analytics> görüntülenebilirlik izlemesi, Issue #4018 ve PR #4368 bölümlerinde açıklandığı gibi, "visibilitySpec": { "selector": "amp-ad" } yoluyla sadece tam reklam seçiciyi hedefleyebilir. Özel olarak, reklam öğesi içindeki diğer öğeler için herhangi bir seçiciyi hedefleyemez. Bazı durumlarda AMPHTML, bir reklam öğesini iframe’e dönüştürmeyi tercih edebilir. Bu durumlarda, ana sayfa analizi, sadece iframe’in bütününü hedefleyebilir ve daha incelikli seçicilere erişemez.

Örnek:

<amp-analytics id="nestedAnalytics">
  <script type="application/json">
  {
    "requests": {
      "visibility": "https://example.com/nestedAmpAnalytics"
    },
    "triggers": {
      "visibilitySpec": {
      "selector": "amp-ad",
      "visiblePercentageMin": 50,
      "continuousTimeMin": 1000
      }
    }
  }
  </script>
</amp-analytics>

Bu yapılandırma, çevreleyen reklamın %50’si ekranda 1 saniyeliğine kesintisiz olarak gösterildiğinde https://example.com/nestedAmpAnalytics bölümüne bir istek gönderir.

Ortak Metin

AMPHTML reklam öğeleri genel AMP belgelerindekinden farklı ve çok daha basit bir ortak metin stil satırı gerektirir:

<style amp4ads-boilerplate>
  body {
    visibility: hidden;
  }
</style>

Gerekçe: amp-boilerplate stili, AMP çalışma zamanı hazır olana ve onu gösterene kadar gövde bölümü içeriğini gizler. Javascript devre dışı bırakılırsa veya AMP çalışma zamanı yüklenemezse, varsayılan ortak metin, içeriğin ne olursa olsun sonunda görüntülenmesini sağlar. Ancak AMPHTML reklamlarında, Javascript tamamen devre dışı bırakılırsa, AMPHTML reklamları çalışmaz ve hiçbir reklam gösterilmez, bu nedenle <noscript> bölümüne gerek yoktur. AMP çalışma zamanının yokluğunda, AMPHTML reklamlarının dayandığı mekanizmaların çoğu (ör. Görüntülenebilirlij izleme için analiz veya içerik görüntüleme için amp-img ) kullanılamayacağından, hatalı bir reklam yerine hiçbir reklam göstermemek daha iyidir.

Son olarak, AMPHTML reklam ortak metni, amp-boilerplate yerine amp-a4a-boilerplate kullanır böylece doğrulayıcılar onu kolayca tespit edebilir ve geliştiricilere yardım etmek için doğru hata mesajları üretebilir.

Genel AMP ortak metin kurallarının aynısının, ortak metin içeriğindeki değişikliklere uygulandığını unutmayın.

CSS

Kural Gerekçe
position:fixed ve position:sticky, reklam öğesi CSS'inde yasaklıdır. position:fixed AMPHTML reklamlarının dayandığı gölge DOM'u bozar. Ayrıca, AMP'deki reklamların sabit konum kullanmasına zaten izin verilmez.
touch-action yasaklanmıştır. touch-action öğesini kullanabilen bir reklam, kullanıcının ana belgeyi kaydırma gücüne de müdahale edebilir.
Reklam öğesi CSS'i 20.000 bayt ile sınırlıdır. Büyük CSS blokları reklam öğesini şişirir, ağ gecikmesini artırır ve sayfa performansını düşürür.
Geçiş ve animasyon ek kısıtlamalara tabidir. AMP, bir reklama ait tüm animasyonları kontrol edebilmelidir, böylece reklam ekranda olmadığında veya sistem kaynakları çok düşük olduğunda onları durdurulabilecektir.
Satıcıya özgü önekler, doğrulama amacıyla önek olmadan aynı sembol için takma adlar olarak kabul edilir. Yani, bir foo sembolü CSS doğrulama kuralları tarafından yasaklanmışsa, -vendor-foo sembolü de yasaklanacaktır. Bazı satıcı önekli özellikler, normalde ilgili kurallar altında yasaklanan veya kısıtlanan özelliklere özdeş işlevsellikler sunar.

Örnek: -webkit-transition ve -moz-transition, transition için kısıtlı takma adlar olarak görülür. Bunlara sadece tek başına transition olduğunda izin verilir (aşağıda Seçiciler bölümüne bakın).

CSS animasyonları ve geçişler

Seçiciler

transition ve animation özelliklerine sadece aşağıdaki şartları karşılayan seçicilerde izin verilir:

  • transition, animation, transform, visibility veya opacity özellikleri içermelidir.

Gerekçe: Bu, AMP çalışma zamanının sayfa performansı için gerektiğinde animasyonları devre dışı bırakmak üzere bu sınıfı bağlamdan kaldırmasına olanak tanır.

Doğru

.box {
transform: rotate(180deg);
transition: transform 2s;
}

Yanlış

Özelliğe CSS sınıfında izin verilmiyor.

.box {
color: red; // non-animation property not allowed in animation selector
transform: rotate(180deg);
transition: transform 2s;
}
Geçiş yapabilme ve animasyona dönüştürebilme özellikleri

Geçilebilen tek özellikler opaklık ve dönüşümdür. (Gerekçe)

Doğru

transition: transform 2s;

Yanlış

transition: background-color 2s;

Doğru

@keyframes turn {
from {
transform: rotate(180deg);
}

to {
transform: rotate(90deg);
}
}

Yanlış

@keyframes slidein {
from {
margin-left: 100%;
width: 300%;
}

to {
margin-left: 0%;
width: 100%;
}
}

İzin verilen AMP uzantıları ve yerleşik öğeler

AMPHTML reklam öğesinde izin verilen AMP uzantı modülleri ve AMP yerleşik etiketleri aşağıda verilmiştir. Listede açıkça belirtilmeyen uzantılar veya yerleşik etiketler, yasaklanmıştır.

Çıkartmaların çoğu, performans için veya AMPHTML reklamlarının analizini kolaylaştırmak içindir.

Örnek: <amp-ad> listeden çıkarılmıştır. Bu bileşene açıkça izin verilmemiştir çünkü bir <amp-ad> bileşenine <amp-ad> bileşeni içinde izin vermek, potansiyel olarak sınırsız reklam yükleme şelalelerine neden olabilir ki bu da AMPHTML reklam performans hedefleri için uygun değildir.

Örnek: <amp-iframe> bu listeden çıkarılmıştır. Reklamlar rasgele Javascript yürütmek ve rastgele içerik yüklemek için kullanabileceğinden ona izin verilmez. Bu özellikleri kullanmak isteyen reklamlara a4aRegistry girişlerinden false yanıtını almalı ve mevcut '3p iframe' reklam oluşturma mekanizmasını kullanmalıdır.

Örnek: <amp-facebook>, <amp-instagram>, <amp-twitter> ve <amp-youtube> etiketleri de <amp-iframe> ile aynı nedenden çıkarılmıştır: Hepsi iframe'ler oluşturur ve potansiyel olarak sınırsız kaynak tüketebilirler.

Örnek: <amp-ad-network-*-impl> bu listeden çıkarılmıştır. <amp-ad> etiketi, bu uygulama etiketlerine atama işlemini gerçekleştirir; reklam öğeleri bunları doğrudan eklemeye çalışmamalıdır.

Örnek: <amp-lightbox> henüz dahil edilmemiştir çünkü bazı AMPHTML reklam öğeleri bile bir iframe'de oluşturulabilir ve şu anda bir reklamın iframe'in ötesine genişlemesi için bir mekanizma yoktur. Gelecekte bunun için ortaya koyulan bir istek varsa destek eklenebilir.

HTML etiketleri

Aşağıdakiler, bir AMPHTML reklam öğesinde izin verilen etiketlerdir. Açıkça izin verilmeyen etiketler yasaktır. Bu liste, genel AMP etiketi ek izin listesinin bir alt kümesidir. Bu liste gibi, HTML'nin Öğeleri bölüm 4'te, HTML5 özellikleriyle tutarlı olarak sıralanmıştır.

Çıkartmaların çoğu ya performans içindir ya da etiketler HTML5 standardına uygun olmadığı içindir. Örneğin, AMPHTML reklamları JavaScript'in etkinleştirilmesine bağlı olduğundan <noscript> çıkarılmıştır, bu nedenle <noscript> bloğu hiçbir zaman yürütülmez ve bu yüzden sadece reklam öğesini şişirir, bant genişliği maliyeti doğurur ve gecikmeye neden olur. Benzer şekilde, <acronym> , <big> vd. HTML5 uyumlu olmadıkları için yasaktır.

4.1 Kök öğesi

4.1.1 <html>

  • <html ⚡4ads> veya <html amp4ads> türleri kullanmalıdır

4.2 Belge üst verileri

4.2.1 <head>

4.2.2 <title>

4.2.4 <link>

  • <link rel=...> etiketlerine <link rel=stylesheet> haricinde izin verilmez.

  • Not: Genel AMP'den farklı olarak, <link rel="canonical"> etiketleri yasaklanmıştır.

4.2.5 <style> 4.2.6 <meta>

4.3 Bölümler

4.3.1 <body> 4.3.2 <article> 4.3.3 <section> 4.3.4 <nav> 4.3.5 <aside> 4.3.6 <h1>, <h2>, <h3>, <h4>, <h5>, and <h6> 4.3.7 <header> 4.3.8 <footer> 4.3.9 <address>

4.4 Gruplama İçeriği

4.4.1 <p> 4.4.2 <hr> 4.4.3 <pre> 4.4.4 <blockquote> 4.4.5 <ol> 4.4.6 <ul> 4.4.7 <li> 4.4.8 <dl> 4.4.9 <dt> 4.4.10 <dd> 4.4.11 <figure> 4.4.12 <figcaption> 4.4.13 <div> 4.4.14 <main>

4.5 Metin düzeyinde semantik

4.5.1 <a> 4.5.2 <em> 4.5.3 <strong> 4.5.4 <small> 4.5.5 <s> 4.5.6 <cite> 4.5.7 <q> 4.5.8 <dfn> 4.5.9 <abbr> 4.5.10 <data> 4.5.11 <time> 4.5.12 <code> 4.5.13 <var> 4.5.14 <samp> 4.5.15 <kbd > 4.5.16 <sub> and <sup> 4.5.17 <i> 4.5.18 <b> 4.5.19 <u> 4.5.20 <mark> 4.5.21 <ruby> 4.5.22 <rb> 4.5.23 <rt> 4.5.24 <rtc> 4.5.25 <rp> 4.5.26 <bdi> 4.5.27 <bdo> 4.5.28 <span> 4.5.29 <br> 4.5.30 <wbr>

4.6 Düzenlemeler

4.6.1 <ins> 4.6.2 <del>

4.7 Gömülü İçerik

  • Gömülü içerik sadece <amp-img> veya <amp-video> gibi AMP etiketleri yoluyla desteklenir.

4.7.4 <source>

4.7.18 SVG

SVG etiketleri HTML5 ad alanında değildir. Aşağıda bölüm tanımlayıcıları olmadan listelenmişlerdir.

<svg>``<g>``<path>``<glyph>``<glyphref>``<marker>``<view>``<circle>``<line>``<polygon>``<polyline>``<rect>``<text>``<textpath>``<tref>``<tspan>``<clippath>``<filter>``<lineargradient>``<radialgradient>``<mask>``<pattern>``<vkern>``<hkern>``<defs>``<use>``<symbol>``<desc>``<title>

4.9 Tablo verileri

4.9.1 <table> 4.9.2 <caption> 4.9.3 <colgroup> 4.9.4 <col> 4.9.5 <tbody> 4.9.6 <thead> 4.9.7 <tfoot> 4.9.8 <tr> 4.9.9 <td> 4.9.10 <th>

4.10 Formlar

4.10.8 <button>

4.11 Kodlama

  • Genel bir AMP belgesinde olduğu gibi reklam öğesinin <head> etiketi bir <script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script> etiketi içermelidir.
  • Genel AMP'den farklı olarak, <noscript> yasaklanmıştır.
  • Gerekçe: AMPHTML reklamları, Javascript'in hep çalışabilmesini gerektirdiğinden, <noscript> blokları AMPHTML reklamlarında herhangi bir amaca hizmet etmez ve yalnızca ağ bant genişliği maliyeti yaratırlar.
  • Genel AMP'den farklı olarak <script type="application/ld+json"> yasaklanmıştır.
  • Gerekçe: JSON LD, ana sayfalardaki yapılandırılmış veri işaretlemesi için kullanılır, ancak reklam öğeleri bağımsız belgeler değildir ve yapılandırılmış veriler içermezler. İçlerindeki JSON LD blokları sadece ağ bant genişliğine mal olur.
  • Diğer tüm kodlama kuralları ve istisnalar genel AMP'den taşınmıştır.