４ヶ月ぶりです
((((；ﾟДﾟ))))
先月 本格的にＡＭＰ対応のカスタマイズをしたんだけど
こちらは そのＡＭＰのテストページです。
実際アレコレやったら どう表示されるのか わからない事が多いため 実験するページ作りました
というわけです。
ＡＭＰってそもそも なんぞや？
簡潔に言うと ものすっごい早く表示されるページです。
しかも Google検索で優遇されてるw
もう少し きちんと説明すると
Accelerated Mobile Pages の略で GoogleやTwitterなどが共同で参加しているAMPプロジェクトが構築したHTML規格のことです
普通のページに 比べると様々な制限がありますが
主にモバイルユーザーの ユーザー体験向上を目的として、WEBページの表示速度高速化などが図られています。
このページだと ↑がＡＭＰで表示され
↓が通常ページが 表示されます
https://an-channel.com/amp_test
違いは一目瞭然ですよねw
基本的にＡＭＰページは シンプルな表示になります。
では 実験開始だw
文字関連
色や大きさ変更の 基本的な 文字関連を チェキラ
文字の色
色の違う文字
背景の色が違う
spanタグ使えば直書きでも 大丈夫
〆(ﾟ▽ﾟ*) ﾒﾓﾒﾓ
文字の大きさ
大きい字
小さい字
太字
斜め
下線
こちらも同じく大丈夫
〆(ﾟ▽ﾟ*) ﾒﾓﾒﾓ
画像・動画関連
YouTube
まあ YouTubeは大丈夫だよね
Googleの子会社だし
アニメーションGIF
表示されるとは 思わなかったw
アニメーションGIFが行けるのは朗報です。
その他
ブログカード
ブログカードは 上手く行かないぽい
〆(ﾟ▽ﾟ*) ﾒﾓﾒﾓ
ページの表示自体が 大きく崩れるので 結果のみ
一応 こちらのページの下部のような崩れ方になってます
修正される日はくるのだろうか
wordpressの運営とGoogle次第かなw
Googleマップのiframe埋め込みをAMP化する方法
↑を 応用すれば ブログカードも行けそうな予感‼
広告
コメント