日本の法律の原文を読みたいときは、総務省が提供している「e-Gov」の法令検索ページで検索し、読むことができます。
しかし、誰がどう見ても、この原文がとにかく読みづらいのです。
例えば「著作権法」をご覧ください。
文字がウィンドウ幅いっぱいに満たされ、行間も狭く、インデント(字下げ)が通常の文書のアウトラインと逆になっていて、タイトルが本文よりも右にインデントされていたり…と、問題点を挙げればキリがありません。
そこで、これを誰もが読みやすいであろう、階層レイアウトに補正するスタイルシート(CSS)を作成し、Firefox、Google Chrome、Safari の拡張機能「Stylish」のテーマとして公開しました。
これを使うと、次のようになります。印刷してもそのままのレイアウトで印刷されるので、印刷する場合にも便利です。
今回は「Stylish」って何?という方のためにも、順を追って解説したいと思います。
Webブラウザ拡張機能「Stylish」のインストール方法
利用したいブラウザで、下記サイトの+無料
ボタンや追加
、インストール
などのボタンをクリックすると、そのブラウザに「Stylish」という拡張機能が追加されます。
(残念ながら、現時点では Internet Explorer 用の「Stylish」はありません)
追加後にブラウザの再起動を求められる場合もありますので、その場合は画面の指示に従います。
「Stylish」の追加が完了すると、ブラウザのツールバーに次のようなアイコンが表示されます。
Stylish のインストールはこれで完了です。
公開されている「Stylish用テーマ」をインストールする
「Stylish」は、自分で独自のスタイルシートを記述出来るだけでなく、特定のサイト用に公開された「Stylish テーマをインストール」することで、CSSの知識がなくても簡単に使えるようになっています。
今回作ったテーマ(スタイルシート)は、次のサイトで配布しています。
あとは、このページの+ Install with Stylish
ボタンをクリックすればテーマがインストールされます。ブラウザによっては、インストール時にどのURLが適用対象になるかを表すダイアログが表示されることもありますので、その場合はそのままOK
をクリックしてください。
テーマのインストールはこれで完了です。
まず試しに、先ほどの「著作権法」を見てみてください。
おそらく劇的に読みやすくなるのを体感できるのではないでしょうか。
法令ページだけでなく、検索結果や未施行のページのレイアウトも改善
今回作成した「Stylish テーマ」は、法令本文だけでなく、検索結果一覧ページや検索ページにも手を入れ、「法令データ提供システム」のサイト全体の読みやすさを向上させています。
ただ、「e-Gov」の法令HTMLデータは、h要素が全くないなど、マークアップコンテンツとして全く構造化されておらず、条件別CSSセレクタをフル動員してなんとか体裁を整えているので、ひょっとしたら一部表示が崩れるページがあるかもしれません。HTMLを解析しながら、スタイル適用パターンを絞り込むのにかなり苦労しました…
「Stylish」の便利機能:サイトごとにテーマがないか検索も可能
「Stylish」の使い方としては、むしろこちらが王道かもしれませんが、「Stylish」は、上記のように直接テーマのページにアクセスしてテーマをインストールすることが出来る他、訪問中のサイトに誰かが作った「Stylishテーマ」がないか、検索する機能もあります。
サイト閲覧中にブラウザツールバーの「Stylish」のアイコンをクリックすると、「このサイト用の他のスタイルを検索」という項目が表示されるので、これをクリックすると、そのサイト向けに公開されている Stylish テーマがあれば、一覧が表示され、好みのテーマをインストールすることも出来ます。
実は、他にもいくつか自作のテーマをアップしていますので、また別の機会に紹介したいと思います。
[asin:B009M8OFMK:image] [asin:B009MAT0QY:image]
↑無料 Kindle 版です。