Step1：HTMLファイルをAMP形式に変換する方法の一覧｜Excelソフト

Excel VBAでHTMLファイルをAMP（アンプ）形式に変換するソフト作成

AMP形式にするには何をどうしていいか分からないので、する事を一覧にまとめます。




Homeに戻る > AMP変換ソフト作成 メニューへ
AMPのマーク
AMPのマーク

概要

  • 現在の元ページとAMP用ページの2つが必要になります。
  • AMP用ページは別のフォルダに作成します。
  • 元ページとAMP用ページはリンクさせ、デスクトップはこれまで通り元ページが表示され、モバイルはAMPページが表示されるようになります。
  • 元ページもAMP用ページも追加・変更が必要です。

AMPページの変更点

  1. 文字コードはUTF-8でないといけない　：　これはベクター等に変換ソフトがあるのでそれを利用します。
  2. <!doctype html>を追加する　：　始めの宣言部分
  3. <html amp>を追加する　：　始めの宣言部分
  4. <meta charset="utf-8">を追加する　：　<head>内
  5. <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">を追加する　：　<head>内
  6. <link rel="canonical" href="元ページのURL">を追加する　：　<head>内
  7. <script type="application/ld+json">
    {
    "@context": "http://schema.org",
    "@type": "NewsArticle",
    "headline": "ページのタイトル",
    "image": ["eyecatch.jpg"],
    "datePublished": "2017-08-23T00:00:00+0900"
    }
    </script>
    を追加するらしいが細かなところは不明
  8. <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;_
    -ms-animation:none;animation:none}</style></noscript>
    を追加する
  9. <script async src="https://cdn.ampproject.org/v0.js"></script>を追加する
  10. <amp-img src="sample.jpg" width="300" height="300"></amp-img>画像ファイルはこのように、widthとheightの値が必要になります。
    当サイトではモバイルと併用ににしたため、 widthとheightは100%にしています。
    これを全て手動で変更するにはとても無理です。
元ページの変更点
  1. <link rel="canonical" href="AMPページのURL">を追加する
現在分かっているAMPの変更点です。
今後の作成状況で変更・追加があれば掲載します。

Homeに戻る > AMP変換ソフト作成 メニューへ

■■■
このサイトの内容を利用して発生した、いかなる問題にも一切責任は負いませんのでご了承下さい
■■■
当ホームページに掲載されているあらゆる内容の無許可転載・転用を禁止します


Copyright (c) Excel-Excel ! All rights reserved