IFTTTで更新ping

はてなブログで自動的にping送信する方法 (旅と写真とANAマイルのある生活)

犬のブログをwordpress.com(レンタルの方)へ移動したものの、
ブログ村(ブログランキング)に更新pingを飛ばす機能がついていない。
無料プランなのでプラグインを入れることも出来ず、
かといって毎度手動でボタン押したり、URL入力するのも面倒…

と思って調べてたら、IFTTTを使う方法があるのね。
IFTTT(if this then that)ってなんとなくは知ってたけど
詳しくは使ったことなかったから初体験。
ブログのRSSが更新されたら更新ping用のURLにGETを投げる、
という処理を登録するだけでいいんだな。

RSSの更新をどの程度の頻度でチェックするんだろう、
まあ1日1回ぐらいやってくれればいいや、ぐらいのつもりが、
初回は更新後17分ほどで反応、結構優秀なもんだな。
他にも面白そうなのいっぱいあるので使ってみよう。

imgかimagesか

img と images ならどっち派？画像格納フォルダの命名についてアンケートをとってみました (NxWorld)

規則次第ではあるけど自分で決められる場合だと
最近はimages使ってることが多いかな…昔はimgだったけど。
サブドメイン方式だとpic使ったりすることも。

昔みたいにコードにパスを直接打つことが多かったら
そりゃ短い方がいいのかな、って思ってはいたし、
なんとなく見る側に対してもURLの短さって重要だった気がする。

今はCMSとかフレームワークとか使うことが多くて
URLがやたら長かったり、ディレクトリ名も変数として1ヶ所で設定、
imgだと逆に短すぎて分かりにくい印象もあるんだよな。

ThemeMatcher

あらゆるサイトをWordPressテーマに変換してくれる『ThemeMatcher』 (100shiki)

勝手によそのサイトのCSSパクってテーマ化するのかと思ったが、
自分のサイトをあまり雰囲気変えずにWP化したいって時に使うものか。

コンテンツとなる部分を選んで、サイドバーの位置を決めるだけ、
これだと1からテーマ作るとなると結構面倒くさいので、
こういうのを使えば簡単に移行できるんじゃないかな。

ただダウンロードするのは有料なんだな、当たり前か。
安いやつでも47ドル、自動生成のくせに結構取りやがる（＾＾；
まあ全部デザイナーに依頼するよりは安いよってレベルか。

UI設計を簡略化したい

シンプルで使いやすそうなフロントエンドフレームワーク『UIkit』 (IDEA*IDEA)

PHPのフレームワークなんかはよく使うんだけど、
HTMLやCSSを使ったデザインは1からやろうとすると面倒くさい。
特に今どきな感じにしようとするとなかなかねぇ…
UIkit見てみたけど、シンプルで良さそうな感じ。

ただいろいろ選べるとはいえこのまま使うと
大体似たような雰囲気になりそうなのでカスタマイズは必要か。
その点ではBootstrapの方がフリーのテーマ配布されてるので
ガラッと違う雰囲気の作るには向いてるのかな。

そろそろ自分も始めてみたいな、とは思うものの、
この手のはjQueryなんかも読み込んで重くなるという印象。
今どきの環境ならさほど問題にはならないんだろうけど、
実際Twitterのページが重いPCがうちにあるからなぁ（＾＾；

ダミー画像サービス

［ウェブサービスレビュー］ダミー画像を簡単に生成できる国産ジェネレータ「Placehold.jp」 (CNET Japan)

ああ、こういうサービスがあるのか。
1つや2つなら自前でダミー画像用意してもいいけど、
あちこちに入るとあとで置き換えるのも面倒だからねぇ…
ダウンロードしなくても直接URI指定して使えるのが便利。

いろいろ複雑な指定は出来るようだけど、
とりあえずは縦横指定だけ覚えておけばいいのかな。
→ http://placehold.jp/{幅}x{高さ}.png

?text={表示したい文字列}
を後ろにつければ表示する文字も変更可能か。
ブラウザの設定にもよるのか、日本語でもいけた。

ジェネレーター使う必要が無いので、
このサイトをわざわざ訪れる必要もなくなるんだが、
どうやって収益をあげるつもりなのか…ボランティア？

感謝感謝

パスワードハッシングAPI

PHP 5.5 は、パスワードハッシング API を搭載へ (japan.internet.com)

自分もだけど、確かに他の人のコードを見ると、
それぞれ独自にパスワード暗号化、照合用の関数・API組んで
ちょっと複雑な処理で使ってるケースは多いような。

適当なところからsalt拾ってcryptで暗号化…
多くはcrypt、中にはmd5やsha1なんてのも。

The new Secure Password Hashing API in PHP 5.5

$hash = password_hash($password, PASSWORD_DEFAULT);

これだけでハッシュ化終わりか。
saltの生成とかは勝手にやってくれるらしい。
PASSWORD_DEFAULTはアルゴリズム指定、デフォルトはbcrypt。

<?php
// $password from user, $hash from database
if (password_verify($password, $hash)) {
// password valid
} else {
// wrong password
}

照合もこれだけ…楽でいいな。

PHP側が用意するAPIに脆弱性があったら、とは思うものの、
自分で半端なのを用意するぐらいならこっちの方がいいのかな、
問題があれば勝手にメンテナンスしてくれるんだから。
(security fixをちゃんと追うという前提で)

View Source

Make a ‘View Source’ Button (CSS-Tricks)

CSSのリファレンスサイトを見てたら、
「Fancy View Source」ってボタンが表示されてて、
クリックしてみたらページのソースが出てきた。
なんじゃこりゃ？と思ったらここの使ってるのか。

基本的にはCSSのdisplayで表示のON/OFFを切り替え、
js使って整形してるみたいだけど、動作が軽いのはいいな。
実際のソースと全く同じというわけではないようで、
普通にブラウザの機能でソース見たらいいじゃん、
って気もしなくはないが、色分け整形されてるのは見易いか。

一昔前はjsゴリゴリ書いてややこしかったけど、
最近はjQuery等既存のものを活用することが増えて、
たまにしかjsいじらない自分には有難いような、
結局複雑な使用法調べるから面倒くさいような…

ワイヤーフレーム表示

サイトのワイヤーフレームを表示してくれるブックマークレット『Wirify』 (百式)

少し古い記事だけどなかなか面白いブックマークレット。

ワイヤーフレーム化してくれるのももちろんだけど、
マウスカーソル合わせるとh1とかaとかタグを表示してくれるのも便利。
あとはCSSを拾ってきてどういうスタイル指定がされてるのか、
ってのも表示してくれるとすごく助かるんだけどな。

あとWirifyのサイトの説明がなかなか素敵。
ブックマークレット部分をここにドラッグするんだよ、
っていう案内が矢印だけで分かるってのがいいな。

HTMLの過ち10個

犯してはいけないHTMLタグの過ち10個 (Webpark)

まあ当たり前っちゃ当たり前なんだけど・・・
手を抜いてやりがちなことも多々あるな。

imgのaltはねぇ、面倒くさいので省いちゃうこと多い。
最近はあまりないけど、ただのレイアウト用の画像など
大して意味のない画像にもalt付けろって人もいる。
上の記事に書いてないけど、heightやwidthの方が
読み込み時の崩れとかあるから必要なんじゃ。

内容の意味を考えた構造、ってのも手を抜きがち、
h1ぐらいは使うけど、h2以降はなかなかねぇ。
本当はpで括るべきところを、brの連続で済ませたり。
HTMLタグでの意味付けってのは気を付けないと。

CSSで気を付けたいこと

CSSで気をつけたい事やつまづいたときのちょっとしたこと (Web Design RECIPES)

なかなか的確にまとまってたので参考になった。
当たり前のこともあるけど、気を付けたいことばかりだね。
IE6のバグはもう無視してもいい気はするが・・・

「2行目をインデントするスタイルシート」はねぇ、
面倒くさくてついスペースで誤魔化しちゃうことあるな。
「クラスは複数指定できます」は忘れてたな。

ブログのテーマとして配布されてるテンプレートについてる
CSSなんかは結構見やすく最適に書かれてるものが多いので、
そういうのをいじってるだけでも結構勉強になることがあるな。
まあ書いてる人によってピンキリではあるものの。

CSS3説明サイト

CSS3の説明がグラフィカルでわかりやすい『CSS3 Files』 (百式)

そろそろCSS3を勉強しないとねぇ・・・
本格的に使えるのはもう少し先だとは思うけど。

以前はCSS2をリファレンス本見ながらいじってたな。
最近はジェネレータ的なものやグラフィカルに見せてくれる
リファレンスサイトもあったりして、そっちの方が使いやすい。
ブラウザごとの違いも昔に比べたらマシになったような。

text-shadowは以前もあったと思うけど、
box-shadowってのもなかなか面白い表現だな。
ウェブフォントも標準化が進んで賑やかになりそうだ。

SQLiteが気になる

MacBook Airでsqlite3をいじってみたMySQLユーザーの感想まとめ (IDEA*IDEA)
SQLiteを使うべき10の理由と5つのデメリット (CPA-LABテクニカル)

最近は随分軽快で評判がいいみたいだなぁ、
サーバとして動作しないので、共用サーバで使いやすく、
小中規模のサイトではこちらの方がいいってことだが・・・

型やデータ長を気にしなくてもいいってのは、
人によっては気持ち悪く感じるかもしれないけど、
テーブル設計する時にいちいち将来的に～とか考えてると
面倒くさいので、自分はこういうの有難いな。

なによりバックアップが容易ってのは魅力だよ、
MySQLなんかにもデータの実体が無いわけじゃないけど、
サーバの管理者じゃないといじれなかったりするからね。
他のファイルとまとめて納入できたりするのは便利だな。

CSS整形サービス

CSSをすっきりきれいに整形してくれる『ProCSSor』 (百式)

貼り付けたCSSを指定したルールで整形してくれる、
これ使ってみたけどとなかなか便利かもしれないな・・・

自分の書いたコードを整形するのはもちろん、
他人の書いたものを自分好みに再整形できるのがいい。
色分け表示してくれるので、読むだけでも使えるな。

自分で揃えるの面倒であまりやったこと無いけど、
Columnize(段組表示)はすっきりして見やすい。
自分のスタイルを見直すきっかけにもなる？

WEB脆弱性基礎知識

WEBプログラマー必見！WEB脆弱性基礎知識最速マスター (燈明日記)

こういう記事には必ず否定的意見がついてくるのが大変だけど、
マスターするかはともかく、とりあえずそういうのがあるってのを知る、
という意味では分かりやすいんじゃないかな。

SQLインジェクションやXSSあたりは有名だけど、
ディレクトリ・トラバーサルやCSRF(XSRF)あたりは
名前がピンと来なくて調べるの面倒くさかったり・・・

まあWEBプログラマが対策すべき脆弱性の多くは、
入力データのチェックと適切なエスケープが基本なんだけどねぇ。
受け渡すデータ量が多くなるとこれがなかなか・・・
コードを走査して見つけてくれるプログラムが欲しいわ。

glob()が便利

PHPのglob()がすっごい便利だった件 (IDEA*IDEA)

おおぅ、恥ずかしながら知らなかった。
opendir()でチマチマとディレクトリ内を探してたぜ。

patternで検索してファイル/ディレクトリを配列で返すだけ、
GLOB_MARKでディレクトリにスラッシュを付けたりもしてくれる。
複数ディレクトリをまたぐことが出来るのも使えそうだ。

classファイル、includeファイルの読み込みはもちろん、
user名の関係で消せなくなったファイルを一斉に消す時なんか、
glob()でササッとphpを書けるのは魅力だな。覚えとこ。

閉じタグ不明

tableレイアウトとdivレイアウト…どっちも地獄? (マイコミジャーナル)

tableレイアウト、懐かしいな。
一時期アホのように使ってたこともあるけど、
あれをコード側から編集するとかほとんど不可能だ。

divとCSSもねぇ、コンテンツ部分はすっきりするものの、
divタグだらけになると、どの閉じタグがどのdivか分からなくなる。
インデントしてても離れれば離れるほど行方不明になるね。
折りたたむ機能のあるエディタだとかなり楽になるけど。

まあだからこそすっきりするようなレイアウト構造を、
という努力をするようになって結果的に良くなるんだけどね。
なかなかその域には達しないのです・・・

.htaccess Editor

Webサービス図鑑／ジェネレータ：.htaccess Editor (誠 Biz.ID)

少しいじってみたけどなかなか良かった。
その場で反映される気持ちよさってのもあるがな・・・

まあ実際に使うとなるとこれだけでは足りなくて
mod_rewriteのRewriteRuleなんかもたくさん書きたいし、
RedirectMatchなんかも必要になってくるだろう。
そこまでやると複雑で分かりにくくなっちゃうけど。

モバイルアクセス制限はちょっと有難いかな。
キャリアごとにIPアドレスの範囲をしていしてくれるから・・・
ちょっと多すぎるけど、必要なものだろうし。

カスタマイズが面倒くさい

フリーのWordPress用テーマがPSDファイル付きでたくさん配布されている「WordPress Theme Designer」 (GIGAZINE)

なかなか素敵なテーマがいっぱいだった。
WordPressのテーマってものすごい数が配布されてるけど、
玉石混淆なのでいいものを探すだけで疲れるんだよね。
○○なテーマ50選、みたいなのを探すのが手っ取り早い。

まあデモやプレビュー画像で紹介されてるものは、
英語が多いし、記事中の画像も素敵だったりするので、
日本語で文字ばっかな自分のブログだとあれ？ってことも多々。

頑張って選んでもカスタマイズが面倒くさかったりする。
そのまま使うならともかく、TBの分離とか必要だと特にねぇ・・・
このブログもそろそろ変えたいと思いつつ1年以上経過、
テーマは選んだもののそこから先に進まない（＾＾；

角丸CSSジェネレーター

CSSで角丸を実現するためのコードをさくっと生成『CSS Boarder Radius』 (IDEA*IDEA)

最初に1つ数字を入れると4隅に適用され、
あとは個別に変えるだけ、CSSコードもリアルタイムに反映。
自分で打つよりはるかに早いし見た目に分かりやすいからいいな。

IEでもコードは出るけど当然反映はされず、
Operaも10.10だと同様に角丸にはならないけど、
先日出た10.50ならCSS3対応だから反映されるのかな。

角丸画像作ってテーブルやらCSSで無理矢理組んで・・・
ってやってた頃が懐かしくなるな、微調整に時間かかってたし。

404エラーの工夫

HTTPエラーページ (hail2u.net)

ああ、耳の痛い話だな・・・
カスタムで面白い404を作りたいという衝動はあるものの、
訪問者に親切な404が出来てるかというとなかなか難しい。

結局面倒くさくて.htaccessなんかに1行だけ、
「ErrorDocument 404 /」なんてアホなことをすることもある。
infoseek方式がどんなのだったかは忘れたけど、
エラーページが表示されてアドレスバーのURLも変わるやつか？
表示URLをhttpから書くとそうなるんだったけかな・・・
単なるURLの打ち間違いだったりすると激しく鬱陶しい。

本当は打ち間違えたURL、リファラの検索キーワードなどから
推測されるページをいくつかリストアップするのが望ましいのだろう。
WordPressの404用プラグインにもそんなのがあった気がするけど、
Permalink変更で404の多いブログなんかだと負荷もかかるよな。