.jetpack-lazy-image{display:none}ゲームと音楽と副業の「趣味でまったりお金を稼ぐ」ブログです。Insightsで安定して警告をくらっていたので、そろそろ修正してやろうと思いなんとか「good」評価をいただきました。「コードは使わない」「クリックだけでやってのける」ことを目標にしましたので、「サイトカスタマイズとか無理だわぁ」という人でも、10分くらいで結果が出せると思います。ついてまとめてあります。感想:らくできてよかった。images」のプラグインをインストールし有効化プラグインを動かすのに必要なAPIキーを取得するためにTinyfyに登録APIキーを入力しアップロードされた画像をすべて圧縮これでOKです。プラグイン利用前にできる部分だけやっちゃいましょう。スポンサーリンクWordPress画像サイズを見直すWordPressダッシュボードに、「設定」があるので、そのタブの中にある「メディア設定」をクリック。画像サイズを選ぶところがあるので、そちらでご希望に合わせたサイズに変更してください。「べつにこれは大きくなくていいな」とか感覚で画像サイズを選んでもいいと思いますが、画像サイズの使い道については考えておくといいと思います。中サイズはどのような画像を適用するのか。大サイズはどうするのか。今はモバイルもPCも同じサイトテーマで行う「レスポンシブ」な時代です。モバイルもPCも、同じ画像サイズを異なる画面サイズでみる場面が想定する必要があります。私は中サイズは300×300とかなり小さいサイズにしました。これは、私が利用するアフィリエイトの広告サイズが300pxを基本にしているからです。画像と広告を一緒のサイズにすることで親和性を高めているわけですね。今のところ、モバイルも大型化しても400pxくらいの幅だと思うので、300pxでもいいかな、と思いました。サイトの方針としてはたとえ画面幅が300pxであっても、高画質画像を利用したいという場合はあると思いますので、その場合は、倍の600pxくらいでもいいと思います。私はくそみたいなイラストを描いたりもしますが、せいぜい600px幅でしかつくらないので必要十分です。大きくされるとアラが見つかるのでうんぬん。スタンプやアイコン的な「別に細かいところはいいけど、なんとなく言いたいことを一瞬で伝えたい」画像を貼るときは中サイズ、みたいな使い方ですね。大サイズはCocoonサイズを意識Cocoonデフォルトの横幅は800pxなので「大サイズ」の横幅は800pxに合せています。「大サイズ」の縦サイズは上限を多めに設定しています。することで、少し縦長の画像でも、横幅を毀損することなく貼り付けることができます。いうことなので、わいひらさんにならって横幅を800pxにするのがお勧めです。縦長の画像に関しては、どれくらい縦長を許容するか、で決めるのがいいと思います。私はある程度はアプリなんかで正方形に近づけてカットしたりするので、1600pxよりも小さくてもいいな、と思っています。スマホの縦横アスペクト比で考えてもいいほとんどのスマホユーザーはデジカメは使わずスマホでとった写真をそのままブログにアップされることでしょう。デジカメを持ち歩く習慣はなくなりました。iPhoneの場合、基本的には写真は縦:横は4:3の比率でつくられます。横幅が800pxなら、縦は1066pxですね。画面はiPhoneXなどのベゼルレスなデザインのせいで縦長化が進んでおります。どこに照準を合わせるかは難しいところですね。ちなみに、普通のスマホはだいたい16:9、縦長系はアスペクト比は18~19:9といったところです。仮に横幅を800pxで合わせると、1433px、縦長対応なら1600pxですかね。わかりやすいのが1600pxなので、「最新スマホで画面いっぱいになる画像を使用したい」という要求まで答えるためには幅800pxに高さ1600pxという画像サイズにしておくと、困ることは少ないと思います。わいひらさんのCocoonオススメサイズはこちらおすすめのWordPressメディアサイズ設定これを設定しておくと、今後の画像サイズ設定の時に便利です。次に紹介するプラグインでも画像サイズに合わせた圧縮をかけてくれるので先にやっておいたほうがいいですよ。スポンサーリンクいらない画像を削除するやはり画像サイズは馬鹿でかいので、いっそ不要であれば削除してしまいましょう。記事中はリライトの際に見直していけばいいとして。ウィジェットなどで生成される「記事一覧」を対策サムネイルを取得して表示しているものも、なんだかんだで処理に時間がかかるので「いらないな」とおもったら消すのもアリかと思います。これで負担はだいぶ減りました。画像圧縮をかける前だったので、処理量も多かったのだと思います。記事一覧から画像だけ消すあるいは、画像をなくして文字リンクだけにしてしまうのもいいですね。サイドバーは、だれも見てないですし。文字リンクの方がクリックされる、という場合もありますし。image{display:none}で消せると思いますが、処理が軽くなるかどうかはなんとも。(おいおい)あるいは、備え付けウィジェット機能の「最新の投稿」でもいいですね。Jetpackで「人気記事」ウィジェットを使ってリンクはCSSで目立たせてもいいかも。アイキャッチも表示しないようにするアイキャッチを記事の一番上に設定している方も、もしアイキャッチが不要だと感じれば消してもいいと思います。これはCocoon設定の「画像」のタブ内に設定項目があるので、消すのも出すのも簡単です。アイキャッチは考え方が難しいな、と思うのですが。スマホサイズにかえるとPCで見たときは小さい画像がちょこんとでてきて見栄えが悪いし。大きいサイズにしておくと処理が遅くなるし。なくしてしまっているのが当サイトです。使用するプラグインはこちら。imagesTinyPNGのサイトを利用している方も多いと思いますが、そのプラグインバージョンです。結果から言いますと、このプラグインで圧縮することで「警告」レベルだった我がサイトが「標準」レベルまで持ち直しました。くまさすがにgood!まではもらえませんでした。Optimizerを利用していたこいつがまったく息してないですね。Optimizerで一括最適化してみたのですが、うんともすんとも。images」というプラグインになります。サイト高速化しようと思うまでは私は存じ上げなかったのですが、どうやら「画像は圧縮してからアップロード」というのは、もうブロガーの基本だったようです。くまうん、知らなかったよ、知らなかったさ、誰も教えてくれやしない!孤独な一匹狼ブロガーとしては、とにかく自分で調べる。03:17時点)Amazonの商品レビュー・口コミを見るAmazon楽天Yahoo!ショッピング1ヶ月500枚という利用制限ありこのプラグインだと、1ヶ月で利用できる枚数が制限があります。1ヶ月で500枚です。私は記事更新はせいぜい1ヶ月5本程度。1本あたりアイキャッチとプラスして2〜3枚程度なので、余裕ですね。必要十分だと思いますが、足りない分はサイトで直接圧縮かけるのを併用すればいいし、有料で1枚1円くらいでできるので補完的に有料利用もOKです。プラグインを使わずともサイトで直接圧縮も可能TinyPNGというサイトがあります。https://tinypng.com/こちらに画像データを投げ入れると、勝手に圧縮してくれます。この時に、すでにある程度画像の大きさをいじっておくと後が楽でいいですね。Optimizerはプラグインから削除とりあえず意味がないことがわかったので、EWWWは削除しました。設定をいじればもう少しまともになったり、有料版でさらに最適な画像圧縮がかけられるようなので、有料利用が前提なのかもしれません。Optimizerはサイズ調整は得意サイズを適切なサイズにカットするのは得意なようなので、TinyPNGで圧縮してからアップロードすることでそれぞれの機能をいいとこどりできるかもしれません。AMPには有効だったかまだ確証はしていないのですが、EWWWを無効化してから、どうにもAMPに対応したページは点数がガクッと落ちました。くま今まではAMPのページはGood!とお褒めの言葉をもらっていたのに!EWWWがAMPの画像に関しても縮小処理をかけてくれていたのかもしれません。AMPが遅い理由は全て「画像圧縮しろよ」というメッセージなので、おそらくこのプラグインだとおもうのですが。追記:やはりプラグインでもない様子あくまで私的運用の結果ですが、圧縮アップロード後にEWWWを有効化してしばらく運用してみましたが、とくに警告メッセージは変わりませんでした。完全にEWWWはアウトにしています。images」の使い方ここからは実際にプラグインを使用して、がんがん圧縮をかけていこうと思います。images」をインストールまずは、なんにせよプラグインをダウンロードしてください。WordPressのダッシュボード、「プラグイン」の項目を選びます。上部に「新規追加」があるのでクリック。プラグイン検索してみてください。プラグインは単語ごとで検出をかけているので、しっかりコピペしてください。忘れずに「有効化」してくださいね。「プラグイン」から「Setting」をクリック。account」の、名前とアドレスを入力して送信。画像圧縮|Tinyfyからメールがくるメールを受信するので、メール内にあるリンクボタンからHPのダッシュボードに移動してください。そこに「APIキー」という長い暗号みたいなものがあるのでコピーしてください。images」のプラグイン設定画面から、APIキーを入力してください。これで利用できるようになりました。sizes」だけ設定を直してください。チェックが多すぎると月間利用数が減ってしまいます。正確にいうと、圧縮する数が増えます。Optimization」というのがあるので、選択。Optimizationというボタンがあるのでそこをクリック。すると、圧縮処理をはじめてくれます。このページは終わるまで開いておいてください。各パラメーターコストが書かれていますが、有料版に勝手に移行することはありません。月間制限枚数を超えた場合、メールで通知してくれます。うっかり有料で支払っても、一枚1円くらいなので、よほどのことがない限り何万円もとられたりはしないので大丈夫よ。くまなんか、何もしないうちに圧縮できました。images」を利用することで、一度、EWWWの最適化をかけた後でも、50%ほど画像データがサイズダウンしてくれました。設定の都合もありますが、この記事数50程度のサイトでも月間利用数400/500まで使用することに。記事が多く、画像が多いサイトだと、一回は有料利用でサイズダウンしちゃった方が労力カットもできそうですね。実際、メインサイトだと全然足りませんでした。月末に実施したので、2ヶ月分の枚数(1000枚)で処理できましたけども。根本的に「画像がいるかいらないか」も再検討これですね。感想:らくできてよかった。サイト高速化においては画像の見直しは避けては通れませんね。プラグインでらくらく一括して画像処理ができてよかったです。ブログ高速化のためにやった5つの方法|WordPressテーマはCocoonサイト高速化のためにやることはシンプルです。要は、画像を減らして圧縮する。これだけでほぼ解決します。体感速度はまったくトラブルなし。Insightsの評価は残酷なものです。なんとか、コードやカスタマイズ不要で高得点を出した記録を公開します。サイト高速化スポンサーリンクシェアするTwitterFacebookはてブPocketLINEコピーぶちくまをフォローするぶちくまぶちくま創作ベース関連記事サイト高速化ブログ高速化のためにやった5つの方法|WordPressテーマはCocoonサイト高速化のためにやることはシンプルです。要は、画像を減らして圧縮する。これだけでほぼ解決します。体感速度はまったくトラブルなし。Insightsの評価は残酷なものです。なんとか、コードやカスタマイズ不要で高得点を出した記録を公開します。Cacheを導入ページキャッシュをつくると、サイトの表示速度が改善されます。プラグインを導入するだけで簡単にできるので初心者の方にお勧めの方法です。Insights」でも10点ほど上がる効果がみられました。キャッシュ導入は一歩間違えると大きなエラーが起きるので注意が必要です。2018.08.05サイト高速化エックスサーバー利用者なら簡単にサイト高速化ができる方法を伝授!サイトを高速化するために、エックスサーバーのmod_pagespeedの設定をONにしました。2クリックでできる、最も簡単な方法だと思います。画像を多用してわかりやすいように解説しています。Insightsの点数がだいたい5点くらい上がるようなイメージです。配信を最適化」の処理に手を焼いているようでれば解決策として考えられるのがhead部分をきれいにすること。Insightsの得点をあげる奥の手としてプラグインを使って簡単に解決した方法をまとめています。2018.08.04サイト高速化CDN導入のためにJetpackとCloudflareを使った感想CDNを導入すべくJetpackとCloudflareを使ってみました。使用感でいうとJetpackはとにかく簡単で安定感あり。Cloudflareはかなり暴れ馬でめちゃくちゃ速くなったけどいろいろエラーは吐き出している。サーバーが落ちる可能性も考えると、どちらがいいかしっかりと考える必要がありそうです。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。Cacheを導入Headをすっきりさせて読み込みを早くするお勧めのWPプラグインエックスサーバー利用者なら簡単にサイト高速化ができる方法を伝授!CDN導入のためにJetpackとCloudflareを使った感想オススメの記事CocoonのカスタマイズをするならCocoonカスタマイズは初心者でも簡単にできる【おすすめ一覧】サイト高速化の手引きブログ高速化のためにやった5つの方法|WordPressテーマはCocoon記事の検索プロフィールぶちくまぶちくま:白いもふもふの毛皮を被った医療系社畜兼ブロガー。Cacheを導入Headをすっきりさせて読み込みを早くするお勧めのWPプラグインエックスサーバー利用者なら簡単にサイト高速化ができる方法を伝授!CDN導入のためにJetpackとCloudflareを使った感想オススメの記事CocoonのカスタマイズをするならCocoonカスタマイズは初心者でも簡単にできる【おすすめ一覧】サイト高速化の手引きブログ高速化のためにやった5つの方法|WordPressテーマはCocoon記事の検索プロフィールぶちくまぶちくま:白いもふもふの毛皮を被った医療系社畜兼ブロガー。「遊びを副業に変える」をモットーに、ブログで情報を発信してます!詳しいプロフィールはこちら!ぶちくまをフォローする人気のある記事アークナイツの課金アイテムをまとめる【買ってはいけない】2020.01.242020.01.31幻影戦争の装備・武器クラフトについて知りたい2019.12.062020.02.21ブレイドエクスロードの適正パーティーの組み方2019.11.012020.02.11アルカラストの効率的な育成手順【素材もないし金もない】2019.08.182020.01.28アルカ・ラストの最強パーティを決めたい【無課金】2019.10.24応援クリック大歓迎!人気ブログランキングにほんブログ村フォローボタンぶちくまをフォローするカテゴリーイラスト2ゲーム176FFBE幻影戦争12KHUx6TEPPEN12ぷよぷよクエスト4アルカラスト8アークナイツ10アートオブコンクエスト18ゼノンザード10デュエルリンクス28ドラガリアロスト3ドラクエライバルズ1ハンドレッドソウル8ブラウンダスト12ブレイドエクスロード10ヴァルキリーアナトミア6最果てのバベル28ブログ52Cocoon19カスタマイズ2サイト高速化6Simplicity4Xeory2ブログ運営15WordPress5スパルタブログ論2収益化5副業のすすめ13ゲームライター6動画配信2読書2小説1漫画1音楽3リスニング2スポンサーリンクタイトルとURLをコピーしました。