WEB ページの可読性向上のための Firefox 機能拡張に関する検討

2008 年度卒業研究概要
WEB ページの可読性向上のための Firefox 機能拡張に関する検討
奥平雅士
研究室
0532171
1. 研究背景・目的
今日、インターネット技術の発達により、さま
ざまな web ページが存在しているが、そのすべて
前田
冬樹
PR、外部へのリンク（図１中②）を見てほしいと
していると思われるが、見る側にとってはそれが
目的の情報を見づらくしている傾向がある。
のページが見る側にとって見やすいデザインとは
限らない。中には自分の欲しい情報を見つけ出す
前に見るのが嫌になってしまうような見づらいペ
ージもある。そのようなページから少しでも欲し
い情報を見つけやすくすることを目的として本研
究を行う。
2. 研究内容
本研究では、サイトの見易さを阻害している要
素を分析し、それを自由に表示を制御できるシス
テムについて検討する。
図１
3. システム概要
企業のサイトの例
本研究では、同一 web ページ内の情報をいかに
見やすくするかということを基本に考える。シス
テムは Mozilla Firefox[1]というオープンソース・
3.2.
システム機能
本システムでは下記の項目の表示、非表示を制
クロスプラットフォームのウェブブラウザの拡張
御するものとする。
機能として作成することにした。したがって
a) 外部ページへのリンク：
Firefox が入っていれば誰でも簡単に、他の拡張機
同サイト内の情報を基本とするため、第一義的に
能と同様に導入、使用することができる。
外部ページへのリンク情報が必要ない場合。
b) サイドバー：
3.1. 阻害要素の分析
さまざまな web ページ、特に図１に示すような
サイドバーが不要な場合。
c) 画像広告：
企業のサイトなどを見るとページ内の情報量の多
そのサイト内の情報のみを見たい場合。ただし、
さに気づかされる。企業側としては、ニュース記
現在、広告を消すだけの機能の拡張機能は存在し
事以外にもたくさんの広告（図１中①）や自分の
ている。
d) 背景画像：
定するため、それを非表示にする。
サイトによっては背景画像によって文字が見づら
e)入力 box は form タグを使用しているため、それ
くなっている場合。
以外の要素を非表示にする。
e) 入力 box 以外の要素：
f)この広告は、Javascript で動作しているため、こ
文字や画像が乱雑に配置されていて入力 box の場
の部分のみの Javascript を動作させなくする。
所がわからない場合。
f)
スクロールしても移動してくる広告：
見る側としては。目障りである場合。
4. 実験・考察
図 1 のページに対し、3.3 の機能の操作をした例
また、上記のものを消した場合にできるスペース
を図 3 に示す。大方の web ページに関しては、こ
は見易さを考え、文字を詰めたりせずそのままの
のように概ね期待通りに動作した。デザインを保
スペースを空けておくものとする。
持したまま阻害要素を非表示にすることにより、
可読性を向上させることができた。細かな設定な
3.3. 操作方法
どが必要なく、一般的な HTML の web ページを対
細かい設定などは必要なく、メニューから図２
のように選んでクリックするだけで表示、非表示
象としては、効果的な機能拡張システムを実現で
きたと思われる。
を繰り返すことができる。
図２
項目選択画面例
3.3. システム構成
上記の制御項目についてすべて CSS によって
図３
表示の操作をしている。
動作結果
a)リンク先のアドレスと操作対象のページのアド
レスとを比較し外部へのリンクかを判断し表示、
非表示を判断する。
5. 今後の課題
本システムでは、上記のような項目で表示、非
b) これはテーブルタグを使用しているため、その
表示を制御したが、Flash など可読性阻害要因は他
幅などを変更することによりサイドバーを非表示
にも考えられる。それらの対応についても必要に
にする。
なってくるであろう。
c) 画像広告は、Iframe を使い外部からの画像を表
示させているため、それを非表示にする
6. 参考文献
d)背景画像は、BODY タグの background 属性で設
[1]Mozilla Firefox：http://mozilla.jp/firefox/