AMPの下調べ (実践前)

デジタルドリームワークスからHigaです。
さてGoogleが猛プッシュ中のAMPについて下調べしました。
今後弊社のブログにも導入していきたいと思います。

AMPについての概要は以前に投稿した記事をご確認下さい。
http://blog.ddwnet.com/archives/1190.html

さてそれではAMPのコードを見ていきましょう!

20160328-pict02

上記が推奨されるampの雛形です。
HTMLのコーディングをしている方であれば、それほど難しくないですね。
しかしAMP独自の記述もありいくつか注意が必要です。

● htmlタグにはamp属性を入れましょう。
● canonical要素には通常記事のURL、もしくはAMP版ページしか無い場合は、AMPページのURLを記述します。
● viewport要素は「initial-scale=1」が望ましいようです。
● スキーマタグでセマンティックウェブへの対応
● AMP JS ライブラリーの読み込みとAMPスタイルの読み込み

という感じでしょうか。それに加えて以下も気をつけてましょう!
従来通りCSSで装飾を行っていきますが、AMPではhead内にインラインで以下の様に記述していきます。

[css]

[/css]

imgダグはAMP独自タグ(amp-img)だったりするようです。
その他、AMP独自タグがあったり、非推奨タグなどもあり、詳細はACCELERATED MOBILE PAGES PROJECTを確認してみましょう。

それでは次回 実際に記述してみたいと思います。

参考
ACCELERATED MOBILE PAGES PROJECT
https://www.ampproject.org/

20160328-pict01

関連記事

  1. 外部コメントシステム DISQUS

  2. Adobe XD(Preview版)をインストールしてみた!

  3. Google Maps iframeでホイールスクロールを無効

  4. 進化するHTML5 IMGタグ

  5. ジョギングシュミレーター

  6. Tumblr(タンブラ)ってなに?

最近の記事

  1. NFCカード
  2. vcard形式 qrコード
  3. FileMakerとTwilio連携がSMS配信を劇的に変える理由
  4. FileMaker QRコード
  5. phantom4pro
  6. 2017.06.07

    iPad Pro 新型
  7. wwdc2017

カテゴリー


  1. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    @美浜から

  2. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    Appleのように「デザインのある会社!」

  3. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    Books

  4. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    DX戦略

  5. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    EC-CUBE

  6. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    googleのように「オープンに働ける会社!」

  7. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    IDEOのように「発想する会社!」

  8. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    Server

  9. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    Swift

  10. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    Wordpressを使いこなせ!【developer編】

  11. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    アップル

  12. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    ウェブサイト

  13. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    オープンソース

  14. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    パタゴニアのように「環境を考える会社!」

  15. Warning: Trying to access array offset on false in /var/www/vhosts/ddwnet.com/httpdocs/ddwnet/wp-content/themes/source_tcd045/widget/category_list.php on line 60
    ファイルメーカー