核心要點

• Google加速移動頁面(AMP)是提升移動設(shè)備上網(wǎng)站速度和用戶體驗的關(guān)鍵工具，且不會影響廣告收入。
• AMP可以提升SEO排名，因為Google在網(wǎng)站排名時會考慮加載速度。如果AMP頁面由於加載速度更快而具有更高的點擊率和更低的跳出率，則其排名會更高。
• 要實施AMP，開發(fā)者需要創(chuàng)建網(wǎng)頁的兩個版本：一個供桌面用戶使用的原始版本和一個供移動用戶使用的AMP版本。 AMP不允許表單元素和第三方JavaScript，因此AMP版本可能無法使用某些功能，例如聯(lián)繫表單或頁面內(nèi)評論。
• Google Analytics可以與AMP集成以跟蹤網(wǎng)站性能。為了防止多個分析跟蹤器導致速度下降，Google使用“一次測量，多次報告”的原則。
• 使用Automattic/WordPress開發(fā)的官方AMP插件可以輕鬆地將AMP集成到WordPress網(wǎng)站中。但是，務(wù)必驗證每個頁面並修改插件以確保正確的Schema標記和Google Analytics集成。

Google加速移動頁面(AMP)項目於2016年2月24日啟動。隨著這一啟動，成千上萬的開發(fā)者成為該項目的積極參與者。無數(shù)網(wǎng)站現(xiàn)在都有AMP版本的頁面，許多開發(fā)者正在學習使用AMP——在這種情況下，學習如何在WordPress中使用AMP。

Google非常重視AMP。它也是他們的搜索引擎排名標準之一。這樣，Google使AMP幾乎成為許多網(wǎng)站的必需品。在本文中，我將向您提供有關(guān)Google加速移動頁面項目的詳細信息。這包括在您的WordPress網(wǎng)站中調(diào)用它的步驟。

什麼是AMP？

一些開發(fā)者可能還不熟悉AMP。它是一個移動友好的框架，可以在移動瀏覽器上快速加載您的網(wǎng)頁。它是一種開源技術(shù)，旨在使網(wǎng)站發(fā)布者能夠有效地提高移動設(shè)備上加載內(nèi)容頁面的速度和用戶體驗。所有這些增強都不會影響廣告收入。

如果您是一位經(jīng)驗豐富的開發(fā)者，您可以通過全面的頁面加載優(yōu)化來實現(xiàn)類似的增強。但是，加速移動頁面使這些優(yōu)化非常易於執(zhí)行，而無需花費太多時間和精力在移動佈局上。

對於那些已經(jīng)為SEO排名而加倍努力的網(wǎng)站來說，這當然會增加他們待辦事項列表中的更多任務(wù)，因為AMP頁面還可以增強您網(wǎng)站的SEO排名。這也許是大企業(yè)也採用AMP的主要原因。

AMP項目

AMP包含三個主要組件：

• AMP HTML
• AMP JS
• AMP緩存

AMP HTML

它是HTML的一個子集，具有許多限制、自定義標籤和自定義屬性。如果您已經(jīng)熟悉HTML，那麼適應這一點並不復雜。但是，如果您發(fā)現(xiàn)有任何困難，我建議您訪問此鏈接以了解有關(guān)如何創(chuàng)建您的AMP HTML頁面的更多信息。

AMP JS

AMP為移動網(wǎng)頁提供有限數(shù)量的JavaScript?，F(xiàn)在，關(guān)於AMP中的JS需要記住的一件重要事情是，AMP不允許使用第三方JavaScript。

AMP緩存

Google AMP緩存是用於交付AMP頁面的CDN。你們都知道內(nèi)容交付網(wǎng)絡(luò)的核心功能——它們將資源加載分發(fā)到更靠近您網(wǎng)站查看者的服務(wù)器。對於AMP頁面，由於可能的距離延遲，此CDN將允許最小的加載時間。

AMP標識對SEO的相關(guān)性

早在2016年，當Google推出AMP時，AdAge.com發(fā)表了對Google新聞和社交產(chǎn)品高級總監(jiān)Richard Gingras的採訪。在該採訪中，他說AMP的使用不會直接與您的搜索排名相關(guān)，因為它不是一個直接因素。然後他補充道：“所有其他（搜索引擎排名）信號也需要滿足?！?/p>

然而，在此澄清之後，一切變得更加清晰。他說：“如果我們有兩篇文章，從信號的角度來看，在所有其他特徵（速度除外）上的得分相同，那麼是的，我們將重點關(guān)注速度快的那篇文章，因為這就是用戶發(fā)現(xiàn)引人注目的地方。”

即使Google也不否認AMP網(wǎng)站對SEO的相關(guān)性。速度在搜索引擎優(yōu)化方面始終是一個影響因素。如果AMP頁面由於加載速度更快而獲得更多點擊和更低的跳出率，那麼Google肯定會因為更好的用戶體驗而將網(wǎng)站排名更高。

如何AMP您的網(wǎng)站？

您必須在網(wǎng)站上維護文章頁面的兩個版本。原始文章頁面，用於默認網(wǎng)頁用戶，以及AMP版本，用於潛在的移動用戶。

另請注意，AMP不允許表單元素和第三方JavaScript。這意味著您不能在標準實現(xiàn)中放置聯(lián)繫表單或頁面內(nèi)評論，因為AMP主要用於內(nèi)容交付。

• 我建議重寫整個網(wǎng)站模板以應對這些限制。例如，AMP頁面的CSS必須內(nèi)聯(lián)，頁面大小小於50 kb。此外，由於字體的快速加載，應在amp-font擴展程序的幫助下加載它們，以便有效地加載頁面。
• 建議必須謹慎處理多媒體。對於圖像，您需要使用該元素以及精確的寬度和高度。此外，如果您的圖像是GIF，則需要使用單獨的amp-anim擴展組件。
• 對於視頻，有兩種選擇。有一個用於嵌入視頻的自定義標籤，稱為amp-video。但是，如果您想嵌入YouTube視頻，則有一個名為amp-youtube的特定標籤。
• 對於嵌入幻燈片，您可以使用amp-carousel。除此之外，如果您想添加圖像燈箱，您可以使用amp-image-lightbox。
• 對於嵌入社交媒體平臺，例如Twitter、Facebook、Instagram、Pinterest和Vine，您可以使用每個相應的組件。
• 這點非常重要?，F(xiàn)在，一旦一切設(shè)置好，您就可以使用您的AMP頁面了，您必須讓Google知道您的AMP網(wǎng)站。您必須在您的主要帖子頁面上添加一個關(guān)於您的AMP頁面的標籤以及AMP頁面上關(guān)於主要頁面的規(guī)範標籤。

您可以在此處了解有關(guān)AMP標籤和Schema.org元數(shù)據(jù)的更多信息。 Schema.org元數(shù)據(jù)“是使您的內(nèi)容有資格出現(xiàn)在Google搜索新聞輪播演示中的要求”。因此，如果您希望通過Google AMP取得成功，則必須正確設(shè)置您的Schema。

Google Analytics是否適用於AMP？

是的，當然，Analytics適用於AMP。事實上，AMP上的Analytics也很聰明。為了防止網(wǎng)站由於多個分析跟蹤器而速度下降，它們基於“一次測量，多次報告”的核心理念。通常，有兩種方法可以在您的網(wǎng)站上為AMP啟用Analytics。

• amp-pixel元素：它是一個簡單的標籤，可以使用GET請求計算頁面瀏覽次數(shù)（類似於跟蹤像素）。
• amp-anayltics擴展組件：此組件比amp-pixel更高級。您可以使用它來衡量AMP頁面上的任何活動。它使您可以指定JSON配置，該配置提供有關(guān)要測量的內(nèi)容以及發(fā)送報告的位置的詳細信息。

如何在WordPress網(wǎng)站上使用AMP？

事實上，使用AMP最簡單的方法之一是在您的WordPress網(wǎng)站上實現(xiàn)它。您可以使用Automattic/WordPress開發(fā)的官方插件。

步驟一：安裝WordPress插件

讓我們開始安裝吧！從上面的鏈接下載插件，然後在您的WordPress網(wǎng)站上安裝插件。安裝後，您只需將“/amp/”附加到文章頁面即可。如果您沒有啟用漂亮的永久鏈接，您可以嘗試?amp=1。

步驟二：驗證和調(diào)整

Google搜索控制臺會從元標記中獲取文章頁面的AMP版本，該元標記將由插件附加。但是，問題在於通常需要幾天時間才能檢測到此類更改。

那麼，現(xiàn)在該怎麼辦？為了處理這些棘手的情況，我建議結(jié)合使用Chrome驗證過程和搜索控制臺。為了使用Chrome驗證過程，請在Chrome中訪問您的任何AMP頁面。然後在URL末尾附加#development=1?，F(xiàn)在按Control Shift I打開Chrome開發(fā)者工具。

刷新頁面，它會顯示“AMP驗證成功”或提供需要修復問題的詳細列表。

您可以看到，僅安裝插件是不夠的。您必須通過訪問頁面並重複上述步驟來驗證每個數(shù)據(jù)，以便從加速移動頁面中受益。

步驟三：驗證Schema標記

您已經(jīng)了解到，驗證Schema標記對於您的AMP頁面至關(guān)重要。我建議使用Google的結(jié)構(gòu)化數(shù)據(jù)測試工具來測試您的頁面是否具有有效的Schema標記。但是，我發(fā)現(xiàn)WordPress在顯示徽標方面存在一些問題。因此，我進行了一些修改以克服此問題。

轉(zhuǎn)到插件，單擊“編輯器”，然後選擇“AMP”。更改編輯器中的這些行以修改插件。

<code>if ( $site_icon_url ) {
  $metadata['publisher']['logo'] = array(
    '@type' => 'ImageObject',
    'url' => $site_icon_url,
    'height' => self::SITE_ICON_SIZE,
    'width' => self::SITE_ICON_SIZE,
  );
}</code>

到：

<code>$metadata['publisher']['logo'] = array(
  '@type' => 'ImageObject',
  'url' => 'http://yourdomain.com/wp-content/uploads/logo-company.png',
  'height' => 60,
  'width' => 170,
);</code>

請確保在URL中指定徽標所在的位置，並相應地指定高度和寬度。

步驟四：將Google Analytics與AMP WordPress插件集成。

現(xiàn)在，您幾乎完成了。但是，我更喜歡使用Google Analytics來跟蹤統(tǒng)計數(shù)據(jù)。 AMP WordPress插件沒有主動激活amp-analytics，但是，執(zhí)行起來非常容易。

為了使AMP WordPress插件能夠與Google Analytics協(xié)同工作，請轉(zhuǎn)到插件->編輯器->選擇“AMP”，並將以下代碼添加到其末尾。

<code>add_action( 'amp_post_template_head', 'amp_post_template_add_analytics_js' );
function amp_post_template_add_analytics_js( $amp_template ) {
    $post_id = $amp_template->get( 'post_id' );
    ?>
     async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js">>
    <?php }

add_action( 'amp_post_template_footer', 'xyz_amp_add_analytics' );

function xyz_amp_add_analytics( $amp_template ) {
    $post_id = $amp_template->get( 'post_id' );
    ?>
    <amp-analytics> type="googleanalytics" id="analytics1"></amp-analytics>
     type="application/json">
    {
      "vars": {
        "account": "UA-XXXXX-Y"  ←(YOUR GOOGLE ANALYTICS PROPERTY ID)
      },
      "triggers": {
        "trackPageview": {
          "on": "visible",
          "request": "pageview"
        }
      }
    }
    >
    >
    <?php }
</code>

確保將值UA-XXXXX-Y更改為您自己的Google Analytics屬性ID！

進行此更改後，重新驗證您的AMP頁面，然後您的AMP頁面將可跟蹤。

對Google AMP項目的結(jié)論

Google希望AMP項目為用戶提供良好的體驗。儘管如此，問題仍然是AMP是否可以使一切超級快速。這個問題的答案是相當開放式的。如果您對網(wǎng)站的優(yōu)化效果不佳，那麼AMP將帶來一些顯著的提升。

但是，加速移動頁面並非靈丹妙藥。從一開始就提供了改進網(wǎng)站速度的技術(shù)。 AMP只是試圖結(jié)合併消除所有主要的慢速加載因素，並為用戶提供更好的解決方案。

您如何看待AMP項目？請在下面的評論部分分享您的觀點！

關(guān)於在WordPress中使用AMP的常見問題解答(FAQ)

使用AMP與WordPress的主要好處是什麼？

使用AMP（加速移動頁面）與WordPress的主要好處是增強移動瀏覽體驗。 AMP是Google支持的項目，旨在使網(wǎng)頁在移動設(shè)備上加載速度更快。它通過精簡HTML和使用精簡版本的CSS來實現(xiàn)這一點。這導致頁面加載速度顯著提高，從而可以提高用戶參與度、保留率和改進移動SEO。

AMP如何影響SEO？

AMP可以顯著提高您的SEO，因為頁面加載速度是Google算法中的排名因素。通過使您的網(wǎng)頁加載速度更快，AMP可以幫助提高您在搜索引擎結(jié)果中的可見性，尤其是在移動用戶中。此外，Google通常會在搜索結(jié)果中突出的輪播中突出顯示AMP頁面，從而提供進一步的可見性。

我可以在現(xiàn)有的WordPress網(wǎng)站上使用AMP嗎？

是的，您可以在現(xiàn)有的WordPress網(wǎng)站上使用AMP。有幾個可用的插件可以幫助您在WordPress網(wǎng)站上實現(xiàn)AMP。這些插件有助於將您現(xiàn)有的帖子和頁面轉(zhuǎn)換為與AMP兼容的版本。

AMP會影響我的WordPress網(wǎng)站的功能嗎？

AMP限制某些HTML、CSS和JavaScript元素以確?？焖俚捻撁婕虞d時間。這意味著您的WordPress網(wǎng)站的某些功能在網(wǎng)站的AMP版本上可能無法按預期工作。但是，大多數(shù)AMP插件都提供選項，可以通過仍然符合AMP標準的方式添加回功能。

如何自定義AMP頁面的外觀？

可以使用CSS自定義AMP頁面的外觀。但是，由於AMP限制使用某些CSS屬性以確?？焖俚捻撁婕虞d時間，因此您可能需要使用更精簡的方法來設(shè)置樣式。一些WordPress的AMP插件提供內(nèi)置的自定義選項。

如何檢查我的AMP實現(xiàn)是否成功？

您可以使用Google提供的AMP測試工具來檢查您的AMP實現(xiàn)是否成功。此工具將分析您的AMP頁面並報告可能阻止它在Google搜索結(jié)果中作為AMP頁面提供的任何錯誤。

我可以在WordPress中不使用插件的情況下使用AMP嗎？

是的，您可以在WordPress中不使用插件的情況下實現(xiàn)AMP，但這需要對Web開發(fā)和AMP標準有很好的了解。您需要手動創(chuàng)建帖子和頁面的單獨AMP兼容版本，並手動添加必要的AMP HTML標籤。

AMP是否支持廣告和分析？

是的，AMP同時支持廣告和分析。但是，由於AMP限制某些HTML、CSS和JavaScript元素，因此您可能需要使用AMP特定的標籤和腳本來進行廣告和分析。

我可以為特定的帖子或頁面禁用AMP嗎？

是的，大多數(shù)WordPress的AMP插件都提供選項來禁用特定帖子或頁面的AMP。如果您有一些與AMP限製配合不好的內(nèi)容，這將非常有用。

AMP是否是響應式設(shè)計的替代品？

不，AMP不是響應式設(shè)計的替代品。雖然AMP可以通過使頁面加載速度更快來增強移動瀏覽體驗，但它並沒有取代適應不同屏幕尺寸的網(wǎng)站設(shè)計的需求。最好將AMP與響應式設(shè)計結(jié)合使用，以獲得最佳的移動用戶體驗。

以上是如何與WordPress一起使用AMP的詳細內(nèi)容。更多資訊請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！