web-dev-qa-db-ja.com

サーバーは、ampページを提供するタイミングをどのように認識しますか

デスクトップデバイス用に設計されたHTMLを使用したバージョンのサイトがあり、次にAMPページがあることを理解しています。

サイトがモバイルデバイスにAMPコンテンツを提供するために必要なことはありますか？

redirectamp-html
13
ivan quintero

良い質問！

概要：

  • AMPは、リダイレクトの自動手段を提供せず、検索エンジン（および潜在的に他のウェブサイト/アプリ/検索エンジンがユーザーをAMPページに送信するために必要なマークアップのみ）を提供します
  • モバイルユーザーをモバイルサイトにリダイレクトする古い方法を使用できます。通常は、モバイルユーザーエージェントを検出し、301/302リダイレクトを介してAMPページにリダイレクトします。
  • 前述の古い方法はちょっとひどいので、モバイルユーザーをリダイレクトする価値はないかもしれません

完全な答え：

Googleと検索エンジンの結果ページ（SERP）に関しては、デスクトップのマークアップにこれを含める必要があります。

<link rel="amphtml"
      href="https://www.example.com/url/to/amp/document.html">

そしてこれはあなたのAMPマークアップにあります：

<link rel="canonical"
      href="https://www.example.com/url/to/standard/document.html">

googleと Twitter、LinkedIn、Pinterestなどの他のトラフィックの多いネットワーク がamphtml署名を検出し、それに応じてモバイルブラウザをAMPページに誘導するようにします。 Facebookと言いますが、AMPは Facebook Instant Articles の競合製品であるため、彼らはかかとを引きずってしまうのではないかと思います。

AMPはもちろん完全に異なる動物であり、コンテンツのネイティブアプリプラットフォームとは対照的に、オープンソースとウェブテクノロジーの両方ですが、ウェブとネイティブプラットフォームは互いに対立しており、Googleは多数のアプリを提供していますが、 ServiceWorkerのようなテクノロジーから、コンテンツプラットフォームとしてウェブを推進していることは明らかです。FacebookやAppleアプリはGoogle検索とそのアプリから離れて費やされる時間であるため、当然のことです。 Googleが収益を得る広告。

しかし、私は逸脱します。明らかに、このrel="amphtml"宣言は、Google etal。に、この結果をtheirからモバイルユーザーにリダイレクトするように指示するだけです。 =ページ。これは、リダイレクトポリシーが、GoogleやAMPチームの意図ではなく、直接アクセスしたり、メールなどで直接リンクしたりするのではなく、誰もがGoogleや他の大手プレーヤーを経由する世界を想定しているためです。

理論的には、いつかブラウザレベルで実装される可能性がありますが、ブラウザベンダーは、AMPの現在のようにランダムな非標準の考慮事項は言うまでもなく、重要なレイアウト/スタイリングプロパティとJavaScriptAPIを標準化するのに十分な時間がかかります。 Appleブラウザに関しては、独自のニュースと競合するため、かかとを引きずります News アプリ。

AMPリダイレクトはChromeブラウザ（したがってOpera）に実装されると予想できますが、それでもまだ時間がかかる可能性があります。したがって、モバイルデバイスを強制的にリダイレクトするために標準のページとは対照的に、AMPページは、最終的に、モバイルユーザーエージェント（またはあまり一般的にサポートされていないMIMEタイプ）をスニッフィングしてリダイレクトするようにWebサーバーを構成する必要があります（SEOのために 2を使用 =）それらをAMPページに移動します。

これは過去の習慣への回帰のように見えるかもしれません、そしてあなたはそう考えるのが正しいでしょう。 AMPは、ページ上の最適化とHTTP応答/転送時間の点で価値がありますが、リダイレクトによってすぐに少し遅くなります。レスポンシブウェブデザインの出現と現在の頂点の前に、これは、特にWAPの時代に、モバイルユーザーに対応する方法でした。ウェブサイトは、mob.website.comやm.website.comなどのサブドメインで提供されるモバイルフレンドリーバージョンを提供します。モバイルデバイスを対象としたXHTMLのフレーバーがありました Google+では「基本」ページに引き続き使用されています （[〜＃〜] doctype [〜＃〜]に注意してください） 。これらの「基本」ページは、次の行からわかるように、画面解像度が低いデバイス用に予約されています。

<link rel="alternate" 
      media="only screen and (max-width: 640px)"    
      href="/app/basic/+SOME_PAGE">

このアプローチは、AMPのインスピレーションとしても役立った可能性があります。

とにかくamp.website.comまたはおそらくAMPページのサブディレクトリを使用するつもりなので、同様のリダイレクト方法で問題が発生しないことを願っています。

とにかくすべてのWebサイトがレスポンシブである必要があるため— SEOの観点から そしてモバイルデバイスのみをターゲットにすることは リダイレクト技術の信頼性の欠如 および 使用user-agentsとMIMEタイプ 検出方法として—接続速度や訪問者の物理的な場所を推定しようとする誘惑に駆られるかもしれません。

次に、接続速度が遅い場合、またはユーザーがOriginサーバーから遠く離れている場合は、AMPページにリダイレクトするのが最適な場合があります（GoogleのCDNから提供され、HTTP/2+ヘビーキャッシングを使用して提供されるため）コンテンツの高速化）。

ただし、接続速度の遅いユーザーやOriginサーバーから遠く離れた場所にいるユーザーだけでなく、すべてのページに任意のCDNを使用して、すべてのページにすばやく配信できます。 AMPのポイントは、CDNを介してコンテンツを配信することと、おそらく携帯電話など、JavaScriptの実行時間が遅いことでよく知られているデバイスに責任を持って作成されたページを提供することです。

最終的には、すべてのモバイルユーザーにリダイレクトを強制するわけではありません。 Googleに任せて、検索エンジン経由で到着した訪問者をAMPページに送信するように指示します。 AMPが普及し、長寿命の製品になる場合、ブラウザは最終的にそれを実装します。

考えてみると、モバイルデバイスにコンテンツを提供している場合、古いWindows PhoneまたはBlackberryデバイスを使用しているユーザーにAMPページを提供するのは無責任かもしれません ブラウザーがAMPを適切にサポートしていない可能性もあります 。

考えることはたくさんありますが、私はあなたの質問に対する答えを提供したことを願っています。そうでない場合は、製品の正しい答えを決定する前に、少なくともいくつかの考慮事項を念頭に置いてください。

詳細 個別のモバイルサイトに関する情報については、この件に関するこのドキュメントを読むことができます Googleが提供します。

モバイルユーザーエージェントを検出して別のサブドメインに送信するようにWebサーバーを構成する方法の例については、検索すると非常に簡単に 記事 または コードサンプル を見つけることができます。それら。

25
amdouglas

完全を期すために、次のリダイレクトを使用して特定のユーザーエージェントにAMPページを提供しました。これは、mod_redirectが有効になっているApacheWebサーバーの.htaccessです。

<IfModule mod_rewrite.c>
RewriteBase /
RewriteCond %{REQUEST_URI} !/amp/$ [NC]
RewriteCond %{HTTP_USER_AGENT} (Android|blackberry|googlebot\-   mobile|iemobile|iphone|iPod|\#opera\ mobile|palmos|webos) [NC]
RewriteRule ^([a-zA-Z0-9-]+)([\/]*)$ https://www.yoursite.com/$1/amp/ [L,R=302]
</IfModule>
1
Jesús Diéguez Fernández

私見この質問はもっと興味を引くに値します。 amdouglas 答えは素晴らしく、フロントエンドの側面を完全にカバーしています。サーバー側に関しては、 JesúsDiéguezFernández は良いスタートですが、正確さを保つために残業を維持する必要があります（ユーザーエージェントの署名）。

これを完了するために（そしてそれがPHP関連の質問ではなかったとしても）、以下はPHPスニペット私がサーバー側を使用してモバイルデバイスをリダイレクトするリクエスト。

Mobile-Detect （+ 23Mダウンロード）を使用します。これは、ユーザーエージェント文字列の信じられないほど完全で最新のリストを保持します（これは、任意のプログラミング言語に簡単に適合させる必要があります）。

<?php
require_once "libs/Mobile_Detect.php";
$detector = new MobileDetect();
$is_mobile = $detector->isMobile();
0
Cédric Françoys