AP.NETで、以下のような「パーサー エラー メッセージ: 型 'XXX' を読み込めませんでした。」といったエラーがIEに表示される場合、
-------------------------------------------------------------------
'XXX' アプリケーションでサーバー エラーが発生しました。
パーサー エラー
説明: この要求の処理に必要なリソースの解析中にエラーが発生しました。以下の解析エラーの詳細を確認し、ソースファイルに変更を加えてください。
パーサー エラー メッセージ: 型 'XXX' を読み込めませんでした。
ソース エラー:
行 1: <%@ Page language="c#" Codebehind="XXX.aspx.cs" AutoEventWireup="false" Inherits="XXX" %>
ソース ファイル: XXX.aspx 行: 1
-------------------------------------------------------------------
それは、IISで設定されているアプリケーションのフォルダの中のbinに、該当のクラスのDLLファイルがないことを意味します。
したがって、以下の事項をよく確認してみてください。
1.IISのツリーをよく見て、アプリケーションのフォルダが設定されていることや、必要以上のフォルダに設定されていないことを確認する。
2.アプリケーションとして設定されているフォルダをエクスプローラーで開き、その中のbinフォルダに、該当のクラスのDLLがあることを確認する。
2019年6月21日金曜日
2018年8月6日月曜日
IEのアドレスバーで検索するとcse.google.comにリダイレクトされる
Internet Explorerのアドレス欄にキーワードを入れて検索すると、デフォルトとして設定しておいた検索サイトで検索した結果が表示されるはずが、あるときから突然「cse.google.com」から始まるアドレスのGoogleカスタム検索に変わってしまいました。Internet Explorerの設定をどのように触ってももとに戻ることはなく、Internet ExplorerだけでなくGoogle chromeでも同じようになってしまいます。
調べてみるとどうやらマルウェアに感染したようです。ウェブブラウザをジャックするタイプのマルウェアが存在するようです。
修復方法を紹介する海外のウェブサイトでは、ウェブブラウザの設定の他、レジストリ、hostsファイル、プロキシーサーバー、DNSの設定が書き換えられた可能性を指摘していましたが、それらの状態を見てみたところ、異常は見つかりませんでした。やはり、そう簡単には元に戻せないように仕組まれているようです。
このマルウェアは、おそらくインターネットからダウンロードしたなんらかのソフトに付属していたものでしょうが、記憶が定かではありません。
結局、Malwarebytesというマルウェアに強い対策ソフトを使い、元に戻すことができました。私は、その14日間の体験版を使いましたが、無料の機能限定版でも駆除することができるようです。
Malwarebytesによるスキャンの過程で、いくつかレジストリやファイルが削除されました。今回のマルウェア以外にもなにかおかしなものが含まれていたのかもしれません。
そのログの中で、一番怪しかったのが「C:\Program Files (x86)\Smart Application Controller」というものです。これが、ウェブブラウザをジャックした犯人かもしれません。
私のパソコンにはトレンドマイクロのウィルスバスターを入れてはいるのですが、それではこのマルウェアを検出できなかったようです。ウィルスバスターは人気がありますが、残念ながら性能はいまいちです。まだ一年以上ライセンスが残っていますので、もうしばらくは使いますが、次は他のものに乗り換えようかと思っています。
調べてみるとどうやらマルウェアに感染したようです。ウェブブラウザをジャックするタイプのマルウェアが存在するようです。
修復方法を紹介する海外のウェブサイトでは、ウェブブラウザの設定の他、レジストリ、hostsファイル、プロキシーサーバー、DNSの設定が書き換えられた可能性を指摘していましたが、それらの状態を見てみたところ、異常は見つかりませんでした。やはり、そう簡単には元に戻せないように仕組まれているようです。
このマルウェアは、おそらくインターネットからダウンロードしたなんらかのソフトに付属していたものでしょうが、記憶が定かではありません。
結局、Malwarebytesというマルウェアに強い対策ソフトを使い、元に戻すことができました。私は、その14日間の体験版を使いましたが、無料の機能限定版でも駆除することができるようです。
Malwarebytesによるスキャンの過程で、いくつかレジストリやファイルが削除されました。今回のマルウェア以外にもなにかおかしなものが含まれていたのかもしれません。
そのログの中で、一番怪しかったのが「C:\Program Files (x86)\Smart Application Controller」というものです。これが、ウェブブラウザをジャックした犯人かもしれません。
私のパソコンにはトレンドマイクロのウィルスバスターを入れてはいるのですが、それではこのマルウェアを検出できなかったようです。ウィルスバスターは人気がありますが、残念ながら性能はいまいちです。まだ一年以上ライセンスが残っていますので、もうしばらくは使いますが、次は他のものに乗り換えようかと思っています。
2018年6月28日木曜日
WordPressのPolylangでヘッダー画像が表示されない
WordPressのPolylangで多言語化した際に、デフォルトの言語以外では、ヘッダー画像がランダムで変更されなくなりました。
調べたところ、「言語」→「設定」の中にある「メディア」の項目を無効化すると、デフォルトの言語以外でも、ヘッダー画像がランダムで表示されるようになりました。
言語ごとに画像を変更できるようにする機能だと思いますが、それが必要ないなら無効化しても問題ないと思います。
調べたところ、「言語」→「設定」の中にある「メディア」の項目を無効化すると、デフォルトの言語以外でも、ヘッダー画像がランダムで表示されるようになりました。
言語ごとに画像を変更できるようにする機能だと思いますが、それが必要ないなら無効化しても問題ないと思います。
2018年6月21日木曜日
自宅のルーターを遠隔でリセットする方法
自宅に24時間稼働のWebサーバーを置いています。それがルーター経由でインターネットにつながっています。ルーターはNEC製のAterm WR8700Nという古いものですが、機能や性能は十分備わっているので、いまだに使っています。WiFiのアクセスポイントとしても使えます。このルーターは基本的には安定稼働してくれているのですが、まれにフリーズすることがあります。熱で暴走するのかとも思いましたが、フリーズするのは暑い時期だけではないので、ルーターの中のファームウェア等に問題があるのではないかと思っています。100%の信頼性こそありませんが、99%は正常に動作しているのでだいたいは問題なく使えています。
ただ、めったにフリーズしないとは言え、会社に出勤していたり、旅行で家を離れている時が心配です。フリーズを回復するにはコンセントを抜いて、さしなおすしか方法がありません。それをするには自宅にいる必要があります。
特に海外旅行に出ているときは、数日間、家に帰れませんから手も足もでません。
それを解決する方法を考えていたのですが、スマートコンセントというのがあるのを見つけました。コンセントの電源オンオフをスマホから操作できるものです。
スマートコンセントはWiFiでインターネットにつながります。それをスマホのアプリからインターネット経由で操作できます。実際にやってみたところ、スマホから電源操作した瞬間に即時スマートコンセントの電源も切り替わります。
しかし、問題があって、ルーターがフリーズすれば、ルーターのWiFi機能も止まってしまいます。そもそもルーターの電源をオフにするということは、インターネット接続自体が止まります。
ということは、スマートコンセントをコントロールするためのWiFiは別系統で用意する必要があるということです。それには、別途WiFiルーターを用意するか、あまっているスマホがあれば、格安SIMを使ってテザリングする方法が考えられます。私の場合は賃貸マンションに住んでいて、J:COMの無料WiFiが使えることを思い出しました。そのためにさっそくJ:COMに連絡をとり、無料のWiFiを設置してもらいました。最大12Mbpsという、低速回線ですが、スマートコンセント用としてはなんの問題もありません。
これで、海外にいてもスマホから、ルーターのリセットが可能になりました。
ちなみに、Aterm WR8700Nには、WOL(Wake On LAN)のパケットを送信する機能も備わっていますし、ルーターやサーバーはUPSにつながっています。よほどのことがなければ遠隔管理に問題はなさそうですが、サーバー自体がフリーズした場合は、完全な対処はできません。いちおう、2台目のバックアップサーバーがあるので、そちらに切り替えることはできますが、フリーズしたメインサーバーの再起動やリセットには、電源ボタンやリセットボタンを操作する仕組みが必要です。
ただ、めったにフリーズしないとは言え、会社に出勤していたり、旅行で家を離れている時が心配です。フリーズを回復するにはコンセントを抜いて、さしなおすしか方法がありません。それをするには自宅にいる必要があります。
特に海外旅行に出ているときは、数日間、家に帰れませんから手も足もでません。
それを解決する方法を考えていたのですが、スマートコンセントというのがあるのを見つけました。コンセントの電源オンオフをスマホから操作できるものです。
スマートコンセントはWiFiでインターネットにつながります。それをスマホのアプリからインターネット経由で操作できます。実際にやってみたところ、スマホから電源操作した瞬間に即時スマートコンセントの電源も切り替わります。
しかし、問題があって、ルーターがフリーズすれば、ルーターのWiFi機能も止まってしまいます。そもそもルーターの電源をオフにするということは、インターネット接続自体が止まります。
ということは、スマートコンセントをコントロールするためのWiFiは別系統で用意する必要があるということです。それには、別途WiFiルーターを用意するか、あまっているスマホがあれば、格安SIMを使ってテザリングする方法が考えられます。私の場合は賃貸マンションに住んでいて、J:COMの無料WiFiが使えることを思い出しました。そのためにさっそくJ:COMに連絡をとり、無料のWiFiを設置してもらいました。最大12Mbpsという、低速回線ですが、スマートコンセント用としてはなんの問題もありません。
これで、海外にいてもスマホから、ルーターのリセットが可能になりました。
スマホから簡単操作
ちなみに、Aterm WR8700Nには、WOL(Wake On LAN)のパケットを送信する機能も備わっていますし、ルーターやサーバーはUPSにつながっています。よほどのことがなければ遠隔管理に問題はなさそうですが、サーバー自体がフリーズした場合は、完全な対処はできません。いちおう、2台目のバックアップサーバーがあるので、そちらに切り替えることはできますが、フリーズしたメインサーバーの再起動やリセットには、電源ボタンやリセットボタンを操作する仕組みが必要です。
2017年7月11日火曜日
HTMLでテキスト、コンボボックス、ボタン等の縦位置を揃える方法
HTMLでテキスト入力欄やコンボボックス、ボタン等を横に並べてレイアウトした際に、それぞれの項目の高さが異なることで、縦位置が揃っていないように見えることがある。各項目の縦サイズを変更したり、marginやpaddingで上下位置を調整しようとしても、反映されなかったりして、なかなかうまくいかない。そもそも、縦位置を揃える必要があるのかということはある。普通はウェブブラウザが配置しているものを任せておけばいい。変に細かい調整を入れると、後々のメンテナンス性が悪くなる。後で見た他の人はどこをどう変えるとどなるのか、把握するのが困難になる。何もせず、ウェブブラウザがするように任せておくのが、一番いい。
とはいえ、それでも縦位置を揃えたいという場合には、float:leftを使う方法がある。すべての項目を左上に詰めていくことで、上端を揃えることができる。ラベル項目はspanで囲めばよい。その後は各項目にpadding-top等を入れて微調整することができる。
とはいえ、それでも縦位置を揃えたいという場合には、float:leftを使う方法がある。すべての項目を左上に詰めていくことで、上端を揃えることができる。ラベル項目はspanで囲めばよい。その後は各項目にpadding-top等を入れて微調整することができる。
2017年7月7日金曜日
ロリポップのひとつのファイルサイズの上限はいくらまでか
ロリポップのライトプランというのを使っているのですが、FTPでアップロードできるファイルサイズの上限はいくらまでか、実際にアップロードして試してみました。
結果は、2Gバイト(2,147,483,648バイト)で、アップロードが停止しました。ひとつのファイルサイズの上限は2Gバイトのようです。
結果は、2Gバイト(2,147,483,648バイト)で、アップロードが停止しました。ひとつのファイルサイズの上限は2Gバイトのようです。
2017年6月13日火曜日
ソースとしての信憑性に弱いインターネットの記事
古い話だが「日本死ね」と書かれたブログだったか、ツイッターだったかが、国会で取り扱われたことがある。保育園に自分の子供を入園させることができない状況である日本に対して文句を言っているものである。
それはいいとして、思うのがインターネットのブログやツイッターに投稿された一般の人が書いた投稿というのは、特に事情がない限りはあまり特別に扱う必要はない。このブログもそうである。一個人が適当なことを書いているだけのものであり、なんとでも書くことができるし、責任もない。そのようないいかげんなものをひとつの事例として国会で取り上げるというのは違和感がある。
例えば、
「太陽は西から上る。これは絶対に全世界的に普遍的で正しいことだ。」
と、このようにインターメットには嘘を簡単に書くことができる。昇るではなく上るという誤字も間違ったまま書くことができる。そして、ご覧のとおり削除されることも訂正されることもない。これを読んでいる方も、その気になれば、同じようにいくらでもインターネットに適当な嘘八百を書くことができる。こんな情報を信用できるだろうか。信用できるわけがない。
実のところ、それはインターネットに限らないし、個人が書いた記事だけの話でもないのだが、インターネットの個人の記事は特に信用できない。わざわざ間違ったことを書かないだろうという性善説による期待はできるが、裏付けはない。
ひょっとすると、インターネットには、正しいことを書かないと、問題になることがあると考える人がいるかもしれない。例えば名誉棄損とか営業妨害等だ。だから責任のある記事が書かれなければならないと思われる人がいるかもしれない。
だが、そのような責任が伴うのでは、誰もインターネットに気軽に投稿できないし、個人の投稿に対していちいちそのような責任を求めるのは現実的ではない。一個人が十分な裏付け取材をして、個人的な感情や思い込みがないよう精査してから投稿するなんてことはしない。思いついたことを適当に書いているだけだ。
インターネットは、個人で気軽に投稿できる仕組みなので、望む望まざるにかかわらず、そうならざるを得ない。
寿司屋のチェーンを経営している会社が、インターネットの記事に対して裁判を起こしたことがあった。記事が名誉棄損や営業妨害になるということだ。当然ながらそのような裁判を起こしても意味がない。その案件は記事内容が事実かどうかということも判断材料としてあったようだが、仮に事実でないことを書いたとしても、インターネットの記事に対していちいち事実と異なるからといって裁判をすること自体ナンセンスである。よほどの悪意があるとか、なにか特別な事情があればどうか分からないが、ほとんどの場合においてはありえない。
インターネットに対して、いい加減な記事を書いても罰せられないという意味ではない。それ以前に、インターネットの情報を個人が無責任に書いているのは、はなから常識だ。100%信用できないのは周知の事実である。でたらめかもしれないと誰でも分かっている記事に対して、でたらめなことを書くなと言うようなものだ。
仮に間違ったことや非難、批判がインターネットに書かれているからといって、誰もそれを真に受けていない。あくまでひとつの意見として参考にするだけで、様々な可能性のひとつであるだけである。
それはいいとして、思うのがインターネットのブログやツイッターに投稿された一般の人が書いた投稿というのは、特に事情がない限りはあまり特別に扱う必要はない。このブログもそうである。一個人が適当なことを書いているだけのものであり、なんとでも書くことができるし、責任もない。そのようないいかげんなものをひとつの事例として国会で取り上げるというのは違和感がある。
例えば、
「太陽は西から上る。これは絶対に全世界的に普遍的で正しいことだ。」
と、このようにインターメットには嘘を簡単に書くことができる。昇るではなく上るという誤字も間違ったまま書くことができる。そして、ご覧のとおり削除されることも訂正されることもない。これを読んでいる方も、その気になれば、同じようにいくらでもインターネットに適当な嘘八百を書くことができる。こんな情報を信用できるだろうか。信用できるわけがない。
実のところ、それはインターネットに限らないし、個人が書いた記事だけの話でもないのだが、インターネットの個人の記事は特に信用できない。わざわざ間違ったことを書かないだろうという性善説による期待はできるが、裏付けはない。
ひょっとすると、インターネットには、正しいことを書かないと、問題になることがあると考える人がいるかもしれない。例えば名誉棄損とか営業妨害等だ。だから責任のある記事が書かれなければならないと思われる人がいるかもしれない。
だが、そのような責任が伴うのでは、誰もインターネットに気軽に投稿できないし、個人の投稿に対していちいちそのような責任を求めるのは現実的ではない。一個人が十分な裏付け取材をして、個人的な感情や思い込みがないよう精査してから投稿するなんてことはしない。思いついたことを適当に書いているだけだ。
インターネットは、個人で気軽に投稿できる仕組みなので、望む望まざるにかかわらず、そうならざるを得ない。
寿司屋のチェーンを経営している会社が、インターネットの記事に対して裁判を起こしたことがあった。記事が名誉棄損や営業妨害になるということだ。当然ながらそのような裁判を起こしても意味がない。その案件は記事内容が事実かどうかということも判断材料としてあったようだが、仮に事実でないことを書いたとしても、インターネットの記事に対していちいち事実と異なるからといって裁判をすること自体ナンセンスである。よほどの悪意があるとか、なにか特別な事情があればどうか分からないが、ほとんどの場合においてはありえない。
インターネットに対して、いい加減な記事を書いても罰せられないという意味ではない。それ以前に、インターネットの情報を個人が無責任に書いているのは、はなから常識だ。100%信用できないのは周知の事実である。でたらめかもしれないと誰でも分かっている記事に対して、でたらめなことを書くなと言うようなものだ。
仮に間違ったことや非難、批判がインターネットに書かれているからといって、誰もそれを真に受けていない。あくまでひとつの意見として参考にするだけで、様々な可能性のひとつであるだけである。
2017年6月6日火曜日
Google Maps APIがIE11で正常に表示されない場合
Google Maps APIを使用した地図をInternet Explorer 11で表示した際に、地図のドラッグやマーカーのドラッグ等が正常に表示されない場合は、互換性表示になっている可能性があります。
IE11ウィンドウの右上の歯車アイコンをクリックし、表示されえたメニューから「互換表示設定」を選び、ダイアログの互換表示に追加されたウェブサイトに「google.com」がある場合は削除します。またローカル環境のサーバーのウェブページを表示している場合は、「イントラネットサイトを互換表示で表示する」のチェックもオフにします。
IE11ウィンドウの右上の歯車アイコンをクリックし、表示されえたメニューから「互換表示設定」を選び、ダイアログの互換表示に追加されたウェブサイトに「google.com」がある場合は削除します。またローカル環境のサーバーのウェブページを表示している場合は、「イントラネットサイトを互換表示で表示する」のチェックもオフにします。
2015年7月18日土曜日
Google Analyticsでダウンロードのコンバージョン(目標)を測定する
ウェブサイトを運営している人はアクセス解析としてGoogle Analyticsを使われている方も多いかと思います。
Google Analyticsではウェブページへのアクセスだけでなく、ファイルのダウンロード件数のようなものもカウントすることができます。
ファイルのダウンロードを目標として設定することで、ウェブサイト訪問者の目標達成率(コンバージョン率)を測定したりできます。
その具体的なやり方は、いたって簡単です。
通常のトラッキングコードは使いません。イベントにより測定します。
<A HREF="javascript:void(0);" ONCLICK="ga('send','event','download','click','file.zip');location.href='file.zip';">ダウンロード</A>
Aタグでダウンロードリンクを設定する場合、HREFにファイル名を書くと思いますが、JAVAScriptを動かしたいので、代わりにONCLICKに、Google Analytics用のコードとダウンロードファイル名を書いています。
2箇所あるfile.zipの部分を、ダウンロードするファイル名に置き換えることでこのまま使うことができます。
この例はAタグによるものですが、ONCLICKのイベントで動いていますので、ボタンのタグによるダウンロードでも、同じように使えます。
Google Analyticsの「アナリティクス設定」から「ビュー」の「目標」をクリックします。
「新しい目標」をクリックします。
目標の「名前」を適当につけて入力し、タイプの「イベント」を選択します。
入力したら「次のステップ」をクリックします。
イベント条件として以下を入力します。
カテゴリ:download
アクション:click
ラベル:ファイル名(ダウンロードのリンクに入力したファイル名です)
値:なにも入力しません
入力したら「目標を作成」をクリックします。
このように目標が作成されました。
測定されると「コンバージョン」メニューから結果を分析できます。
目標は20個まで作れますので、複数のダウンロードファイルがある場合でも、それぞれで測定することができます。
Google Analyticsではウェブページへのアクセスだけでなく、ファイルのダウンロード件数のようなものもカウントすることができます。
ファイルのダウンロードを目標として設定することで、ウェブサイト訪問者の目標達成率(コンバージョン率)を測定したりできます。
その具体的なやり方は、いたって簡単です。
通常のトラッキングコードは使いません。イベントにより測定します。
1.ダウンロードリンクにイベントを設定する
以下の様なコードをダウンロードリンクとして使用します。<A HREF="javascript:void(0);" ONCLICK="ga('send','event','download','click','file.zip');location.href='file.zip';">ダウンロード</A>
Aタグでダウンロードリンクを設定する場合、HREFにファイル名を書くと思いますが、JAVAScriptを動かしたいので、代わりにONCLICKに、Google Analytics用のコードとダウンロードファイル名を書いています。
2箇所あるfile.zipの部分を、ダウンロードするファイル名に置き換えることでこのまま使うことができます。
この例はAタグによるものですが、ONCLICKのイベントで動いていますので、ボタンのタグによるダウンロードでも、同じように使えます。
2.Google Analyticsで目標を設定する
Google Analytics側で、イベントを目標として測定するための設定をします。Google Analyticsの「アナリティクス設定」から「ビュー」の「目標」をクリックします。
「新しい目標」をクリックします。
目標の「名前」を適当につけて入力し、タイプの「イベント」を選択します。
入力したら「次のステップ」をクリックします。
イベント条件として以下を入力します。
カテゴリ:download
アクション:click
ラベル:ファイル名(ダウンロードのリンクに入力したファイル名です)
値:なにも入力しません
入力したら「目標を作成」をクリックします。
このように目標が作成されました。
3.測定されるのを待つ
あとは目標が測定されてGoogle Analyticsに結果が表示されるのを待ちます。測定されると「コンバージョン」メニューから結果を分析できます。
目標は20個まで作れますので、複数のダウンロードファイルがある場合でも、それぞれで測定することができます。
2015年7月16日木曜日
Bloggerでブログを作ったら入れておきたい2つのガジェット
GoogleのBloggerは、ブログを書くのにお勧めです。ブログ運営サイトの広告が表示されませんし、デザイン的にごちゃごちゃしていないからです。ブログを書く側も読む側も使いやすいのがBloggerです。
Bloggerには標準のテンプレートがあり、その中から好きなデザインのものを選ぶだけで、ブログをはじめることができます。
少し慣れて、使い方が分かってくれば、ガジェットを追加することでブログに画像を表示したり、リンクリストを表示することができるようになってきます。
ガジェットは選ぶだけで使えるものが豊富にあるのですが、実はそれだけでは実現できないこともあります。
ブログをはじめたら、ブログの訪問者に記事を読んでもらうための、以下の2つのガジェットを追加することをおすすめします。
最新の記事はブログの最初のページに表示されます。記事を追加していくと、どんどん下に流れていき、次のページ、次のページへと、奥の方に行ってしまいます。そうした古い記事も書いたからには、いつでも見てもらえるようにしておかなければ、たくさん記事を書いているメリットがありません。
そのために、ブログアーカイブというガジェットがあるのですが、実はこれだとあまり古い記事は読まれません。それは日付で管理されているためです。古くなった記事はタイトルが表示されなくなってしまったり、設定によってはまったく記事のタイトルが表示されません。
ブログ訪問者は日付だけを見ても、その記事を見たいとは思いません。記事のタイトルを見て、興味を持った時にその記事を読もうとします。ですので、古い記事もタイトルを出して見えるようにしておかなければ意味がありません。
そこで、本記事の横の方(サイドバー等)に記事のタイトルの一覧をずらずらっと表示するガジェットを追加して表示しておきます。本記事を読んだブログ訪問者は他の記事を探すために、その記事タイトルの一覧を見るはずです。
紹介するBloggerArticleListというガジェットを使って、少なくとも最新記事を10個程度表示しておきます。もっと古い記事はページをめくるように探すことができるようになっています。
BloggerArticleListはこちらで作ることができます。コードを生成して自分のブログに貼り付けるだけです。詳しい使い方はそちらのサイトに書いてあります。
他社のブログにあって、Bloggerにないものとしては、カレンダーがあります。
カレンダーはブログ訪問者が記事を探すのによく使います。ブログアーカイブがその代わりとなるものですが、カレンダー形式でないので、ブログ訪問者にはやさしくありません。
よくあるような日曜日から土曜日まで並んだカレンダーの表示方法で、記事のある日をクリックすると、その日の記事が表示されるようなものでなければなりません。
ブログに来た人は、どこまで記事を読んだか等をチェックするのにカレンダーを使いますので、記事を見てもらうためには必須のガジェットです。
そのためのガジェットはこちらのBloggerCalendarを使います。先ほどの記事リストと同じように、コードを生成して貼り付けるだけです。
ブログに来た人のために、まずは上記の2つのガジェットを追加しておくとよいでしょう。
Bloggerには標準のテンプレートがあり、その中から好きなデザインのものを選ぶだけで、ブログをはじめることができます。
少し慣れて、使い方が分かってくれば、ガジェットを追加することでブログに画像を表示したり、リンクリストを表示することができるようになってきます。
ガジェットは選ぶだけで使えるものが豊富にあるのですが、実はそれだけでは実現できないこともあります。
ブログをはじめたら、ブログの訪問者に記事を読んでもらうための、以下の2つのガジェットを追加することをおすすめします。
1.記事リストガジェット
最新の記事はブログの最初のページに表示されます。記事を追加していくと、どんどん下に流れていき、次のページ、次のページへと、奥の方に行ってしまいます。そうした古い記事も書いたからには、いつでも見てもらえるようにしておかなければ、たくさん記事を書いているメリットがありません。
そのために、ブログアーカイブというガジェットがあるのですが、実はこれだとあまり古い記事は読まれません。それは日付で管理されているためです。古くなった記事はタイトルが表示されなくなってしまったり、設定によってはまったく記事のタイトルが表示されません。
ブログ訪問者は日付だけを見ても、その記事を見たいとは思いません。記事のタイトルを見て、興味を持った時にその記事を読もうとします。ですので、古い記事もタイトルを出して見えるようにしておかなければ意味がありません。
そこで、本記事の横の方(サイドバー等)に記事のタイトルの一覧をずらずらっと表示するガジェットを追加して表示しておきます。本記事を読んだブログ訪問者は他の記事を探すために、その記事タイトルの一覧を見るはずです。
紹介するBloggerArticleListというガジェットを使って、少なくとも最新記事を10個程度表示しておきます。もっと古い記事はページをめくるように探すことができるようになっています。
BloggerArticleListはこちらで作ることができます。コードを生成して自分のブログに貼り付けるだけです。詳しい使い方はそちらのサイトに書いてあります。
2.カレンダーガジェット
他社のブログにあって、Bloggerにないものとしては、カレンダーがあります。
カレンダーはブログ訪問者が記事を探すのによく使います。ブログアーカイブがその代わりとなるものですが、カレンダー形式でないので、ブログ訪問者にはやさしくありません。
よくあるような日曜日から土曜日まで並んだカレンダーの表示方法で、記事のある日をクリックすると、その日の記事が表示されるようなものでなければなりません。
ブログに来た人は、どこまで記事を読んだか等をチェックするのにカレンダーを使いますので、記事を見てもらうためには必須のガジェットです。
そのためのガジェットはこちらのBloggerCalendarを使います。先ほどの記事リストと同じように、コードを生成して貼り付けるだけです。
ブログに来た人のために、まずは上記の2つのガジェットを追加しておくとよいでしょう。
2015年7月15日水曜日
Bloggerにカレンダーのガジェットを追加する
標準のBloggerではカレンダーのガジェットがないので、カレンダーを表示できません。
Blogger以外のブログではカレンダーは一般的です。特にブログ訪問者に過去の記事を見てもらうためには必須の機能だと思います。
しかし、このブログにはご覧のとおりカレンダーが表示されています。これは、こちらのBloggerCalendarを使っています。
そのサイトでコードを生成して、ブログ管理画面のレイアウトから「HTML/JaveScript」ガジェットとして追加するだけで、Bloggerにカレンダーを表示できます。
注意する点は、ブログアーカイブをブログに設置して、アーカイブの頻度を「日別」しておく必要があります。通常、Bloggerではブログアーカイブを使われていることが多いと思いますので、あらためて追加することは少ないかと思いますが、その中の設定を「日別」にしておかないと、カレンダーの日付をクリックした時に、該当の日の記事だけが表示されません。
Blogger以外のブログではカレンダーは一般的です。特にブログ訪問者に過去の記事を見てもらうためには必須の機能だと思います。
しかし、このブログにはご覧のとおりカレンダーが表示されています。これは、こちらのBloggerCalendarを使っています。
そのサイトでコードを生成して、ブログ管理画面のレイアウトから「HTML/JaveScript」ガジェットとして追加するだけで、Bloggerにカレンダーを表示できます。
注意する点は、ブログアーカイブをブログに設置して、アーカイブの頻度を「日別」しておく必要があります。通常、Bloggerではブログアーカイブを使われていることが多いと思いますので、あらためて追加することは少ないかと思いますが、その中の設定を「日別」にしておかないと、カレンダーの日付をクリックした時に、該当の日の記事だけが表示されません。
2015年7月10日金曜日
Bloggerの広告収入を改善
ブログのレイアウトは記事を中心として、上下左右にいろいろなものをレイアウトします。今、ご覧になっているこのBloggerによるブログについてもそうです。
配置できるのは他サイト等へのリンク一覧とか、SNS、広告等ですが、その際に困るのがサイズが定まらないものです。サイズが定まらないと、レイアウトが思ったような配置にできません。
その代表的な例がブログアーカイブです。これはBloggerのブログにとって必須ともいえるガジェットのひとつですが、一番使い良いであろう階層型の表示だと、その月の記事の数によって、縦方向のサイズが変わってしまいます。階層型以外であればそうでもないですが、それでは、記事のタイトルが表面化しないので古い記事を見てもらえません。
階層型のブログアーカイブは、記事のタイトルがずらっと表示されるとしても、月はじめにゼロになり、記事を投稿するたびに1行ずつ下に伸びていきます。毎日記事を投稿すると、縦の長さは月初と月末でかなり違ってきます。レイアウト的にやりにくく、特に広告を使う場合は、どこになにを配置するかで収益に影響しますので、苦心するところです。
このブログでは、年月に関係なく、左に最新の記事を10件表示しています。この方法ですと、記事数が定まっているので、縦の長さはほぼ一定です。レイアウトはずいぶんやりやすくなります。ブログアーカイブは、ページの左下に追いやりました。一番下に置いておくのであれば縦の長さはあんまり関係ありませんので。
左の記事一覧ですが、BloggerArticleListというガジェットを使っています。使い方は、Bloggerにレイアウトページからガジェットを追加して、BloggerArticleListのコードを貼り付けるだけです。
配置できるのは他サイト等へのリンク一覧とか、SNS、広告等ですが、その際に困るのがサイズが定まらないものです。サイズが定まらないと、レイアウトが思ったような配置にできません。
その代表的な例がブログアーカイブです。これはBloggerのブログにとって必須ともいえるガジェットのひとつですが、一番使い良いであろう階層型の表示だと、その月の記事の数によって、縦方向のサイズが変わってしまいます。階層型以外であればそうでもないですが、それでは、記事のタイトルが表面化しないので古い記事を見てもらえません。
階層型のブログアーカイブは、記事のタイトルがずらっと表示されるとしても、月はじめにゼロになり、記事を投稿するたびに1行ずつ下に伸びていきます。毎日記事を投稿すると、縦の長さは月初と月末でかなり違ってきます。レイアウト的にやりにくく、特に広告を使う場合は、どこになにを配置するかで収益に影響しますので、苦心するところです。
このブログでは、年月に関係なく、左に最新の記事を10件表示しています。この方法ですと、記事数が定まっているので、縦の長さはほぼ一定です。レイアウトはずいぶんやりやすくなります。ブログアーカイブは、ページの左下に追いやりました。一番下に置いておくのであれば縦の長さはあんまり関係ありませんので。
左の記事一覧ですが、BloggerArticleListというガジェットを使っています。使い方は、Bloggerにレイアウトページからガジェットを追加して、BloggerArticleListのコードを貼り付けるだけです。
ブログのページビューを増やして記事をもっと読んでもらう方法
Bloggerのブログアーカイブを使いたくない理由はぶっちゃけ、ページビューが伸びないからです。
ブログアーカイブには3通りの表示方法があります。階層、フラット、プルダウンメニューです。記事のタイトルを見えるようにしておかないと、なかなかクリックしてもらえませんから、必然的に階層を使うことになります。この階層型の問題は年や月をクリックすると、その年月に含まれる記事が全部出てきてしまうことです。ようは、一回クリックするだけで、一度にたくさんの記事をスクロールしながらまとめて読むことができてしまいます。一つ一つの記事を開くことによるページビューを稼ぐことができないばかりか、一度にたくさんの記事が表示されれば、見る側は流し読みしてしまいます。
むやみにページビューを稼ぐ必要はないのですが、ページビューは広告収益に関連しますし、ブログのライターの気持ちとしては、せっかくであれば、できるだけ多くの記事をちゃんと読んでもらいたいものです。
ということで、このブログが使っているのは左の記事一覧ですが、これはこちらで作ることができます。
これなら、記事を一枚一枚見ていくことになります。実は見る側もこれの方が使いやすいと思います。
ブログアーカイブには3通りの表示方法があります。階層、フラット、プルダウンメニューです。記事のタイトルを見えるようにしておかないと、なかなかクリックしてもらえませんから、必然的に階層を使うことになります。この階層型の問題は年や月をクリックすると、その年月に含まれる記事が全部出てきてしまうことです。ようは、一回クリックするだけで、一度にたくさんの記事をスクロールしながらまとめて読むことができてしまいます。一つ一つの記事を開くことによるページビューを稼ぐことができないばかりか、一度にたくさんの記事が表示されれば、見る側は流し読みしてしまいます。
むやみにページビューを稼ぐ必要はないのですが、ページビューは広告収益に関連しますし、ブログのライターの気持ちとしては、せっかくであれば、できるだけ多くの記事をちゃんと読んでもらいたいものです。
ということで、このブログが使っているのは左の記事一覧ですが、これはこちらで作ることができます。
これなら、記事を一枚一枚見ていくことになります。実は見る側もこれの方が使いやすいと思います。
これを追加したらブログのアクセスが増えた
私は、いくつかのブログを書いているのですが、そのほとんどがBloggerです。Bloggerは、広告を出さない時は、ゴチャゴチャせずシンプルで洗練されたデザインにできます。広告を出すとしても、その収益は、ブログサーバーの管理会社ではなく、私自身のものになります。
Bloggerでブログを書くことには、基本的に満足しているのですが、不満な点もないわけではありません。幸い私にはITの技術力という有利な部分がありますので、それを活かしてより良くなるよう改善しています。
このブログもそうですが、100を超える記事数のブログになってくると、過去に書いた記事がどんどん流れていって、ほとんど閲覧される機会がなくなってしまいます。検索エンジンでヒットもせず、他からのリンクもない記事は、まず陽の目をみることはありません。そうした記事も、Googleの検索エンジンには評価されていないかもしれませんけれども、ブログの訪問者にとってはどうなのか分かりません。せっかく書いたものですし、閲覧されるチャンス自体がないというのはもったいないです。
そこで、ブログに訪問してもらった人に、たくさんの記事があることを気づいてもらい、興味を持つものがあれば、見てもらえるようにするにはどうしたら良いかと考えました。
Bloggerで、過去の記事を見てもらえる可能性があるのは「ブログアーカイブ」とういガジェットから見つけられた場合です。このブログでは左下に置いています。このブログアーカイブは、ツリー状に年月で分類されていて、過去のものは、年や月のリンクをクリックしないと表示されません。年や月に含まれる記事タイトルがツリーに展開されることを期待して、年や月のリンクをクリックすると思いますが、そうするとページがリロードされてしまい、画面が消えるので、ツリー自体を見失ってしまいます。しかも、クリックした年や月の記事がすべて表示されて、ページのロードが遅く、トップの記事も書き換わるので、クリックした人はツリーではなく記事の方に目が行ってしまいます。そうすると、全文の表示された記事をスクロールして読んでいくことになって、閲覧者は面倒になってきます。
ようするに、ブログアーカイブは、過去の記事へのナビゲーション性がとても悪いのです。
もっと、単純に記事タイトルを一覧表示して、ブログの訪問者は、興味を持った記事だけをピックアップして見られるようにした方が便利です。
このブログでは、左側にそれを実現するガジェットを置いています。
最新の記事を10件表示していて、それ以前の記事は「次へ」をクリックすると、ページのリロードなくスピーディーに見ていくことができます。
さらに、その上に「全記事一覧」のリンクを置いて、こちらは、もっとたくさんの記事を一覧表示できるようにしています。
このようにすると、ブログ訪問者は、直感的に過去の記事を探すことができるようになり、古い記事を見つけてもらえるようになります。
この記事一覧のいいところは、「次へ」をクリックした後、次の一覧の表示が速いことです。インターネットの閲覧のされ方を見ていますと、みんなとてもせっかちです。もし「次へ」をクリックして、じーっと待たされたりすると、イライラしはじめて、すぐに他のウェブサイトに行ってしまいます。ストレスなく、パッパと興味あるものを見ていくことができるので、ページビューが伸びます。
記事のタイトルだけでなく、記事の冒頭部分を表示したり、文字の色や大きさをブログのデザインに合わせて変更できます。
このBloggerの記事一覧を表示するガジェットはこちらのページで作成できます。
一度試してみてはいかがでしょうか。
Bloggerでブログを書くことには、基本的に満足しているのですが、不満な点もないわけではありません。幸い私にはITの技術力という有利な部分がありますので、それを活かしてより良くなるよう改善しています。
このブログもそうですが、100を超える記事数のブログになってくると、過去に書いた記事がどんどん流れていって、ほとんど閲覧される機会がなくなってしまいます。検索エンジンでヒットもせず、他からのリンクもない記事は、まず陽の目をみることはありません。そうした記事も、Googleの検索エンジンには評価されていないかもしれませんけれども、ブログの訪問者にとってはどうなのか分かりません。せっかく書いたものですし、閲覧されるチャンス自体がないというのはもったいないです。
そこで、ブログに訪問してもらった人に、たくさんの記事があることを気づいてもらい、興味を持つものがあれば、見てもらえるようにするにはどうしたら良いかと考えました。
Bloggerで、過去の記事を見てもらえる可能性があるのは「ブログアーカイブ」とういガジェットから見つけられた場合です。このブログでは左下に置いています。このブログアーカイブは、ツリー状に年月で分類されていて、過去のものは、年や月のリンクをクリックしないと表示されません。年や月に含まれる記事タイトルがツリーに展開されることを期待して、年や月のリンクをクリックすると思いますが、そうするとページがリロードされてしまい、画面が消えるので、ツリー自体を見失ってしまいます。しかも、クリックした年や月の記事がすべて表示されて、ページのロードが遅く、トップの記事も書き換わるので、クリックした人はツリーではなく記事の方に目が行ってしまいます。そうすると、全文の表示された記事をスクロールして読んでいくことになって、閲覧者は面倒になってきます。
ようするに、ブログアーカイブは、過去の記事へのナビゲーション性がとても悪いのです。
もっと、単純に記事タイトルを一覧表示して、ブログの訪問者は、興味を持った記事だけをピックアップして見られるようにした方が便利です。
このブログでは、左側にそれを実現するガジェットを置いています。
最新の記事を10件表示していて、それ以前の記事は「次へ」をクリックすると、ページのリロードなくスピーディーに見ていくことができます。
さらに、その上に「全記事一覧」のリンクを置いて、こちらは、もっとたくさんの記事を一覧表示できるようにしています。
このようにすると、ブログ訪問者は、直感的に過去の記事を探すことができるようになり、古い記事を見つけてもらえるようになります。
この記事一覧のいいところは、「次へ」をクリックした後、次の一覧の表示が速いことです。インターネットの閲覧のされ方を見ていますと、みんなとてもせっかちです。もし「次へ」をクリックして、じーっと待たされたりすると、イライラしはじめて、すぐに他のウェブサイトに行ってしまいます。ストレスなく、パッパと興味あるものを見ていくことができるので、ページビューが伸びます。
記事のタイトルだけでなく、記事の冒頭部分を表示したり、文字の色や大きさをブログのデザインに合わせて変更できます。
このBloggerの記事一覧を表示するガジェットはこちらのページで作成できます。
一度試してみてはいかがでしょうか。
2015年7月9日木曜日
ブログで広告収入を増やすためにページビューを増加させるには
ブログを書いている方の中には、広告を掲載している方も多いと思います。
広告は表示回数(ページビュー)が多いほど有利になります。CTRが下がり、サイトの評価が上がるためです。CTRとは広告がクリックされる確率です。CTRが高くないというのは、よくないことのように思われるかもしれませんが、広告は興味を持ってクリックしてももらわなければ、広告主にとって意味がありませんし、その広告配信サービスをしているGoogleにとっても広告サービスの評価に関わります。そのため、CTRがむやみに高いサイトは、勘違いでクリックされている可能性があると判断され、広告の単価は下がり気味になります。ですので、ウェブサイトにはたくさんの人に来てもらい、たくさんのページを見てもらい、CTRの分母となるページビューを増加させてCTRを上げ過ぎないというのは、広告収益という点でも重要です。
今、ご覧になっているこの記事もブログです。ブログサービスのひとつであるBloggerを使用しています。BloggerはGoogleのサービスなだけあって、同社が行っている広告配信サービスGoogle Adsenseとの相性がとてもいいです。ブログ機能の中にあらかじめAdsenseを使うための機能が組み込まれています。
Bloggerで記事の閲覧数を増加させる方法として、今ご覧になっているこの記事の左側にあるような記事タイトルを一覧表示する方法があります。このように記事のタイトルをずらっと一覧表示することは、ブログ訪問者にブログ内に多くの記事が存在することを知ってもらえることになります。そして、他の記事へのアクセス機会を増やします。このブログのようなごちゃ混ぜブログではなくて、特定のテーマで書かれているようなブログの場合、関連性のある他の記事タイトルを見たブログ訪問者がその記事にも興味をもつ可能性は非常に高いです。
しかし、Bloggerでは、このように標準で記事タイトルの一覧を表示することはできませんので、このブログではこちらのサイトのサービスを利用しています。
ブログ訪問者が記事タイトルの一覧に意識が向くようになると、その後、他の記事も探して周辺にある広告にも目が行くようになります。それで、広告に興味を持たれた場合は、クリックへとつながります。
広告は表示回数(ページビュー)が多いほど有利になります。CTRが下がり、サイトの評価が上がるためです。CTRとは広告がクリックされる確率です。CTRが高くないというのは、よくないことのように思われるかもしれませんが、広告は興味を持ってクリックしてももらわなければ、広告主にとって意味がありませんし、その広告配信サービスをしているGoogleにとっても広告サービスの評価に関わります。そのため、CTRがむやみに高いサイトは、勘違いでクリックされている可能性があると判断され、広告の単価は下がり気味になります。ですので、ウェブサイトにはたくさんの人に来てもらい、たくさんのページを見てもらい、CTRの分母となるページビューを増加させてCTRを上げ過ぎないというのは、広告収益という点でも重要です。
今、ご覧になっているこの記事もブログです。ブログサービスのひとつであるBloggerを使用しています。BloggerはGoogleのサービスなだけあって、同社が行っている広告配信サービスGoogle Adsenseとの相性がとてもいいです。ブログ機能の中にあらかじめAdsenseを使うための機能が組み込まれています。
Bloggerで記事の閲覧数を増加させる方法として、今ご覧になっているこの記事の左側にあるような記事タイトルを一覧表示する方法があります。このように記事のタイトルをずらっと一覧表示することは、ブログ訪問者にブログ内に多くの記事が存在することを知ってもらえることになります。そして、他の記事へのアクセス機会を増やします。このブログのようなごちゃ混ぜブログではなくて、特定のテーマで書かれているようなブログの場合、関連性のある他の記事タイトルを見たブログ訪問者がその記事にも興味をもつ可能性は非常に高いです。
しかし、Bloggerでは、このように標準で記事タイトルの一覧を表示することはできませんので、このブログではこちらのサイトのサービスを利用しています。
ブログ訪問者が記事タイトルの一覧に意識が向くようになると、その後、他の記事も探して周辺にある広告にも目が行くようになります。それで、広告に興味を持たれた場合は、クリックへとつながります。
Bloggerに記事一覧追加で43.7%のアクセスアップ
このブログの左側に記事一覧があります。このブログはBloggerを使っているのですが、Bloggerでは通常このような表示をすることはできません。
標準で使えるもので、似たようなものとしては「ブログアーカイブ」があります。このブログでも左下にブログアーカイブを置いています。
ブログアーカイブの場合、日付ごとにまとめられて表示されるため、過去の記事のタイトルが表示されません。
記事タイトルが表示されないと、ブログの訪問者に過去の記事の存在を知ってもらえないため、閲覧機会が減ってしまいます。
そこで、こちらのサイトのBloggerで記事一覧を表示できる仕組みを使ってみました。
この記事一覧を使うと、一定数の最新の記事タイトルを常に表示しておくことができるため、ブログ訪問者に過去の記事を見つけてもらえる確率が格段に上がります。その結果、ページビューが劇的に上がります。また、上下にある「次へ」をクリックすることで、たくさんのブログ記事が存在することを知ってもらえます。
加えて、このブログの左の記事一覧の上に「全記事一覧」というのがありますが、これをクリックすると、過去の記事を一覧でずらっと表示できるページを表示します。これも先ほどのサイトで作ったものです。
Bloggerには、通常の記事の投稿以外に独立したページを作る機能があります。そこに、記事一覧のコードを貼り付けて、そのページのリンクをウィジェットのリンクリストで表示しています。
このようにすると、一度にたくさんの記事を一覧表示すると、ブログを訪れた人が過去の記事を探しやすくなって、閲覧数が増加します。
やはり、ブログアーカイブのように、古い記事のタイトルを見えないようにしまいこんでしまっては、古い記事の存在そのものが分からなくなりますので、このようにたくさんのタイトルを表示して、ブログに多くの記事が存在することを知ってもらえるようにするした方がいいです。
この記事一覧のいいところは、自分でメンテナンスする必要がないことです。ブログに記事を投稿すると、自動的に更新されて追加されます。
また、表示される項目や、それぞれのフォントの大きさ、色等を変えることができるので、元のブログに自然に馴染むようにできます。
実際、このブログもそうですが、私が書いている他のブログでもページビューが倍増していますので、こうして記事タイトルを露出させることは、アクセス数増加に非常に有効なようです。
標準で使えるもので、似たようなものとしては「ブログアーカイブ」があります。このブログでも左下にブログアーカイブを置いています。
ブログアーカイブの場合、日付ごとにまとめられて表示されるため、過去の記事のタイトルが表示されません。
記事タイトルが表示されないと、ブログの訪問者に過去の記事の存在を知ってもらえないため、閲覧機会が減ってしまいます。
そこで、こちらのサイトのBloggerで記事一覧を表示できる仕組みを使ってみました。
この記事一覧を使うと、一定数の最新の記事タイトルを常に表示しておくことができるため、ブログ訪問者に過去の記事を見つけてもらえる確率が格段に上がります。その結果、ページビューが劇的に上がります。また、上下にある「次へ」をクリックすることで、たくさんのブログ記事が存在することを知ってもらえます。
加えて、このブログの左の記事一覧の上に「全記事一覧」というのがありますが、これをクリックすると、過去の記事を一覧でずらっと表示できるページを表示します。これも先ほどのサイトで作ったものです。
Bloggerには、通常の記事の投稿以外に独立したページを作る機能があります。そこに、記事一覧のコードを貼り付けて、そのページのリンクをウィジェットのリンクリストで表示しています。
このようにすると、一度にたくさんの記事を一覧表示すると、ブログを訪れた人が過去の記事を探しやすくなって、閲覧数が増加します。
やはり、ブログアーカイブのように、古い記事のタイトルを見えないようにしまいこんでしまっては、古い記事の存在そのものが分からなくなりますので、このようにたくさんのタイトルを表示して、ブログに多くの記事が存在することを知ってもらえるようにするした方がいいです。
この記事一覧のいいところは、自分でメンテナンスする必要がないことです。ブログに記事を投稿すると、自動的に更新されて追加されます。
また、表示される項目や、それぞれのフォントの大きさ、色等を変えることができるので、元のブログに自然に馴染むようにできます。
実際、このブログもそうですが、私が書いている他のブログでもページビューが倍増していますので、こうして記事タイトルを露出させることは、アクセス数増加に非常に有効なようです。
2015年5月3日日曜日
ログのfacebookexternalhitとは
サーバーやアクセス解析のログにこんなのが記録されていませんか?
facebookexternalhit /1.1 (+http://www.facebook.com/externalhit_uatext.php)
これは、Facebookのクローラーが来た跡です。
Facebookで誰かがあなたのウェブサイトのリンクを投稿(シェア)した時に、画像や動画等の情報を取りに来るようです。あなたのウェブサイトが評判になっているということですので、基本的には良い兆候だと思います。アクセスが集中的に来ることがあるようですが、通常は長く続かないですので、放置しておいて問題ありません。
これは、Facebookのクローラーが来た跡です。
Facebookで誰かがあなたのウェブサイトのリンクを投稿(シェア)した時に、画像や動画等の情報を取りに来るようです。あなたのウェブサイトが評判になっているということですので、基本的には良い兆候だと思います。アクセスが集中的に来ることがあるようですが、通常は長く続かないですので、放置しておいて問題ありません。
2012年10月31日水曜日
mod_pagespeedの設定効果が分かる統計とメッセージ表示
ウェブページの表示を高速化するmod_pagespeed。
ログメッセージや統計情報を見て動作状況を確認することができます。
まだ、mod_pagespeedをインストールしていない方はこちらをご覧ください。
見ることができる情報は大きく分けて2種類あります。
・統計(mod_pagespeed_statistics)
・メッセージ(mod_pagespeed_message)
以下に順に見ていきます。
mod_pagespeedの統計情報を見る
はじめに、インストールしたマシンの以下のページをウェブブラウザで表示してみてください。
http://●●●/mod_pagespeed_statistics ←●●●はホスト名です。
エラーになって表示されない時は、
/etc/httpd/conf.d/pagespeed.conf
の中の
<Location /mod_pagespeed_statistics>
Order allow,deny
# You may insert other "Allow from" lines to add hosts you want to
# allow to look at generated statistics. Another possibility is
# to comment out the "Order" and "Allow" options from the config
# file, to allow any client that can reach your server to examine
# statistics. This might be appropriate in an experimental setup or
# if the Apache server is protected by a reverse proxy that will
# filter URLs in some fashion.
Allow from localhost
Allow from 127.0.0.1
SetHandler mod_pagespeed_statistics
</Location>
となっている箇所で、以下のような行を追加してクライアントマシンからのアクセスを許可してください。
Allow from 192.168.0.1 ←クライアントマシンのIPアドレス等の行を追加する。
これで先程の統計ページが表示できるようになると思います。
このような統計情報が表示されます。

高速化の効果を数値で確認できます。
下の方のHistogramでは、「>Raw Histogram Data...」と書かれた部分をクリックすると棒グラフが表示されます(データがないときは表示されません)。

ビーコンを追加する
先ほどの統計情報の中で以下の2つはデータが0になっていると思います。
total_page_load_ms ページの総表示時間
page_load_count ページの表示回数
これらは、ウェブページの実際の表示速度を計測するためのものです。
このデータを採取するには、計測したいページのHTMLにJAVAスクリプトコードを埋め込む必要があります。
埋め込むのは、<head>~</head>と<body>~</body>の二箇所です。
<head>
<!-- 次の行はなるべく上の方に書いてください -->
<script type='text/javascript'>window.mod_pagespeed_start = Number(new Date());</script>
</head>
<body>
<script type='text/javascript'>
function g()
{
new Image().src = '/mod_pagespeed_beacon?ets=load:' + (Number(new Date()) - window.mod_pagespeed_start);
};
var f = window.addEventListener;
if(f)
f('load', g, false);
else
{
f = window.attachEvent;
if(f)
f('onload', g);
}
</script>
</body>
ドキュメントがロードされ始めてから、ロードが完了までの時間を計測して、サーバーに通知しています。
headタグ内の一行は、ページロード時の初期に実行させるため、なるべく上の方に記述してください。
上記コードを埋め込んだページをウェブブラウザで表示してから、統計ページを表示すると「total_page_load_ms」と「page_load_count」の数値が増えているのが確認できます。
「total_page_load_ms」を「page_load_count」で割り算することで、ページの平均表示時間が分かります。
mod_pagespeedのメッセージを見る
以下のページを表示するとmod_pagespeed_messageから出力されるメッセージを見ることができます。
http://●●●/mod_pagespeed_message ←●●●はホスト名です。
見られないときはクライアントマシンの接続が許可されていません。
/etc/httpd/conf.d/pagespeed.conf
の中の
<Location /mod_pagespeed_message>
Allow from localhost
Allow from 127.0.0.1
SetHandler mod_pagespeed_message
</Location>
に、
Allow from 192.168.0.1 ←クライアントマシンのIPアドレス等の行を追加する。
を追加して、接続を許可してください。
mod_pagespeedのリファラー統計
もうひとつ、以前はリファラーの統計情報(mod_pagespeed_referer_statistics)というのがあったようです。
Google ChromeにInstant pagesという、閲覧される可能性が高いページを先読みする機能の動作情報を収集するものだったようですが、現在のバージョンのChromeでは廃止されているようです。もうあまり意味がありません。
以上、mod_pagespeedの情報を見る方法についてご紹介しました。
表示される情報のほとんどは、素のままのデータなので、そのままでは分かりにくいものもありますが、mod_pagespeedが効果的に機能しているかを知る手がかりになるのではないかと思います。
その他の情報については以下をご参照ください。
・mod_pagespeedのインストール
・フィルターをカスタマイズする(作成中)
CSSスプライトでウェブページを高速化する方法
ログメッセージや統計情報を見て動作状況を確認することができます。
まだ、mod_pagespeedをインストールしていない方はこちらをご覧ください。
見ることができる情報は大きく分けて2種類あります。
・統計(mod_pagespeed_statistics)
・メッセージ(mod_pagespeed_message)
以下に順に見ていきます。
mod_pagespeedの統計情報を見る
はじめに、インストールしたマシンの以下のページをウェブブラウザで表示してみてください。
http://●●●/mod_pagespeed_statistics ←●●●はホスト名です。
エラーになって表示されない時は、
/etc/httpd/conf.d/pagespeed.conf
の中の
<Location /mod_pagespeed_statistics>
Order allow,deny
# You may insert other "Allow from" lines to add hosts you want to
# allow to look at generated statistics. Another possibility is
# to comment out the "Order" and "Allow" options from the config
# file, to allow any client that can reach your server to examine
# statistics. This might be appropriate in an experimental setup or
# if the Apache server is protected by a reverse proxy that will
# filter URLs in some fashion.
Allow from localhost
Allow from 127.0.0.1
SetHandler mod_pagespeed_statistics
</Location>
となっている箇所で、以下のような行を追加してクライアントマシンからのアクセスを許可してください。
Allow from 192.168.0.1 ←クライアントマシンのIPアドレス等の行を追加する。
これで先程の統計ページが表示できるようになると思います。
このような統計情報が表示されます。

高速化の効果を数値で確認できます。
下の方のHistogramでは、「>Raw Histogram Data...」と書かれた部分をクリックすると棒グラフが表示されます(データがないときは表示されません)。

ビーコンを追加する
先ほどの統計情報の中で以下の2つはデータが0になっていると思います。
total_page_load_ms ページの総表示時間
page_load_count ページの表示回数
これらは、ウェブページの実際の表示速度を計測するためのものです。
このデータを採取するには、計測したいページのHTMLにJAVAスクリプトコードを埋め込む必要があります。
埋め込むのは、<head>~</head>と<body>~</body>の二箇所です。
<head>
<!-- 次の行はなるべく上の方に書いてください -->
<script type='text/javascript'>window.mod_pagespeed_start = Number(new Date());</script>
</head>
<body>
<script type='text/javascript'>
function g()
{
new Image().src = '/mod_pagespeed_beacon?ets=load:' + (Number(new Date()) - window.mod_pagespeed_start);
};
var f = window.addEventListener;
if(f)
f('load', g, false);
else
{
f = window.attachEvent;
if(f)
f('onload', g);
}
</script>
</body>
ドキュメントがロードされ始めてから、ロードが完了までの時間を計測して、サーバーに通知しています。
headタグ内の一行は、ページロード時の初期に実行させるため、なるべく上の方に記述してください。
上記コードを埋め込んだページをウェブブラウザで表示してから、統計ページを表示すると「total_page_load_ms」と「page_load_count」の数値が増えているのが確認できます。
「total_page_load_ms」を「page_load_count」で割り算することで、ページの平均表示時間が分かります。
mod_pagespeedのメッセージを見る
以下のページを表示するとmod_pagespeed_messageから出力されるメッセージを見ることができます。
http://●●●/mod_pagespeed_message ←●●●はホスト名です。
見られないときはクライアントマシンの接続が許可されていません。
/etc/httpd/conf.d/pagespeed.conf
の中の
<Location /mod_pagespeed_message>
Allow from localhost
Allow from 127.0.0.1
SetHandler mod_pagespeed_message
</Location>
に、
Allow from 192.168.0.1 ←クライアントマシンのIPアドレス等の行を追加する。
を追加して、接続を許可してください。
mod_pagespeedのリファラー統計
もうひとつ、以前はリファラーの統計情報(mod_pagespeed_referer_statistics)というのがあったようです。
Google ChromeにInstant pagesという、閲覧される可能性が高いページを先読みする機能の動作情報を収集するものだったようですが、現在のバージョンのChromeでは廃止されているようです。もうあまり意味がありません。
以上、mod_pagespeedの情報を見る方法についてご紹介しました。
表示される情報のほとんどは、素のままのデータなので、そのままでは分かりにくいものもありますが、mod_pagespeedが効果的に機能しているかを知る手がかりになるのではないかと思います。
その他の情報については以下をご参照ください。
・mod_pagespeedのインストール
・フィルターをカスタマイズする(作成中)
CSSスプライトでウェブページを高速化する方法
2012年10月25日木曜日
mod_pagespeedの超簡単なインストールと設定 CentOS+Apache
mod_pagespeedというウェブページの表示を高速化するGoogle謹製Apache組み込みモジュールがあります。
コンテンツの内容はそのままに、ファイルのダウンロード回数とダウンロードサイズを最小化することで、ウェブページの表示を速くします。対象はHTMLはもとより、CSS、JAVAScript、画像ファイルにまで及びます。
今回これをCentOSにインストールしてみました。
といっても、ものすごくあっさり使えるようになります。
1.mod_pagespeedパッケージをダウンロード

Installing mod_pagespeed From Packages
上のページに行き、右側から該当のファイルをひとつダウンロードします。
「Latest Beta Version」はベータ版、「Latest Stable Version」は安定版です。
CentOSの32ビット版なら「mod_pagespeed 32-bit .rpm (CentOS/Fedora)」を64ビット版なら「mod_pagespeed 64-bit .rpm (CentOS/Fedora)」をダウンロードします。
2.mod_pagespeedをインストール
そうしたら2つコマンドを入れます。
# yum install at
すでにatがインストールされていたら実行する必要ありませんが、インストールされていたら何も起こらないだけなので一度やっておくといいと思います。
次に、mod_pagespeedをインストールします。
# rpm -U mod-pagespeed-*.rpm
勝手にインストールされて、すぐに終わります。
おめでとうございます。以上で、インストールは終わりです。
すでにApacheに組み込まれていて、mod_pagespeedが有効化されています。
Apacheを再起動してください。
# /sbin/service httpd restart
試しに、何かウェブページを表示してみましょう。もちろん見た目は何も変わらないはずです。
ウェブブラウザのソース表示機能でHTMLソースを表示してみるとHTMLに含まれるJAVAScriptのスペースや改行が詰められていたり、画像がHTML中にエンコードされているかもしれません。
また、サーバーの /var/www/mod_pagespeed の下にキャッシュが作成されているはずです。
はじめはデフォルトの設定で使うのが安全だと思いますが、動作をカスタマイズしたい時には /etc/httpd/conf.d/pagespeed.conf を書き換えます。
とりあえず、mod_pagespeedを無効にしたいときは pagespeed.conf の「ModPagespeed on」を「ModPagespeed off」に変更してください。
pagespeed.confの詳しい設定方法は以下に記載していますので、ご覧ください。
・mod_pagespeedの統計情報を使う
・フィルターをカスタマイズする(作成中)
CSSスプライトでウェブページを高速化する方法
コンテンツの内容はそのままに、ファイルのダウンロード回数とダウンロードサイズを最小化することで、ウェブページの表示を速くします。対象はHTMLはもとより、CSS、JAVAScript、画像ファイルにまで及びます。
今回これをCentOSにインストールしてみました。
といっても、ものすごくあっさり使えるようになります。
1.mod_pagespeedパッケージをダウンロード

Installing mod_pagespeed From Packages
上のページに行き、右側から該当のファイルをひとつダウンロードします。
「Latest Beta Version」はベータ版、「Latest Stable Version」は安定版です。
CentOSの32ビット版なら「mod_pagespeed 32-bit .rpm (CentOS/Fedora)」を64ビット版なら「mod_pagespeed 64-bit .rpm (CentOS/Fedora)」をダウンロードします。
2.mod_pagespeedをインストール
そうしたら2つコマンドを入れます。
# yum install at
すでにatがインストールされていたら実行する必要ありませんが、インストールされていたら何も起こらないだけなので一度やっておくといいと思います。
次に、mod_pagespeedをインストールします。
# rpm -U mod-pagespeed-*.rpm
勝手にインストールされて、すぐに終わります。
おめでとうございます。以上で、インストールは終わりです。
すでにApacheに組み込まれていて、mod_pagespeedが有効化されています。
Apacheを再起動してください。
# /sbin/service httpd restart
試しに、何かウェブページを表示してみましょう。もちろん見た目は何も変わらないはずです。
ウェブブラウザのソース表示機能でHTMLソースを表示してみるとHTMLに含まれるJAVAScriptのスペースや改行が詰められていたり、画像がHTML中にエンコードされているかもしれません。
また、サーバーの /var/www/mod_pagespeed の下にキャッシュが作成されているはずです。
はじめはデフォルトの設定で使うのが安全だと思いますが、動作をカスタマイズしたい時には /etc/httpd/conf.d/pagespeed.conf を書き換えます。
とりあえず、mod_pagespeedを無効にしたいときは pagespeed.conf の「ModPagespeed on」を「ModPagespeed off」に変更してください。
pagespeed.confの詳しい設定方法は以下に記載していますので、ご覧ください。
・mod_pagespeedの統計情報を使う
・フィルターをカスタマイズする(作成中)
CSSスプライトでウェブページを高速化する方法
CSSスプライト画像を作成するものすごく簡単な方法
ウェブサイトにとってページの表示速度は重要で、ウェブサイトを見ていて表示速度が遅いと、ページを閲覧していくのが億劫に感じます。SEO的観点から考えても、ページの表示速度が遅いことが不利に作用することをGoogle自身が言っています。
ページ表示速度が遅い原因は、サーバーのスペックや回線速度など様々ですが、ページ内に画像がたくさんあるような場合には、それらのダウンロードに時間がかかっている可能性があります。サーバースペックやネットワークインフラが悪ければ、なおのこと遅くなります。
動的に作成されるような画像は、簡単に対策のしようのない面があるのですが、静的に配置されているアイコンやバナー、ボタン等の画像については、ひとつにまとめることでダウンロードを一回かぎりにして高速化することができます。ひとつひとつのダウンロードのたびに、サーバーとのHTTP通信が起こり、TCPセッションを作ることを考えると、オーバーヘッドが画像数に比例して削減されることが理解できます。
こうした画像をまとめて高速にページを表示する手法をCSSスプライトと言います。
GoogleがYouTubeのページで行ったりして、現在ではウェブページの高速化手法として一般的になっています。
具体的にはテーブルやリスト等のエレメントの背景に画像を設定できることを利用します。
背景画像の表示オフセット座標を指定することで、画像中の左上基点座標を移動します。そして表示する幅と高さを画像サイズに限定することで、画像中の一部分だけをトリミングして表示できる仕組みです。
HTMLやCSSの知識のある方は、ウェブページで使う画像をひとまとめにした大きな画像を作成して、いろいろ試行錯誤すればできるのではないかと思います。
画像をまとめるためのツールもあるようですが、私はウェブのサービスで作成してます。HTMLも自動生成してくれます。
そのような中で一番簡単にできる、普段使っているサイトでのCSSスプライトの使い方をご紹介します。
・画像をアップロードする
「参照」をクリックしてCSSスプライト座標に含める画像をアップロードします。
PNG、GIF、JPEGの各ファイルか、それらをまとめてZIPに圧縮したファイルをアップロードできます。
次々と追加アップロードしていくと、下の枠の中にアップロードした画像が追加表示されていきます。
スプライト画像は最終的にソートされて作られるので、アップロードする順番は意識しなくてもかまいません。
・アップロードした画像を確認する
アップロードした画像の中で不要なものがあったときは、削除して取り除くことができます。
・CSSスプライトを作成する
「CSSスプライト作成」をクリックします。
画像間隔はCSSスプライト画像中のひとつひとつの画像の間隔です。Safariの不具合やユーザーがフォントサイズを変更した時の対応用だと思われますが、通常はデフォルトのままで特に問題ありません。
作成するCSSスプライト画像の保存形式をPNG、GIF、JPEGから選べますが、オールマイティなデフォルトのPNGを使うのがいいのではないかと思います。
・画像をダウンロード
生成されたCSSスプライト画像をダウンロードします。
また、同時に生成されるHTMLコードを使うためにダミー画像もダウンロードします。これはIMGタグで必須となるSRC属性にダミーとして指定するためのもので、縦横1ピクセルサイズの透過色画像です。これがないと、IMGタグで表示した位置に画像のプレースホルダーが出てしまいます。
生成できるHTMLは「1画像1行」「クラス定義に分ける」の2種類あります。
「1画像1行」は、ひとつひとつの画像を一行のHTMLで記述されていますので、シンプルで分かりやすく、使いやすいHTMLになっています。
「クラス定義に分ける」を選ぶと、スタイル設定を別の場所に記述するHTMLが生成されます。こちらは、CSSファイルに外出しして使いまわすような用途や、HEAD内に書いてBODY内の記述をシンプルにしたいときに使えます。
以上ですが、普通は何も考えなくても、画像をアップロードして、作成ボタンをクリックするだけで使えます。
CSSスプライト作成サイト
ウェブサイトの表示を速くしたいような方には、CSSスプライトは効果の表れやすい検討する価値のある手法だと思います。
ページ表示速度が遅い原因は、サーバーのスペックや回線速度など様々ですが、ページ内に画像がたくさんあるような場合には、それらのダウンロードに時間がかかっている可能性があります。サーバースペックやネットワークインフラが悪ければ、なおのこと遅くなります。
動的に作成されるような画像は、簡単に対策のしようのない面があるのですが、静的に配置されているアイコンやバナー、ボタン等の画像については、ひとつにまとめることでダウンロードを一回かぎりにして高速化することができます。ひとつひとつのダウンロードのたびに、サーバーとのHTTP通信が起こり、TCPセッションを作ることを考えると、オーバーヘッドが画像数に比例して削減されることが理解できます。
こうした画像をまとめて高速にページを表示する手法をCSSスプライトと言います。
GoogleがYouTubeのページで行ったりして、現在ではウェブページの高速化手法として一般的になっています。
具体的にはテーブルやリスト等のエレメントの背景に画像を設定できることを利用します。
背景画像の表示オフセット座標を指定することで、画像中の左上基点座標を移動します。そして表示する幅と高さを画像サイズに限定することで、画像中の一部分だけをトリミングして表示できる仕組みです。
HTMLやCSSの知識のある方は、ウェブページで使う画像をひとまとめにした大きな画像を作成して、いろいろ試行錯誤すればできるのではないかと思います。
画像をまとめるためのツールもあるようですが、私はウェブのサービスで作成してます。HTMLも自動生成してくれます。
そのような中で一番簡単にできる、普段使っているサイトでのCSSスプライトの使い方をご紹介します。
・画像をアップロードする
「参照」をクリックしてCSSスプライト座標に含める画像をアップロードします。
PNG、GIF、JPEGの各ファイルか、それらをまとめてZIPに圧縮したファイルをアップロードできます。
次々と追加アップロードしていくと、下の枠の中にアップロードした画像が追加表示されていきます。
スプライト画像は最終的にソートされて作られるので、アップロードする順番は意識しなくてもかまいません。
・アップロードした画像を確認する
アップロードした画像の中で不要なものがあったときは、削除して取り除くことができます。
・CSSスプライトを作成する
「CSSスプライト作成」をクリックします。
画像間隔はCSSスプライト画像中のひとつひとつの画像の間隔です。Safariの不具合やユーザーがフォントサイズを変更した時の対応用だと思われますが、通常はデフォルトのままで特に問題ありません。
作成するCSSスプライト画像の保存形式をPNG、GIF、JPEGから選べますが、オールマイティなデフォルトのPNGを使うのがいいのではないかと思います。
・画像をダウンロード
生成されたCSSスプライト画像をダウンロードします。
また、同時に生成されるHTMLコードを使うためにダミー画像もダウンロードします。これはIMGタグで必須となるSRC属性にダミーとして指定するためのもので、縦横1ピクセルサイズの透過色画像です。これがないと、IMGタグで表示した位置に画像のプレースホルダーが出てしまいます。
生成できるHTMLは「1画像1行」「クラス定義に分ける」の2種類あります。
「1画像1行」は、ひとつひとつの画像を一行のHTMLで記述されていますので、シンプルで分かりやすく、使いやすいHTMLになっています。
「クラス定義に分ける」を選ぶと、スタイル設定を別の場所に記述するHTMLが生成されます。こちらは、CSSファイルに外出しして使いまわすような用途や、HEAD内に書いてBODY内の記述をシンプルにしたいときに使えます。
以上ですが、普通は何も考えなくても、画像をアップロードして、作成ボタンをクリックするだけで使えます。
CSSスプライト作成サイト
ウェブサイトの表示を速くしたいような方には、CSSスプライトは効果の表れやすい検討する価値のある手法だと思います。
登録:
投稿 (Atom)