タグ

Wordpressとampに関するminoru-okuyamaのブックマーク (3)

  • 【長文】WordPressでAMP対応をしたので、やったことをまとめてみる | 今日も8時間睡眠

    先日「AMPについて、まじめに考えるか」と書きましたが、さっそく当サイトのAMP対応を行いました。今日はその作業内容をまとめてみます。 今日の記事は、技術的な話しかありません。 AMPとは AMPは、Googleなどが主導する、モバイルでのサイト閲覧の高速化を目指すプロジェクトのことです。高速化は、キャッシュの仕組みやページの軽量化により実現されています。サイト作成者がAMPに対応するには、「AMP HTML」というフレームワークの仕様に従ったページを作成しないといけません。 サイトによっては、AMP対応ができない場合もあります。AMP対応時に障害になりそうなものを挙げておきます。 JavaScriptが使えない(ただし、後述の通り、AdSenseGoogle Analyticsは可) 外部cssも使えない(内部スタイルシートの上限は約50kb) 使えないタグや使用に制約のあるタグがある

    【長文】WordPressでAMP対応をしたので、やったことをまとめてみる | 今日も8時間睡眠
  • PHPでCSSやJavaScriptを縮小化するWordPressカスタマイズ方法

    WEBサイトのCSSや、JavaScriptは、高速化の観点から、縮小化(余計な改行や スペース、コメントを取り除く)した方が良いとされています。 PageSpeed Insightsで、よく注意されるアレです。 ただ僕の場合、リソースを縮小化してしまうと、開発者ツールでデバッグがしづらいですし、不具合の原因にもなり得るため、あまり使用してきませんでした。高速化や、SEO的効果といっても、対応する面倒さ以上の効果もあまり感じないですし。 けれど、最近AMPなるものも出てきました。 これに対応させるには、CSSの総容量を50KBまでに抑える必要があります。今までは、CSSの総容量とかには、あまり気を遣う必要がなかったので、縮小化などは「まぁいいや」程度に思っていました。けれども、総容量に制限のあるAMPでは、なるべく多くのスタイルを書くとなると、縮小化は必要になってくるかもしれません(50K

    PHPでCSSやJavaScriptを縮小化するWordPressカスタマイズ方法
  • WordPressをマジメにAMP(Accelerated Mobile Pages)対応させた話 #AMPlify | PSYENCE:MEDIA

    WordPressをマジメにAMP(Accelerated Mobile Pages)対応させた話 #AMPlify ku-suke 2016.10.06 474 6616395150 こんにちは、2016年中途入社のku-sukeです。現在はkidslyという保育園むけサービスのプロダクトオーナーを担当しています。今回は個人的にも注目しているAMP(Accelerated Mobile Pages)をこのテックブログに実装した話を書きたいと思います。特に、WordPressプラグインを入れるだけの簡易対応ではなく、フッターまわりやデザインの調整などをまじめに対応させたので、企業をはじめメディア運営をWordPressで運用されている方のお役に立てば幸いです。 事業サイドがAMPに乗っかるか考える事 - ku-sukeのブログ AMPとは? AMPとはAccelerated Mobile

    WordPressをマジメにAMP(Accelerated Mobile Pages)対応させた話 #AMPlify | PSYENCE:MEDIA
  • 1