[ブロガー向け]これからAMP対応すべくCSSを編集しようと思っている方へ

Wordpress(ワードプレス), ブログ

みなさんどうもAMP!毎日毎日CSSとにらめっこしてる@xi10jun1です。

みなさん、AMP対応してますか?僕はバリバリAMP対応しているんですが、正直キツイところが多々あります。

そこでこれからAMP対応を目指す、特にブロガーさんでCSSを編集したい方に覚えておいて欲しいことがあります。

AMPのCSSマジで面倒

とにかくAMPのCSSはマジで面倒です。

技術的な話は長くなるので割愛しますが、おそらくブロガーさんでありがちなのは次の項目でしょう。

!importantでエラー

AMP用CSSファイル50KBオーバーのエラー

なんかよく分からないエラー

!importantでエラー

最近はあまり見なくなったような気もしますが、通常、!importantを使うことで『ここのコードが最優先!』と適用させることができます。

ところがこれ、AMPではサポート外なのでエラーが出ます。

最近はどのテーマにも独自でCSSを編集できるページが設けられているようですが、そこにどこかの『コピペで使える!』的なサイトからコードをコピペしたときに含まれる『!important』を、AMPのCSSにも適用されることでエラーが起こります。

なので『!important』を使っていないか、チェックしたほうが良いでしょう。

AMP用CSSファイル50KBオーバーのエラー

AMPのCSSはファイル容量が50KB以下にならなければなりません。

しかし、特に『ヨメレバ』『カエレバ』『トメレバ』をオシャレにしてくれるCSSのコードをお使いの方は、これをCSS用のコードとして利用すると、他のAMP用のCSSを圧迫してしまうことがあります。

結果50KBを超えてしまいエラーになることがあるので、セレクタを短くするなどして対応しましょう。

なんかよく分からないエラー

実はAMP対応でよく起こるのがこのよく分からないエラー。

コードは問題ないのに、サーチコンソールから『カバレッジの問題がー』『ソフト404エラーがー』など、よく分からないエラーが出てくることがあります。

コードを更新したあとにキャッシュを消すなどすると対応できるときもありますが、原因がはっきりしない場合もあるので注意しましょう。

まとめ:AMP対応は無理しない

もう無理だと思ったら下手に手を出さないほうがいいです。

ここに挙げたのは僕が引っかかったエラーなので、参考になれば幸いです。

~注目:M&Aマッチングサービス~

現在、景況感の悪化に伴い、M&Aマッチングサービスで事業やサービス、メディアを売却する動きが出ています。下記記事に詳細をまとめましたので、資金繰りの案としてご検討ください。

[2020年最新版]事業や資産の売却(資金繰り)に使えるM&A(事業継承)マッチングサービスまとめ

スポンサーリンク


※このメッセージは1年以上前の記事(当記事最初の更新は2019年4月14日)に出るものです。最新の情報と異なる可能性がありますので、公式サイトへアクセスするか別途お調べください。