ユーザビリティ XOOPSの文字サイズ

私はいつの間にか参加しないという事になっていた、大分市のプロジェクト。私が参加する研究室を含め、3研究室合同のプロジェクトとなっており、研究生の殆どが参加しているので、プロジェクトの参加有無に関係なく嫌でも内容は耳に入ってくる。その中でも大分市からの要望で高齢者でも読みやすいように文字サイズについての要望があったらしい。つまり、文字サイズを可変にするという事になる。

大分市のプロジェクトで使用するシステムはXOOPSでほぼ決まりのようなので、そのXOOPSでどのようにして文字サイズを可変にするかという事がメインの疑問として持ち上がる。

今日行われた、私が参加できなかった研究室のゼミの参加学生で、進捗に可変フォントサイズについて以下の様に書いていた。

• 案その１
  フォントの大きさ別にテーマを作成し、ユーザーが選択できるようにする。
• 案その２
  JavaScript?で対応。（CSS連動ができれば全てのページに反映できるはず）

これを見た途端に鼻で笑ってやりました。ユーザビリティを考えてフォントサイズがどうこう言っているはずなのに、ユーザビリティ完全無視な提案ですね。まぁ、ウチの学科の学生の思考程度なんて、たかが知れてますからしょうがないでしょうが。

さて、フォントサイズを設定する方法をいくつか挙げてみましょう。

• 閲覧者がブラウザのフォントサイズを変更する。
• HTMLのfontタグを使う。
• スタイルシートで設定する。

まず、2番目のHTMLのfontタグは非推奨のため除外します。閲覧者がブラウザのフォントサイズを変更するのはブラウザ毎により異なるのであまりよろしくありません。また、スタイルシートの文字サイズのサイズ指定での単位によりフォントサイズの変更は不可能となります。という事で、ユーザビリティの点からもWebの仕様的な点からもスタイルシートで設定するのが一番良いと考えられます。現に各種のCMSやWeblogではスタイルシートによるデザインのみによる構成が殆どです。これはWebの仕様として準拠している点や、SEOの観点からも推奨されると思われます。

さて、ここでXOOPSのデザイン面からHTMLの構成を見てみましょう。XOOPSは基本的なレイアウトを保つために、XHTMLで非推奨のデザイン面でテーブルが使われています。しかし、カラーに関する点ではスタイルシートで設定されているようです。且つ、レイアウトを変更するためのテーマがデフォルトで入っています。テーマはあくまで全体的なレイアウトを変更するための物であり、フォントサイズを変更するだけに使用するには適していません。もし、その様な事にだけ使われるのであれば、それはテーマの機能自体が非効率で無駄とも言えるでしょう。

では、JavaScriptを使うのはどうでしょう。ここではユーザビリティを重視しているが故、JavaScriptと言う名のブラウザ依存は使うべきではありません。これを使う事によりユーザビリティの一つが無視される事になります。この場合、それでは意味がありませんね。JavaScriptという機能はブラウザ毎に大きく異なり、また、ブラウザ使用者によって有効、無効を選択できます。閲覧者には嫌われがちな製作者側による鬱陶しいウィンドウ制御を除去するためにJavaScriptを無効にしている閲覧者だっています。ハイ、私の事ですよ。

では、ユーザビリティを考えた上で、どのブラウザでも同じ動きをさせるにはどのようにすればよいでしょうか。答えは簡単です。閲覧者側のマシンの性能を食わない、サーバサイドプログラムにすれば良いだけです。XOOPSはPHPで動作しているため、ここで言うサーバサイドプログラムはPHPが妥当かと思われます。サーバが対応していればPerl等でも構わないと思います。

さぁ、ここで一つ疑問が浮かぶでしょう。サーバサイドプログラムでどのように文字サイズを変更させればよいのか。ここで答えとも言えるべき物を書きましょう。# 私はプロジェクトに参加してないはずだけどなぁ...。

まず、XOOPSで標準搭載されているモジュール機能を使い、XOOPSのトップページなり全ページなりに、フォントサイズを変更するための機能を表示させます。そのフォントサイズを変更する機能から引数でも渡して別ファイルになっているスタイルシートに引き渡します。ただし、このスタイルシートは標準のスタイルシートではありません。スタイルシートを出力（print）するPHPプログラムとなっています。

このスタイルシートを出力するPHPですが、HTMLのヘッダで別ファイルにリンクするスタイルシートを設定しておきます。出力するPHPも2種類有り、拡張子はCSSだが.htaccessを弄って中身はPHPで作る方法と、HTMLのヘッダで指定する別ファイルのスタイルシートを、本来なら拡張子CSSの所を無視してPHPファイルにリンクする方法もあります。HTMLのヘッダタイプの方は検証していないですが、問題なく動くと思われますが、Webの準拠からすると余りよろしくない様な気がします。

以上の方法を用いる事により、ユーザビリティを考慮した上で、どのような環境でも同じ様な表示ができます。

# XOOPSのモジュールについては詳しく調べてないので、モジュール作成経験があるプログラムが得意な子に丸投げしますw

# てか、普通ならこの位の案は出てくると思うんだけどなぁ...。

アルコール入っている時の方が、こういうのを書きやすいのはなぜでしょう...。