next.js の AMP mode を使って静的サイトを作る
この記事は amdxg を作りながら, next.js で AMP に対応したときにやったことです。 コードはこちらです amdx/packages/ssg at master · mizchi/amdx AMP について Google の推奨する HTML のサブセット仕様です。制約付きのインライン CSS のみ + 一切の JS が書けず、代わりに動きがあるものは amp plugin を使って記述します。 モバイルでは、Google の検索結果画面からは GoogleCDN 上のキャッシュが返却されるので、非常に高速に開くことができます。 (⚡ マークが AMP 対応の印) モバイルに限らず、ある種のベストプラクティスの強制なので、PC でも AMP 対応することに意味はあります。 この記事では、実際にこのブログのための SSG を作る過程で、どのように next.js 上で AMP
AMPに適用するCSSを設定できるようにしました - はてなブログ開発ブログ
はてなブログでは、AMP（Accelerated Mobile Pages）用のCSSを設定できるようにしました。AMPで記事が配信される際のデザインをカスタマイズできます。 ※はてなブログのAMP配信は、有料プラン「はてなブログPro」に加入しているユーザー向けのベータ版機能です。詳細は関連ヘルプなどをご参照ください。 記事をAMPで配信しているブログの「デザイン設定」画面では、「スマートフォン」タブの「詳細設定」に「AMP用CSS」欄が表示されます。ここにCSSを直接記述してください。 AMPでの表示は、記事編集画面（PC版）の「プレビュー」タブで、「スマートフォン（AMP）」を選択して確認できます。詳細は下記の関連ヘルプやプレビュー機能のリリース告知をご確認ください。 ※AMPのCSSにはいくつかの制限があります。本機能はAMPおよびCSSの知識を持っている方を対象しており、デザイン
ついに始まった、Google AMP（Accelerated Mobile Pages）を試してみよう！
対象読者 Webサイト開発者および運営者 はじめに AMPとは？ AMP（Accelerated Mobile Pages）は、モバイルページ高速化によるユーザー体験の向上を目的として、2015年にGoogleが発表したプロジェクトです。 Twitter、Pinterest、WordPress.com、LinkedInや、BBC、産経デジタルなどのパブリッシャーがAMPのパートナーに参加。2016年2月から、Google検索結果での表示が開始されました。 具体的には下記で解説するような「AMP HTML」などが新たに策定されています。 基本構成 AMPは「AMP HTML」「AMP JS」「Google AMP Cache」で構成されています。 AMP HTML：既存のHTML／CSS／JavaScriptの一部を制限することで、高いパフォーマンスを実現します。 AMP JS：高速レンダリ
【SEO】AMP対応は必須となるか？GoogleがAMP対応を促すメッセージの配信とモバイル検索結果に専用枠を導入予定 - 検索サポーター
※ 2016/8/16：AMP対応ページにAdSenseを表示させるための設定として、amp-adタグについて追記。 需要なポイントは… GoogleがAMP対応を促すメッセージを配信 モバイル検索結果に新しい機能（専用枠）を導入予定 AMP対応のメリット、デメリット AMP対応は必須となるか？ GoogleがAMP対応を促すメッセージを配信 つい先日、Googleはモバイル検索にて「AMPページをスマホ向けページに置き換えて検索結果に表示する実験を開始した」ことを当ブログでもお伝えしましたが、更にGoogleはAMP対応をサイト管理ユーザーに促すため、サーチコンソールからAMP対応ページの作成を推奨するメッセージを配信しました。 このメッセージは最初は英語圏のユーザーだけに配信されているにとどまっていましたが、私のアカウントにも送信されて来ましたので日本語圏はもちろん、遅かれ早かれ全ての
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
