この論評は最新のものではありません。最新の論評を読むには目次からご覧ください。
そもそも私がこの「献血‐みやぎ」というウェブサイトを作ったきっかけは――
……という二点にあるのですが、前者にしても後者にしてもそれなりに解決しつつあります。つまり、このサイトを作った意味も今となっては薄れてきているのかな、という気もします。
しかし、現在の宮城県赤十字血液センターのウェブサイトは、いまひとつ作りの良いサイトとはいえません。このページでは、あえて問題点を浮き彫りにし、よりよいサイトとなるような提案をしてみようと思います。
私の環境――OS=WindowsXP、ウェブブラウザ=Opera 7.23――で宮城県赤十字血液センターのウェブサイトを見ると、次のように表示されます。
実は以前はもっと寂しい状態だったのですが、画像に代替テキストを設定しないと画像を表示しない私やそもそも画像を見ることのできない視覚障害者に不便なのでこころWebからの提案あたりを読んで改善してくれ
といった意見を出したせいか、少し改善されたようです。
画像表示を無効にしているとページ内にセンターの名前がないというのは依然として残念ですが……。
でも、紹介したこころWebからの提案ではちょっと説明不足だったかも知れません。たぶんそこからリンクされているアクセシブルなWebデザインについての画像の代替テキストについてあまり長くならない程度に
と書いてあるくだりをお読みになったと思うのですが、これはいわゆるイメージ画像についての注意であり、テキストをまんま画像化したような場合はそのテキストをまるごと代替テキストにして問題ないし、等価な情報を伝えるためにはそうするべきです。たとえばひところセンターのトップに使われていたこの画像――
……代替テキストがありません(とりあえず“豆腐”を入れておきましたが)。私だったら(そもそも画像にしませんが)書いてある文字を全て代替テキストに設定します。
ブラウザの画像表示を無効にして比べてみてください。
もっとも、画像表示オフのOpera 7.23で見ると文字が折り返されず横に伸びてしまって見づらいのですが、まぁそこはOperaの気が利かないということで……。
あと、ポイントカードの説明も画像表示しないとわかりません。これはアクセシビリティにとどまらず、検索エンジンもこの情報を取得できないという問題もあります。現にけんけつくらぶ
で検索してもセンターのページが検索結果に出る検索エンジンはないようです。あるいはMETA要素でキーワードを記述しておけば検索エンジン対策にはなると思いますが、まずアクセシビリティを考えてほしいところです。
それと発効日
はたぶん発行日の間違いなんだろうな……
画像表示しないと内容がわからない、といって画像を表示しようとすると……ブロードバンド接続者だけを相手にしているならともかく、トップページに563KBもの巨大画像を貼り付けないでください!
念のために書いておきますと、小池栄子氏の画像のことです。ちなみにこの画像、IMGタグのWIDTH・HEIGHT各属性で見た目の大きさを変えているだけで、実際は寸法もかなり大きい画像です。いったん自分のパソコンに保存して画像だけ開きなおしてみるとわかると思います。
ここも画像に頼りすぎです。というか、ページ上部のナビゲーションリンクが見えません(マウスポインタを持っていくと手の形になるのでリンクなんだろうなという想像がつく)。ぜひ代替テキストを設定してください。
トップページだけ代替テキストを設定したのでしょうか。指摘した側としては残念です。
主な問題点は北仙台献血ルームと同じ。他に気になったのは、駐車場案内へのリンクがページ先頭にあること。いちおうCSSでレイアウト調整しているので画面上の先頭よりはちょっと右下に表示されますが、音声ブラウザでは真っ先に読まれますしCSSが無効な環境ではもちろん最初に表示されます。さほど実害はないにしろ、不自然であることは否めません。
CSSでレイアウト調整すれば記述する順番はどうでもいいとは思わないことです。
それと、藤崎デパートの休日はルームも休日なので私が藤崎献血ルームを紹介しているページでは藤崎デパートの営業日(休業日)の情報ページにリンクしていますが、そうしたほうが便利なのではと思います。
なぜかこのページは画像に適切な代替テキストが設定されています(代替テキスト無しを指定すべき画像も多数ありますが)。
しかし、レイアウト調整の問題は同様です。
北仙台・藤崎のページと同様です。
そういえば、藤崎のページにもこちらにも栄養相談のことが載っていませんね。
TABLEレイアウトがすごいページです。JavaScriptで凝ったことをやっているようですが、もうちょっとシンプルなつくりでもよかったのではないでしょうか(1枚の画像でイメージマップにするなど)。そもそも、マウスを近づけるまで各施設の名前が表示されないことの意味がわかりません。駐車場の名前も表示できないほど込み入っているようには見えませんし……何が言いたいかというと、印刷して使いたいときに不便なのでは、ということです。
これは近いうちに私なりのを作ってみようかとも思います。
成分献血が行われる市町村名は赤色になっていますが、色だけに頼った区別は環境によっては伝わりません。ここは私がやっているように(成分)
などとテキストを添えるか、せめて強調要素(EMやSTRONG)でマーク付けしてほしいところです。
強調要素を強調して読んでくれない音声ブラウザがあるのはそれはそれで残念なことですが……。
それと、見出しが市町村名
のカラムに祝日の名前が入っているのはどうかという気がします。日付と一緒のセルに記述しても良いのではないでしょうか。
T字形に区切ったフレーム上部はスクロールバー表示を抑制していますが、高さが足りなくてナビゲーションリンクが表示されません。幸いホイールマウスのホイールを回せばスクロールしますしフレームの区切りも動かせるのでなんとかなりますが、ちょっと不便です。
表彰者の一部しか載っていませんが、紙面の都合
っていったいなんですか(^_^;)? 献血者有功章はともかくとしても、推進者・推進団体の数人とか数十人の規模のリストならぜひ全件載せてください。紙面で省略された人も、ウェブで載せられればまた報われるのではないでしょうか。
また、この文書や他のお知らせ文書の末尾にいま日本は、少子高齢化社会を迎えつつあります。
といったメッセージが添えられていますが、これは「お知らせ」を表示したときの右下のフレーム内に初期表示しておいたほうが良かったのでは、と思います。
ページタイトル(doc_sub1.gif
)がどう考えても不適切です。
あと、各リンク先が日赤本社のページであることに言及しておいたほうが良いのではないでしょうか。
HPですか……いえ、なんでもありません。とりあえずさらっとまとめて指摘しますと――
献血ルーム紹介は電話番号をtelスキームでリンクすれば電話かけるときに便利なのでそうするよう進言します。たとえばこう→<a href="tel:0227179028">022-717-9028</a>
献血バス運行予定は区切り線に*-*-*-*-*-*-*-*
なんてアスキーアートを使用していますが、これはhrタグ一発にすべきでしょう。まぁ、飾ってみたい気持ちもわかりますが……で、下の区切り線に米印がひとつ少ないというのは……?
在庫状況のマスコットの画像だけPNGなのはなぜでしょうか? というか41KBもあるし。
いまさらこんなことを書くのも気がひけますが、HTML文書というのは実にいろいろな環境で便利に参照できるように設計されています。せめて、ブラウザを画面いっぱいに広げたときに空虚な余白が出現したりしないようにマーク付けしていただけないものでしょうか。
