GoogleのAMPプロジェクトは、サイトのモバイル最適化と読み込みの高速化を目標に設計されています。サイトを構築する際には何らかの最適化を施すでしょうから、AMPを導入する場合でもしない場合でも、内容を知っておくメリットがあります。今回はGoogle AMPをこれから始めたい方向けのチュートリアルを紹介します。
まずはAMPを知ろう
何の知識もなくAMPの実装を始めると、おそらくトラブルに遭遇するでしょう。まずはAMPとは何か、どんなことを実現してくれるのかを知り、それから導入するかどうか決定してください。
AMPの基本が60秒でわかる動画です。AMPを始める前にぜひ見ておきましょう。
コーディングしてみよう
AMPのコンセプトを知ったところで、コーディングに挑戦してみましょう。
・How to Make a Basic AMP Page From Scratch
AMPページを、主要機能をすべて利用できるように作るためのチュートリアルです。コードのテンプレートを利用すれば、それを土台に、簡単にAMPページを作り始められますよ。
・Course: Up and Running With AMP
動画で学びたい方にはこちらが適しています。AMPの基本はもちろんローカルプレビューの作成法、検証ツールのアクティベーションなどを学べます。さらにAMPでのCSSの振る舞いやAMPフレンドリーな画像の作り方など、さまざまなテクニックを網羅しています。
・How to Use amp-img and amp-video to Speed Up Your Website
もし写真や動画を扱うサイトを作るのであれば、AMPの高速化機能を中心に学ぶといいでしょう。そうした方には、こちらのチュートリアルがおすすめです。
AMPとCMS
CMSではコードの全てを操作できませんから、AMPを使うにはもう一仕事必要です。しかしCMS側からの手助けがあれば、WordPressでもそれほど苦労せずにAMPを導入できます。
・How to Set Up AMP Support for WordPress
WordPressには、公式でAMPをサポートするプラグインが用意されています。これでも十分ですが、YoastのSEOプラグインもあわせて導入すればより詳細なコントロールが可能です。WordPressにおいては、導入する全てのプラグインがAMPを妨害しないことを確認してください。
まとめ
今回紹介したチュートリアルで、AMP導入の知識は十分カバーできます。あとはプロジェクトを進めるだけです。さあ、始めましょう。
※本記事は、How to Get Started with Google AMPを翻訳・再構成したものです。
おすすめ新着記事
おすすめタグ