ブックマークレットを使ってiPhoneでもcheckpad.jpを見やすく

checkpad.jpというサービスを使って、チェックリストの共有をしています。
シンプルかつ十分な機能を持っていてすばらしいんですが、残念ながらiPhoneのSafariから見るとやたらと文字が小さく見えてしまいます。これをbookmarkletを使ってなんとかしてみました。

以下の文字列をbookmarkletとしてiPhoneのSafariに登録して、checkpad.jpのサイトを開いた状態で適用させてください。拡大するだけですがかなり見やすくなると思います。

javascript:m=document.getElementsByTagName('meta');for(i=0;i%3Cm.length;i++)if(m%5Bi%5D.name=='viewport')m%5Bi%5D.parentNode.removeChild(m%5Bi%5D);vp=document.createElement('meta');vp.name='viewport';vp.content='width=320,minimum-scale=0.667,maximum-scale=2.0';document.getElementsByTagName('head')%5B0%5D.appendChild(vp);undefined;

iPhone4Sで見るとこんななんですが

iPhone4Sで見るとこんななんですが


このbookmarkletを使うとここまで拡大できます

このbookmarkletを使うとここまで拡大できます

参考にしたのはブックマークレットで CSS と viewport を設定htmlをiPhoneに対応させるの各ブログです。
iPhoneのSafariにbookmarkletを登録する方法はいろいろあるみたいですが、AppBankの説明が詳しくていいかと思います。

元に戻したくなったら、ページをリロードすればOK。ページが切り替わるたびにいちいちbookmarkletを適用させないといけないのが難点ですが、見やすいほうがよっぽどありがたいので意味はあるのかなーと思っています。
このbookmarklet自体はcheckpad.jp専用ではないので、字が小さくて見にくいサイトに使ってみると字が大きくなっていいかもしれません。

レスポンシブWebデザイン「超」実践デザイン集中講義
山崎 大助
ソフトバンククリエイティブ
売り上げランキング: 4,903
勇者と冒険する ゲームプログラミングの世界: enchant.js+JavaScriptで行こう!
布留川 英一
誠文堂新光社
売り上げランキング: 264,149
カテゴリー: ありものソフト, サイト タグ: , , , パーマリンク

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中