閲覧中の Web ページに Thumb Zone Map （親指が届く範囲マップ）をオーバーレイ表示するブックマークレットを作った

Scott Hurff 氏による、「Thumb Zone Map」を閲覧中の Web ページにオーバーレイ表示するブックマークレットを簡単に作ってみました。

GIZMODO で紹介されていた（日本語版記事はここ）、Scott Hurff 氏による、「Thumb Zone Map」を閲覧中の Web ページにオーバーレイ表示するブックマークレットを簡単に作ってみました。

役に立つかは不明ですが、自分の Web サイトとか、iPhone だと親指でどの程度のところまで指が届くのかな～なんて確認するにはいいかもしれませんよ。

使い方は下記のリンク先を見てください。ブックマークレットの使い方を知っている人ならいまさら説明の必要もないと思いますが。

iPhone 4 / 5 / 6 / 6 Plus でブックマークレットが別れているので、必要なものをどうぞ。「choke-up」というのは画面の上端に親指が届くように持ち方を変えた場合のことです。iPhone 6 / 6 Plus にだけ用意されています。

実際にブックマークレットを起動すると下記のようにオーバーレイされます。リロードすれば消えます。画像をオーバーレイ表示しているので、起動中は画面上のタップなどはできません（スクロールはできますよ）。

もちろん、Firefox のレスポンシブモードなどでも使えますので、制作中にちょこっと確認なんてこともできるかも。

Thumb Zone Map について

Thumb Zone Map は Scott Hurff 氏によって「Thumb Zone Templates」として Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License の元に配布されているものを使わせていただいています。