「WEBサイト作成」カテゴリーアーカイブ

CSSが更新されたりされなかったりする現象

css を更新したのに、web サイトが更新されず、ctrl+f5 を押してもらったりすることがよくあり、今回もまた聞かれてしまった・・・ last-modified は付いているのに、何故、ie は css を取りにいってくれないのだろうと、しばらく(というか数年)放置したままだった。 改めて調べてみると、以下の記事を見つけた。 Web サーバー側でコンテンツを更新しても IE 上に反映されない (キャッシュのお話) 「IE9 以降の IE では、以下両方に該当する場合、更新確認も行わずにコンテンツをキャッシュから取得するようになっています。」以降に、どのような場合にキャッシュから取得するのかが書かれている。
有効期間 = (最終チェック日時 - 最終更新日時) * 0.1

つまり最終チェック日時と最終更新時間の差が大きい、つまり更新されていない期間が長いコンテンツは有効期間が長く設定され、クライアントからの更新確認の頻度が下がる仕組みです。
だそうだ。しばらくアクセスしてなかったら、ctrl+f5 押してね、ということか。なんとなく逆のような気もするが・・・ よろしければ、ご参考に。... 続きを読む

WEBサイトやtwitterのアクセスを増やしたい

Googleが言うように良質のコンテンツを作れば WEB サイトが見られるようになるのだろうか。また、twitter でも良質な情報を発信していれば、フォロワーが増えるのだろうか。 自分の投稿に魅力がないのかもしれないが、そうそう WEB サイトの投稿がシェアされることもないし、twitter でも相当共感を覚えない限り「いいね」止まり、というのが実感だ。 広告なんて打ってもしかたないと思っていたが、今は、WEB を検索するより、twitter で流れてくる情報を取捨選択する人のほうが多いのではないかと思い、twitter のプロモツイートを使ってみた。オートプロモートだと月1万円ほどだから、会社の宣伝広告費としては、結構お得なように思う。 1回つぶやくと約10000回ほど表示されているようだが、そのうちの、1人ぐらいはフォロワーになってくれるように思う。別の飲食店のサイトでも試しているが同じようだ。そちらのサイトは1ヶ月で30人程フォロワーが増えた。(小さい話だが・・・) プロモーションが流れてきてうっとおしいかな、と思っていたが、意外にもフォロワーが増えて、意欲が沸いてくる。 同じような悩みを抱えている方は試してみてはどうだろう。... 続きを読む

Twitter でクリックされるのはどの程度なのか

WEB サイトを作ってもそうそう見られるものでもないと、つくづく感じているが、Twitter の場合はどうなのだろう。 そもそも、フォロワーを増やすには権威ある人、カリスマのある人、友達の多い人でないと難しく、リツイートも相当共感を呼ぶものでないとリツイート、いいね、されない。そこで、Twitter の広告機能を使ってみてはどうかと考えた。 通常広告だと、指定したツイートが設定した金額分だけばらまかれる。 オートプロモートだと、ツイートする度にばらまかれるのだと思うが、何日分か見た感じでは、日に2000程度のインプレッションが得られるようにばらまかれていた。 詳細を表示したり、プロフィールを表示したり、写真を表示したりするのをエンゲージメントと呼ぶようであるが、おおまかには、オートプロモートの2000インプレッションのうち、エンゲージメントはテキストだけの場合で20件前後、写真も含む場合は200件弱のようだ。意外だったが、プロモツイートのほうがエンゲージメント率が高い。 自分が3回ほど試した範囲では、プロモート内容によって大きく変わるものではなく、エンゲージメント率は1〜3%程度のようである。写真が入ると10%程度まで上がることもあった。知名度が高い場合はエンゲージメント率も上がる可能性もある。 マーケティングの数字として、どこかで1/1000というのを聞いたような記憶があるのだが、興味あって見てくれた人が商品を買ってくれたり、来店してくれたりするのは、エンゲージメントした内のさらに何%かだろうから、0.1%というのは、データと合っているように思う。 お客さんの数が伸びない、といった場合に、Twitter広告、Facebook広告、Instagram広告などを活用してみるのもいいと思う。... 続きを読む

動的IPアドレスに対するWEBサイトのアクセス制限方法

取引先の担当の方から「動的IPのようでコロコロIPアドレスが変わるのですが、(WEBアプリ管理者用)WEBサイトにアクセス制限かけられますか?」と聞かれた。 使っているのは、apache 2.2 / linux / aws ec2。 いくつか方法があると思う。

apache で動的IPアドレスの場合だけ Basic/Digest 認証を追加する

複雑な設定が不要で、パスワードを推測しづらいものにし、定期的に変更するのであれば、現実的ではないかと思う。
<Directory /home/test>
order allow,deny
allow from 許可するIPアドレス
AuthType Basic
AuthName "Restricted Resource"
AuthUserFile /etc/httpd/htpasswd
Require valid-user
Satisfy any
</Directory>
Satify any なので、allow か require かどちらかが使われる。 apache 2.2 satisfy directive

VPN を使って IP アドレスを固定化する

組織の情報システム部門が禁止していない場合に限る。 500/udp、4500/udp が通る環境であれば、 固定 IP アドレスの IKEv2 VPN サーバに VPN 接続して、VPN サーバからのアクセスを apache で許可する。 500/udp、4500/udp は通らないが、openvpn のインストールが許されるのであれば、固定 IP アドレスの openvpn サーバに VPN 接続して、VPN サーバからのアクセスを apache で許可する。

クライアント証明書を使う

サーバ側、クライアント側ともややめんどう。 apache 2.2 Client Authentication and Access Controlより引用 apache の設定に以下を追加
SSLVerifyClient require
SSLVerifyDepth 1
SSLCACertificateFile conf/ssl.crt/ca.crt
... 続きを読む

wordpressの画像圧縮(画像サイズ縮小)-プラグインを使わず手動で

WEB サイトの表示速度を上げるため wordpress の画像をプラグインを使って圧縮しているかもしれない。 私は、次のような理由で手動で画像サイズを縮小することにした。 * プラグインだらけになってわけがわからない(プラグインは必要はものを最小限だけ入れたい) * プラグインがどのように動くかわからない(wordpressアプリで画像のアップロードに失敗したり) * 既にアップロードしているファイルをプラグインで(サイズ制限などなく)縮小できるかどうか不明

ImageMagick をインストール

Linux サーバ(CentOS 6)のほうは、
yum install ImageMagick
でインストール。 さくらのレンタルサーバ(スタンダード以上が必要)も使っているが、ssh でログイン。ImageMagick はインストールされているようだ。

メディアディレクトリに移動

cd ワードプレスディレクトリ/wp-content/uploads
など。

画像サイズの確認

find . -type f -exec identify {} \;
〜 JPEG 3096×5504 〜 などのように表示されているので、大きそうなファイルをリサイズする。目処は横幅600px前後か? または、ファイルサイズが 1M を超えているものを ls -l などでチェック。
find . -type f -ls
など。

画像圧縮

ミスった時に戻れるようファイルのバックアップを取っておく。
mogrify -resize 30% ファイル名
または、横幅を 600 px にしたい場合は、
mogiry -resize 600x ファイル名
とする。 mogify はファイルを変換して上書きするので気をつけよう。
それ以前に、アップロードする前に mogrify しておきたい。... 続きを読む

WEBサイトのバックリンク獲得法

ahrefs を使って、自分の持っているサイトのランキングを見てみた。 ひどい。。。 良質なバックリンクを獲得できていないのでは、と思った。 ahrefs academy から辿ったと思うが、以下のガイドが参考になる。 The Noob Friendly Guide To Link Building 2016年時点だが、手法が列挙されている。 それぞれの手法に Effectiveness、Penalty risk、Link value、などが表示されており実用的だと思う。 英文が読めなければ、指標の高い手法名を google 検索してみると良いかもしれない。... 続きを読む

jekyll で作った github pages の posts にアドセンスの記事内広告を貼る

これも前の記事と同様にニーズがあるかどうかわからないが。。。
  1. github pages を作る作り方の参考。ここでは、minimal テーマを使用。
  2. _layouts ディレクトリを作り、mininal テーマの _layouts をコピーする。
  3. _layouts/posts.html を編集する。 {{contents}}の下あたりに広告コードを差し込む。
... 続きを読む

sphinx の html 出力にアドセンスの記事内広告を貼って github pages に上げてみる

そんなニーズがあるかどうかは知らないが。 _templates に layout.html をコピーして、記事の下に広告コードを挿入する。 例えば、[read the docs テーマ(sphinx_rtd_theme)[https://sphinx-rtd-theme.readthedocs.io/en/latest/] の場合。 lib/python3.6/site-packages/sphinx_rtd_theme/layout.html を _templates にコピーする。
<div itemprop="articleBody">
:
</div>
の下あたりに、
<div>
広告コード
</div>
のような感じで差し込む。 もう少しレイアウトの調整は必要かもしれないが、このような感じになる。 github pages 面白いな、という気分になってくる。... 続きを読む

WordPress サイトの応答速度を上げる

WEB サーバの速度を上げれば、多少は検索結果のランキングが上位になるのだろうか?と思い改善した点。
  1. 可能なら、php バージョンを 7 に上げる。
  2. サイドバーから使っていなさそうなウィジェットを削除する。twitter フォローボタンも外してしまった。
  3. 不要なプラグインを外す。
    • Google Analytics for WordPress は止めた。js が一個削れる。(Head, Footer and Post Injections で Analyltics コードを設定)
    • Jetpack は必要なものだけ ON にする。統計は analytics で取るので止める。画面下部に Debug というリンクがあるので、そこからモジュール一覧を表示して、統計を停止する。参考
    • 絵文字は使わないので、Disable Emojis プラグインをイントールする。
  4. 不要な広告を削除。
  5. WEBサーバやプラグインでキャッシュ設定したほうがいいかもしれないが、コンテンツを更新して css や js が反映されない、とかなりそうなので設定しない。(chrome の developer console で見てレスポンスに Etag が入っていればそのままにした。)
google chrome の developer console で network タブを見て、処理時間がかかっているようなプラグイン等を削除していった。 多少は改善したようである。... 続きを読む

さくらのレンタルサーバのいいところ

さくらインターネットのレンタルサーバ、一つのサーバを借りれば、いくつも WordPress サイトを作れて便利だということに、今頃気づいた。。。さくらのレンタルサーバ スタンダードだとデータベースを20個、ビジネスだと100個作れる。WordPressをそれぞれ、20個、100個インストールできるではないか。2個はできたので、100個でも同じはず。。。 私は次の点がさくらのレンタルサーバの良い点だと思う。
  1. [new!]SSL が無料。(ただし、独自ドメインのみ利用可能)
    2. 複数の WordPress サイトを比較的簡単に設置できる。こういった用途には、http://ホスト名.sakura.ne.jp/WordPressディレクトリ/ とするのが一番簡単か。(もちろん、ドメイン名は変えられる。)
    3. メールが付いている。このメールは転送用にもできるし、送受信用にもできる(WEBメールが使える)。ウィルスチェックの機能も付いている。メールアドレスは無制限に作れる。
    4. 2週間お試しで使える。
    5. 疑問があれば、まりなが twitter で教えてくれる。
    6. スタンダードプラン以上ではシェルが使える。gcc、g++なども使えてpython3もコンパイル可能なレベル。ImageMagickなども実行できて画像の変換も可能であった。
使い込めば、メールまわりの機能が充実していることがわかるが、今回は割愛する。 申し込みはこちらから。
さくらのレンタルサーバ スタンダード
さくらのレンタルサーバ ビジネス... 続きを読む

WordPress のバックアップ/復元を簡単に – Jetpack

WordPress コンテンツのバックアップには、JetPack の有料プランを使うのが簡単だ。月々の利用料(500円前後〜)は発生するがJetPackの一機能なので、追加プラグインのインストールは不要だ。 [toc]

機能

JetPackのSecurity設定でサイトのバックアップを有効にすると、次のような画面になる。   ここでバックアップの詳細を押すと、バックアップとセキュリティの概要が表示される。   Backups を押すと、バックアップの概要が表示される。カレンダー形式で表示されている。リストアするための設定をしていないので、赤いボックスが表示されているが、とりあえず、先に進む。   カレンダーの日付、または、一覧表示の View Backup ボタンを押すと、指定した日のバックアップの概要が表示される。   ダウンロードボタンを押すと、ダウンロード対象を選択するポップアップが表示される。   Prepare Backup ボタンを押すと、進行状況がポップアップに表示され、準備が終わると次のようにDownload ボタンが青色に変わる。Download ボタンを押すと、指定したコンテンツが落ちてくる。 Backup Contents に表示されているものが、tar.gz 形式のファイルにまとまっている。(tar xvf ファイル名か、windows の解凍ソフトなどで展開できる。)コンテンツを復元するのに必要なファイルが入っている。  

リストア方法

sftp を使ったリストア

sftpでも復元できる。動きを見ていると、バックアップデータとphpスクリプトが転送され、そのスクリプトがDBやファイルを復元する仕組みになっているようだ。(ftpも同様と思う。)設定手順は次のとおり。
  1. WEB サーバに復元用のアカウントを作成する。(useradd -m -G apache hogehoge など。)
  2. WordPressを置いているディレクトリに、書き込み権限を与える。(chmod g+w /opt/wordpress など。) wordpress ディレクトリに復元用のデータ等を置くので、書き込み権限が無いと復元に失敗する。復元に失敗した場合は、メールでエラーが通知される。
  3. バックアップ設定画面を開き、項目を入力する。Username には、1で作ったアカウント名を入力する。WEBサーバへのログインを、パスワード認証でなく、パブリックキー認証に設定している場合は、パスワードは入力せず、show public key で表示される内容を、~アカウント名/.ssh/authorized_keys に追加する。
  4. saveボタンを押す。保存後、画面をリロードすると以下のようになる。(サーバを sftp に限定していないので、sshもオンになる。sftpでアクセスさせたい場合は、forget this connectionリンクを押せば、設定を忘れてくれる。)
以上の設定を行い、バックアップ画面からrestoreボタンを押せば、指定したバックアップに復元される。

手動 でのリストア方法

諸事情で自動設定にしたくない場合は、手動でリストアすることもできる。 手動でのリストア方法

まとめ

バックアップは、Automatic 社のサーバに保存されるので、自分でデータを保管する場所を確保する必要はない。プレミアムプランでは、セキュリティスキャンもかけてくれるようだ。正確な情報については、Get to know VaultPressを。 レンタルサーバのディスクが壊れる、ということはそうそう無くなっているかもしれないが、ハッキングなどによりサイトが改竄される可能性が無いとはいえない。正常な状態まで調査/復元するために便利なサービスだ。WordPress で作った会社のホームページやお客様のホームページなど、まだバックアップを取っていなければ、おすすめしたい。 お申し込みは、Jetpackのページから。... 続きを読む

簡単に WORDPRESS サイトを立ちあげる方法

wordpress.com で作るのが一番簡単ではないかと思います。
  • レンタルサーバを借りて wordpress を導入する手間がありません。おそらく数分で立ちあげられることでしょう。
  • 値段は機能によって違います。各プランの比較表をご覧ください。
こちらのリンクからお申し込みください。 参考 JetPack の有料プランもおすすめです。一番価格の安いPersonal版にはバックアップとスパムフィルターが付いています。... 続きを読む

お名前.com で取ったドメインで www 無しのサーバ

独自のドメインで安価にブログを構築する方法は、お名前.comでドメインを取って、bloggerにコンテンツを置く方法ではなかろうか。SSLを使わなくてよければ、ドメインの費用だけで済みそうだ。 また、bloggerだと条件を満たせば、adsense広告も有効にできるし、広告を非表示にもできるのがいいところかな、と思っている。 先日、koneko.blog といういい感じの名前のドメインを取ったものの、http://koneko.blog とできないことに気づいた。 その対処法:
  1. blogger で “www.ドメイン名” のカスタム設定をする。
  2. (結局安くならないが)さくらインターネットなどでVPSを借りて、centos+apacheを立てる。
  3. お名前.com でもドメイン無しの A レコードは設定できるので、ホスト名には何も入れず、上記サーバのアドレスを入れる。
  4. cd /etc/httpd/conf.d/forward.conf にでも virtual host を設定して、ドメイン名を www.ドメイン名に転送する設定を入れる。
例:
<VirtualHost *:80>
    ServerName koneko.blog
    Redirect / http://www.koneko.blog/
</VirtualHost>
しかし、1年もすれば、子猫じゃなくなるな、というのが悩みだが。... 続きを読む

Google デジタルワークショップ

受講してみましたが、Googleの検索の仕組みや広告等の有料サービスへの理解が深まりました。 アクセス数の多いWEBサイトをどのようにして作ればよいのだろう、という悩みから受講してみたのですが、 自社製品のPRにお悩みのマーケティング担当の方には役立つのでは。 ただ、AM5時から始めて、AM11時ぐらいまでかかったので、一日仕事ですね。 認定証... 続きを読む

飲食店など個人事業のためのホームページ等作成法

どうするのが良いか?

ホームページを作るべきかどうか。。。個人事業レベルなら、google のサービスへの登録とブログで十分ではなかろうか。また、twitter/facebook/line/インスタなど SNS のリアルタイム性、拡散性を考えると、ブログ+SNS が良さそうだ。

手順

  1. gmail アカウントを作成。gmail アカウントを作れば、google の、メール、写真、ドキュメント、ブログなど様々なサービスにアクセスすることができる。
  2. google マイビジネスに登録。飲食店なら、住所、電話番号、写真など登録しておけば、google で検索した時に大きく表示されるだろう。
  3. ブログを立ちあげる。blogger で良いのではないかと思う。blogger は広告を表示しないようにもできるし、gmail アカウントを持っていれば簡単に作れる。独自ドメインだと、ドメインの管理など煩雑だし、多少お金もかかるので、独自のドメインでなくても良いのかもしれない。
  4. twtiter アカウント、facebook page などを作る。ifttt を使えば、blogger を更新したら、twitter に流すことも可能だろう。また、twitter に書けば facebook page を更新することもできるので、どこかに一本化するのが楽だ。twitter は20代以下、facebook は、30代以上がターゲットになるのではなかろうか。(どこかにそれらしきデータがあったように思う。) line、instagram などが主流だとは思うが、自分が使っていないので、トライしてみてほしい。
  5. 飲食店なら、いちおう、インターネット時代の海原雄山、食べログに登録する。ブログの URL を入れるのを忘れないよう。食べログの代理店の営業は聞かなくても大丈夫だと思う。その分、仕入れを充実させたい。

運用

お知らせ的なものをブログに、日々の情報は、SNS に流せばよいのではないかと。ブログにはメニューやサービス内容など、あまり変わらない情報を載せて必要な時だけ更新し、SNS を日々更新するという運用方法もあると思う。 多少時間はかかるが、お金は全然かからない。色々楽しいサービスを考えて、ブログを更新してみてはどうだろうか。... 続きを読む

飲食店用メニューとして使える wordpress プラグイン

Food and Drink Menu を使った事例です。使える!と思いました。 カフェクック酢 (写真はこれから追加予定)   概要
  1. プラグインをインストール
  2. Menus から、Menu Items を選んでメニューをどんどん追加。Menu Sections を入れておけば良いかと思います。
  3. Menu を選んでメニューを新規作成(または編集)。タイトルにメニュー名(ランチなど)を入力し、下のほうに表示されている Menu Layout で Available Section を First Column にドラッグ&ドロップ。
  4. 外観 -> メニューなどに、3 で作ったメニューを登録。
(17/9/23)一部翻訳したので近日中に反映されるかもしれません。... 続きを読む

wordpress の固定ページを投稿に変換

あるサイトを wordpress で構築していたのですが、当初、wordpress や検索エンジンの特性もわからずに使いはじめたため、固定ページを作りすぎて、サイトの構成がわかりづらくなってしまいました。固定ページは、http://ホスト名/ページ名 で作られるため、分類がしづらいからなのでしょう。人にも検索エンジンにも優しくなさそうです・・・ そこで、構成を見直すべく、ネット検索してみると、以下のようなものがありました。 post type switcher このプラグインをインストールすると、ページの編集画面で、固定ページをカテゴリーに変換できます。メニューに固定ページを表示していても自動的にURLを付け替えてくれます。 URLは変わってしまいますが、それほどアクセス頻度が高いわけではないので、しばらく放置にて様子見です。 今改めて考えると、階層的になっていくであろうコンテンツは投稿でカテゴリーを設定して作ったほうが良いですね。... 続きを読む

さくらの RAPID SSL をさくらの VPS で使えるのか

さくらの SSL、RAPID SSL は年額1500円でかなりお得なような。 ただ、サービスを見ても VPS で使えるのかどうかハッキリしません。 CSR を作って申し込めば、サーバ証明書は発行されました。   https://www.geotrust.co.jp/support/ssl/csr/apache_openssl_new.html に書かれているように、csr を作成。(コモンネームを間違えないように) 申し込み画面で csr を貼り付けて申し込めばOK。   申し込むと、「SSLサーバ証明書 認証ファイルのアップロードについて」というメールが来るので、認証ファイルをアップロードします。   認証ファイルをアップロードすると、証明書が発行されるので、証明書をサーバにインストールします。 (10分周期でチェックしているようでした)  ... 続きを読む

Google Analytics not provided 対策

Google Analytics の検索キーワードが not provided と表示される問題への対応策。
How to Unlock Your ‘Not Provided’ Keywords in Google Analytics
内容的には古くなっているかもしれませんが、今でも使えるように思ったので、とりあえず要約。 方法1:フィルタで not provided を、ランディングページ URI に置換。 (http://econsultancy.com/jp/blog/8342-how-to-steal-some-not-provided-data-back-from-google) 以下のような感じで設定。(ビューをコピーして試したほうがよさそう)
検索キーワードがわかるわけではないが、検索キーワードと、検索キーワードがわからない場合はランディングURI、が一緒に表示されるのはそれなりに見やすい。 方法2:「検索エンジン最適化」の「検索クエリ」を見る。 方法3:広告 -> AdWords -> 一致した検索クエリを見る。出している広告から飛んできたものに限る。 方法4:ウェブマスターツールを使う。 今さら書くほどのことではないと思いますが、Analytics とウェブマスターツールは使わざるを得ないですね。Google 検索から参照されるのが大半で、Google で若干情報が剥がされるので。... 続きを読む

フリーのオークションシステム

フリーのオークションシステムがないか python と php で調べてみましたが,あまり良さそうな物がありませんね。やはり,yahoo,ebay, amazon なんかが優秀ということなんでしょうかね。

php
  • WeBid — ひと通りの機能はついていますが,画面が今ひとつ。日本語化(日付フォーマットや通貨フォーマットの)が必要でしょう。
  • phpbb-auction — phpbb2(掲示板システム)にオークション機能を足したもの。phpbb3 対応のものはない。(何年も前に更新が止まっている)ですが,見栄えや機能はひと通り用意されていて使えるかもしれません。
wp auctions という wordpress 上でオークションができるようなモジュールもあるようですが,wordpress は何度も使おうとしては挫折を繰り返しているので,評価せず。

python

  • little-ebay  (django 使用)  — 簡単な機能しかなく,例えば画像はリンクだけを指定,ですが,いちおう簡単に動かせるので,使いようによっては使えるかも?
collectorcity marketplace が使えるかと期待してインストールしようとしてみたものの,説明が不親切で動かせず。

... 続きを読む

javascript を使った web サイト

javascript を使った web サイトって結構多いですが,「どうやって作っているんだろう?コンピュータが出力しているようなコードだしなあ。」と疑問に思っていたところ,GWT のようなものがあるのですね。java で書いたプログラムをjavascript に変換するものなんでしょうか。無知なことに知りませんでした。。。

python な私は,py2exe から想像するに py2js 的なものがあるに違いないと思って検索したら,やはりありました。
http://www.mccarroll.net/py2js/index.html

もう少し調べたところ,
http://pyjs.org/
もありました。こっちのほうが,更新も最近だし,良さそうでしょうか。時間があれば,いじってみたいと思ってます。

だけど,サーバサイドのプログラムはどうやって作るんでしょうね?セキュリティなんかも典型的なものには対処できているのでしょうかね?... 続きを読む