Googleアドセンス合格のためのメモ2016年10月版その3『高速化に使用したタグ・サイト』


スポンサーリンク


皆さんこんにちは!ナナシちゃんです。

今回は、Googleアドセンス一次審査合格に向けてのカスタマイズした事(使用したタグやサイト)について、書かせていただきたいと思います。

あくまで、ワタクシの借りているレンタルサーバーにてできる事のみになってしまいますので、参考になるかわかりませんが、試してみてください。

 

it

 

PageSpeed Insightsを使用してフィードバックを得る

『PageSpeed Insights』にアクセスして、自分のサイトのURLを入力するとページの状態を知ることができます。

85点以上だと緑で結果が出て、Google先生からも、かなり早いページと評価されるとの事です。

黄色ならまぁまぁ、赤なら重すぎて閲覧者が帰ってしまう原因になってしまいますので、表示された改善点をもとに修正していきましょう。

因みに『PageSpeed Insights』を使用して修正したことは

  • 『.htaccess』(ドットエイチティーアクセス)にタグを入力
  • 画像の圧縮

です。

 

『.htaccess』にタグ入力

『.htaccess』はテキストファイルです。存在しない方は、自作する必要があるようです。メモ帳で製作するとよさそうです。

※但し、今回ワタクシは自作しておりませんので、各自、提供サイト様からお調べください。

ワタクシのレンタルサーバーには存在しておりましたので、そちらに入力しました。

※『.htaccess』の記述には十分注意をしてください。ミスをしてしまうと、最悪、下記の事が起こります。

  1. ホームページが表示されない
  2. サーバエラー500番台が表示される

 

スポンサーリンク


mini bird(ミニバード)の場合

ワタクシが利用しているレンタルサーバーmini birdです!

理由は、鳥さんが好きだからです(笑)とっても可愛いです(*´ω`)

因みにドメインは『Netowl』の『スタードメイン』から取得し、ミニバードの毎月のレンタル代を数百円に抑えています。これに関してはまた別記事を書くかもしれません。

※ミニバード以外のサーバーでも、ファイルマネージャーにたどり着ければ、『.htaccess』までたどり着けると思います(ファイルが存在していればw)

ミニバード

ログインして、『FTPアカウント設定』から、変更したいドメインを選択します。(画像が見にくくてすみません;)

ミニバード

『Web FTP』の項目からログインすると、『ファイルマネージャー』を開きます。

mini3

『.htaccess』のテキストアイコンから、開いてダグを入力していきます。

コピペすればいいのですが、ちゃんと機能するかどうかの保証はできません。

コピペが完了しましたら、速度をチェックしていただき、点数が上がってれば機能していると思います。

 

ウェブサイトのブラウザにキャッシュさせる記述

<ifModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 30 minutes"
ExpiresByType text/html "access plus 10 seconds"
ExpiresByType image/jpg "access plus 7 days"
ExpiresByType image/jpeg "access plus 7 days"
ExpiresByType image/gif "access plus 7 days"
ExpiresByType image/png "access plus 7 days"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 month"
</ifModule>

 

ファイルを圧縮して高速化する記述

<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
</IfModule>

 

画像ファイル以外を圧縮して高速化する記述

<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4¥.0[678] no-gzip
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ¥bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI¥.(?:gif|jpe?g|png)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _¥.utxt$ no-gzip
</IfModule>
 

スポンサーリンク


ワタクシの記述は

ファイルを圧縮&画像ファイル以外の圧縮なので、2種類くっつけてます

<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
#DeflateCompressionLevel 4
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
</IfModule>

この記述は、どこかのブロガーさんの記述を参考にさせていただいたのですが、すぐに探せなかったので(ブックマークから消えてる( ;∀;))
見つけ次第、追記させていただきます。

 

画像を圧縮するサイトを利用する

tinypng』こちらのサイトにて画像をドロップすると、物の数秒で自動で圧縮されますので、圧縮されたデータをダウンロードして終わりです。

『png』ファイルだと60~80%くらいの圧縮になりますので、かなりサイズが小さくなると思います。

圧縮サイト

 

因みに上記と同時進行に行っていたこと

  • パーマリンクの見直し
  • 見出しの製作

です。

パーマリンクは早い段階で修正していったほうが良かったらしいので、ブログを作ったばかりの人は、先にやっとく事をお勧めします。

また、見出しがあると読み手が、大体の内容を把握するにも良いと思うので取り入れてみました。

 

まとめ

これまで書かせていただいた事をやったことによって、『PageSpeed Insights』での点数が、74点→91点になり、ページの表示する速度がかなり早くなりました。

閲覧者様への負担が減ったと言うことになります!

経験上、やはりページの表示が遅くて帰ってしまうこともあったので、アクセスしていただくためには、とても重要な要素と言えるでしょう。

 

タグだけの内容で、かなりの文字数になってしまいましたので(3000文字くらいw)

取り入れたプラグインに関しましては、別記事で書かせていただきたいと思っております。

ここまでお読みいただきありがとうございました。

それでは、また☆彡

スポンサーリンク



 

 


関連記事