2005年05月16日

ご協力ありがとうございます&小窓配布版

小説本文ページ読みやすさアンケートにご協力ありがとうございます。
予想以上に多くの投票をいただいていまして、結果を楽しく眺めています。みなさまの参考にもなっていれば幸いです。

さて、このアンケートで使っていました、「小窓でデザイン調節機能」そのものもご要望があるようでしたので、ついでに配布版を作成してみました。
Cookieで自分の設定した値を保存できるバージョンです。

http://htmldwarf.hanameiro.net/tools/DesignChange.lzh

サンプル:
http://htmldwarf.hanameiro.net/tools/DesignChange_sample.html

使用方法:
1)DesignChange.lzhを解凍する。
2)DesignChang.jsをエディタで開き、/* ------------ 初期設定 --------------*/となっている部分の値を自分の好みに変更。
3)DesignChange_sample.htmlを参考に、変更機能をつけたいページを編集する。作業は以下の3点。
 ・DesignChange.jsを読み込むタグ(<script type="text/javascript" src="DesignChange.js"></script>)を<head>〜</head>内に追加
 ・(<body>タグ内に、ページを開いたときにCookieに記録した設定を読み込む命令を追加(onload="Read())
 ・デザイン変更小窓を開くボタンを追加(<input type="button" value="デザイン調節" onclick="window.open('DesignChange.html','w','width=250,height=200,scrollbars=yes,resizable=yes')">)
 ※小窓を開くボタンは最初のページだけでもOKです。
4)DesignChange.jsとDesignChange.htmlをサーバーにアップ。(変更機能をつけたいページと同一ディレクトリに)
5)動作確認してください。

……しかし実際のところ、このリモコン機能が必要なのは作品を発表するときではなく他人の作品を読むときなんですよね。
というわけで、サンプルページ(http://htmldwarf.hanameiro.net/tools/DesignChange_sample.html)から開く小窓にはBookmarklet生成機能ものっけてみました。

使い方:
1)小窓の下のほうにBookmarkletというボタンがあるので、好みのデザインになったらこのボタンを押して下さい。
2)そうするとさらに下に「小説デザイン変更」「小説デザイン変更(マージンなし)」というリンクが生成されるので、そのリンクを右クリックしてお気に入りに追加(WindowsIEの場合。他のブラウザの場合も同様の操作をしてください)してください。
3)Bookmarkletがあなたのブラウザに登録されるので、デザイン変更をしたいページを見ているときに使ってください。

すでにマージンが設定してあるページにさらにマージンを設定すると表示がひどいことになるので、マージンなしのバージョンも作ってあります。お好みのほうを使ってください。
また、小説本文をテーブルに入れているページだと、変更が反映されません。(IEの場合。他のブラウザは未確認です)ブラウザの使用ですのでご了承ください。

きっちりと動作確認をしたスクリプトではないので、不具合や御要望などあれば、お気軽にお願いします。

5/17追記:
Bookmarkletをちょっと修正しました。そのページのスタイルシートを一度無効にしてから好みのスタイルを適用させてます。テーブル要素にも行間や色を適用させられるようになりました。
スタイルシートでデザインしていなかったり、中途半端にしか適用していないページだと相変わらず読みやすくはなりませんが、使えるページが前よりは増えたかと思います。
なお、このBookmarkletはフレームページには残念ながら使えません。(右クリックからお気に入りを呼び出せるようにブラウザを拡張すれば使えるかもしれません)ひとまずはフレームのメニューからShift+クリックで別窓表示で読むのをおすすめします。
posted by 文月夕 at 12:55| Comment(0) | TrackBack(0) | 便利ツール開発 | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

PR