コミュニケーション学科サイトのユーザビリティチェック結果
目次
現学科サイトのユーザビリティチェック結果
2004年前期の3年次演習で取り組んでいる「コミュニケーション学科サイト リニューアルプロジェクト」(作成中)の一環として,
以下の資料に掲載されているユーザビリティ原則に基づいて,
現コミュニケーション学科サイト(2002年9月から公開されている学科サイト)のチェックを行った.
「標準ウェブユーザビリティ辞典」,ソシオメディア(株)編著,インプレス発行 (2003).
この資料の基準編には,5分類に渡って合計100個のチェックポイントが解説されている.
以下,各チェックポイントのタイトルを引用しながら,3年次演習の学生が分担してチェックした結果を報告する.
評価結果は,5(満たされている)− 3(どちらともいえない)− 1(満たされていない)までの5段階で示す.
評価結果が1又は2となったチェックポイントは改善を要し,3又は4となったチェックポイントは,改善が可能であると考えられる.
アイデンティティ:サイトとその運営者の表現
- (001)ホームを見て,サイトの主な内容が分かるようにする: 3
- 学科で承認されたサイトID(ロゴマーク)を作成して,それを利用すべきである.
また,現ホーム(トップページ)では,左コラムと右コラムに主要メニューが分かれているが,これを整理した方が学科サイトの概要が把握しやすいと思われる.
- (002)ホームは,そこがサイトの入り口であるように見せる: 3
- ホームのデザインが表紙らしくない.もう少し,他のページとの区別がつくようにしたほうがよい.
- (003)ホームでは,重要度の高いタスクを強調する: 2
- ユーザ中心に考えて,ユーザごとにメニューを分けるなどの工夫が必要.
写真が中央にあるのはデザイン上の大きな欠点である.写真のおかげで,What's Newなどの重要度がより高いコンテンツが画面の下側に隠れてしまった.
ユーザのカテゴリーによって,メニューの優先度を変えた方がよい.
- (004)運営者とサイトの関係を明確にする :2
- 広く知られている社名やブランどがある場合はウェブでも使用したほうがよいことから、もう少し東京女子大学をアピールした方がよい。
- (005)運営者と概要を紹介するセクションを、分かりやすく用意する :2
- 運営者の概要として、”ようこそ”のページで学科の説明はあるが、メールでの問い合わせなど基本情報が不足している。
これら全てが一つにまとめられたページがあるとよい。
- (006)すべてのページに一貫したサイトIDを表示する :4
- 全ページに共通したサイトIDが付けられているが、サイトID(ロゴマーク)に工夫が必要。
- (007)サイト全体とサブサイトとの関係を明確にする :評価対象外
- サブサイトを作る場合は、メインサイトととの関係を明確にし、簡単に上位のメインサイトに戻れるようにする。
- (008)ページのデザインは、サイト全体で統一感のあるものにする:5
- 東京女子大学のサイトと同じように「赤」の配色を主体に、統一感を持ってデザインされている。
- (009)複数のブランド名などを混在させない:4
- 大学名と学科名のみが常に最も上位に位置している。
ただ、学科で承認されたサイトID(ロゴマーク)を作成して、それを利用したほうがよい。
- (010)運営者にすぐにコンタクトできるようにする:2
- 「お問い合わせ」などのリンクはない。
- (011)コンタクトの目的を限定しない:評価対象外
- 「お問い合わせ」などのリンク自体がない。
さまざまな目的のコンタクトを受け付けられるリンクを作るべきである。
- (012)コンタクト手段を複数用意する:3
- 「お問い合わせ」などのリンクはないが、すべてのページの一番下に住所、電話番号、FAX番号、メールアドレスが書いてある。
- (013)各種ポリシーを明確にする:評価対象外
- プライバシー、セキュリティに関するリンクはない。
ユーザーに個人情報を入力させたりするページがないので、現段階では評価対象外だが、
「お問い合わせ」などユーザーの個人的な質問を受け付けたりするようになれば、各種ポリシーを明確にする必要がある。
- (014)すぐに各種ポリシーを参照できるようにする:1
- 各種ポリシーが存在しない.
- (015)利用条件として、ユーザーの自由な利用方法を一方的に制限しない:4
- 学外者が閲覧できないページもあるが、利用方法はそれほど制限していない。
「サイトのご利用にあたって」などのページを作ってもよい。
平均点:2.1
「目次」に戻る
- (016)分かりやすい分類基準を用いて、主要カテゴリーを分類する:3
- だいたいのカテゴリーの意味は分かるが、「在学生向け情報」の「MML」や「教員向け情報」の「ノスタルジア」は一部の人にしか意味が通じない。
- (017)複数のカテゴリーに同じコンテンツを置かない:3
- たとえば「卒業論文マニュアル」に直接行けるリンクと、「卒業論文」→「卒業論文マニュアル」で行けるリンクが共にトップページにある。
あまり複数の場所からリンクされているのは良くないのでは。
- (018)情報の深さ・幅・量・バランスをとる:5
- 特に深い階層は見当たらない。
- (019)URLがサイト構成理解の助けになるようにする:5
- たとえば「教員紹介」は staff/index.html など、全体が分かりやすいURLになっている。
- (020)ウィンドウタイトルで内容を適切に表現する:5
- 東京女子大学[教員紹介] のように、サイト名+ページ内容 になっている。
- (021)ラベルを読んで、リンク先の内容や動作を推測できるようにする:4
- (016)でも言及したように、「ノスタルジア」等は内容が分かりにくい。それら以外は特に問題無し。
- (022)ひとつの機能やコンテンツに対して、常に同じ名称を用いる:2
- 「学科刊行物」から行った先が、いきなり「Culture & Communication」ではちょっと戸惑うかもしれない。
「学科刊行物」というタイトルの後に「Culture & Communication」を持ってくるべきでは。
- (023)サイト内の共通要素は、どのページでも同じ場所にレイアウトする:3
- トップページと他のページでナビゲーションの位置が違う。「東京女子大学コミュニケーション学科」ロゴはいつも同じ位置にあるけれど。
また、後から加えられたと思われるページ(「学科推奨ノートPC」等)はデザインが異なっている。
- (024)無駄な余白や要素の詰め込みすぎを避ける:3
- 横幅を740ピクセルに固定している。一般的なユーザにとってはちょうど良い大きさで表示されるが、特殊な解像度で閲覧するユーザにとっては問題がある。
- (025)重要な情報は画面の上部に目立つように配置する:4
- ページの上部に、各ページのタイトル・関連メニューなどがある。余計な装飾もないので、効率よくページを見ることが出来る。
ただ、トップの写真の位置は変える必要あり。
- (026)1ページ内で、関係の深い情報や機能を視覚的にまとめる:5
- グループ化も行われていて、特に問題はないかと思われる。
- (027)1ページのコンテンツは、ひとまとまりの情報で切り分ける:3
- 書式もそろっているし、各ページの独立性も保たれている。
しかし1ページの長さがバラバラなのでそろえて見やすくしたほうがよい。(特に科目のページ)
- (028)装飾のための画像を過度に使用しない:3
- トップページの写真の位置が「what's new」を見にくくしているので、写真を小さくして横に並べるなどの改善の必要がある。
トップページ以外に問題はないと思われる。
- (029)情報を蓄積して、過去のコンテンツも閲覧できるようにする:2
- 「what's new」をもっと簡潔にして見やすくする。学科刊行物の12号以前も閲覧できるようにする。
- (030)総合的なヘルプページを用意する:1
- ヘルプページがない。サイト内の共通機能として、分かりやすい場所にリンクを配置しておく。
- (031)サイト全体の情報構造を視覚化したサイトマップを用意する:1
- サイトマップがない。三階層程度の情報に直接アクセスできる様なサイトマップへのリンクを、全てのページに配置する。
- (032)商品名などをインデックス化したページを用意する:3
- 学科サイトには「ターゲットユーザー別」の索引がとても有効なので、ターゲットユーザーの種類を増やし、
彼らが必要とする全ての情報のページへ行けるリンクをのせる。
- (033)シンプルな検索機能を、全てのページに分かりやすく配置する:1
- 検索機能がない。
ある程度曖昧な言葉でも関連する情報にヒットするようにし、シンプルな入力フィールドと「検索」ボタンを目につきやすい位置に配置する。
平均点:3.1
「目次」に戻る
インタラクション:動的な構造と分かりやすさ
- (034) ページの読み込み時間を、できるだけ短くする:4
- 授業紹介のページがやや重い.資格取得ページの画像ファイルが重い.
- (035) ホームへのリンクを、全てのページにわかりやすく表示する:3
- おおむねどのページにもホームへのリンクは貼ってあるが徹底されていない.
- (036) サイト全体と閲覧中のページとの関係が分かるようにする:4
- シンプルでデザインは統一されてはいる.
ユーザが現在見ているページのリンクを太字で表示されているが、見づらい.
- (037) いつでも閲覧中ページの上位階層に移動できるようにする:2
- ページによっては階層が分かりづらく、ユーザが迷う可能性がある.
- (038) ひとつの対象トピック内では、ページを並列移動できるようにする:4
- サイトの構造自体があまり複雑ではない.
- (039) 閲覧中のページから関連項目などを参照できるリンクを用意する:3
- ユーザが、いま見ているページと示されたリンクとの関連性を理解できるような表示が必要.
「卒業後の進路」ページに就職課のリンクを貼るなど、リンクをもっと充実させてみてはどうか.
- (040) ユーザの行動を意識したリンクの導線を設ける:3
- グローバルナビゲーションがサイトの内容を把握するのに十分役立っている.
- (041) 重要なリンクにスプリング式のコントロールを使用しない.
※スプリング式のコントロールの例・・・マウスポインタを重ねないとわからないリンクや、ドロップダウン式メニュー など。:5
- 余計な演出がなく、シンプル.
- (042) テキストリンクは「未訪問」と「訪問済み」が分かるようにする:1
- グローバルナビゲーションにあるリンクの色が変わらない。下線がない.
- (043) 画像リンクは、クリックできそうに見えるデザインにする: 評価対象外
- 画像リンクがない.
- (044) 現在の状況において意味のないリンクは排除する:1
- 「自ページ」へのリンクあり.
- (045) アイコンは、文字ラベルとともに分かりやすくデザインする:評価対象外
- 評価の対象となるアイコンがない.
- (046) リンクのそばに補足説明を併記する:4
- 学科サイトを見る限り、補足説明の必要性はあまり感じない.
- (047)メニューは、視覚的にコンテンツと区別できるようにする: 5
- メニューは大変見やすい。
- (048)複数のメニューがある場合には、それぞれの役割を明確にする: 4
- 複数のメニューがあるが、役割ははっきりと分かる。
- (049)メニュー項目の数を、ユーザーが一度に把握できる範囲におさめる: 3
- 在学生向け・教員向け情報のメニューがやや見にくい。
- (050)リンクラベルには、文脈に依存した表現を用いない: 3
- 「<--クリックすると全文がダウンロードできます」という表現があったので、直した方がよい。
- (051)視覚的に同じ特徴を持った要素は、同種の反応を示すようにする: 2
- リンク集のページだけ、他のページではリンクしない見出しの部分にリンクが貼ってある。
- (052)リンクは、ユーザーが予測できる反応を示す : 3
- 予測できないものはないが、同じメニュー上にあるものでもリンク先の形式が違う。
- (053)リンク先がHTMLでない場合には、事前に分かるようにする : 4
- PDFファイルへのリンクは、ファイルの大きさも表示されている。
- (054)フォームの要素は、項目数、グリッド、順序を考慮する:評価対象外
- フォームはない。
- (055)フォームでは、一度入力した内容や回答できない質問をしない:評価対象外
- フォームはない。
- (056)システム側で対処できる入力補完を、ユーザーまかせにしない:評価対象外
- 入力機能はない。
- (057)高度な機能は、ユーザーが意識的にそれを呼び出すようにする:評価対象外
- 高度な機能は用意されていない。
- (058)エラー時には、分かりやすい状況説明と建設的な指示を提示する: 2
- defaultのエラーページしか表示されない.
- (059)詳細なマウス操作や限定時間内での操作を要求しない: 4
- (それほど細かなマウス操作は必要とされない。)限定時間も設けられていない。
平均点:3.2
「目次」に戻る
アクセシビリティ:さまざまな環境への配慮
- (060)ユーザーエージェントのために情報を適切に記述する:4
- HTMLのバージョン、DTDのタイプ、文字コード、META要素など必要な基本情報は記述されている。
- (061)文書構造を無視した表示位置の絶対指定は避ける:5
- 表示位置の絶対指定はしていない。
見た目の情報構造とHTML上での情報構造が一致している。
- (062)文字情報は、できるだけサイズ固定や画像化しない:評価対象外
- 文字情報の画像化は使用されていない。
- (063)文字色と背景色のコントラストを十分にもたせる:5
- 背景は白地で文字は黒字なのでコントラストは最もよい。
モノクロ印刷をしても判読できている。
- (064)HTML文書で、情報の論理構造を適切にマークアップする:1
- 見出しではH要素ではなくtitle要素、段落ではP要素ではなくbr要素が用いられている。
見た目の表現指定はCSSで行われており、見出し箇所での画像使用はない。
- (065)色の識別がつかなくても、情報を理解できるようにする:評価対象外
- ページの中で文字色の変化がある部分はほとんど見られない。
- (066)特定の単語内にスペースや改行を入れない:4
- 単語内の改行は見られない。ただ、「授業紹介」のページにある表の中で、単語の途中で改行しているかのように表示されている箇所がある。
見にくいので分かりやすく表示した方がよい。
- (067)情報の識別に必要な記号や文字装飾タグを、単独で使用しない:2
- 「What's New?」の部分で、音声読み上げされないこともある図形文字が使用されているので改善すべき。
複雑なタグではではないが、文字装飾タグを利用する際意味を示すテキストが書かれていない。
W3Cが非推奨としている要素を知る必要はあるだろう。
- (068)機種依存文字、半角カタカナを使用しない:5
- 機種依存文字、半角カタカナ、略字、図形文字は使用されていない。
- (069)画像には、同じ役割を果たす代替テキストを提供する:4
- 画像には代替テキストが付けられているが、ホームの写真には付けられていないので記述した方がよい。
情報がなくても、空の代替テキストを付ける。
- (070)データテーブルでは見出しを識別し、データセルと関連付ける:2(「授業紹介」のページ)
- データテーブルの内容について解説するsummary属性がないので加えた方がよい。
"コミュニケーション学科 学科設置科目 授業内容2002年度版”という部分をCAPTION要素で表示すべきだろう。
- (071)レイアウトテーブルは、正しい順序で音声読み上げされるようにする:5
- TABLE要素が用いられているが、読み上げソフトの読み上順序と画面構造が一致しているのでよい。
- (072)フォームのラベルとコントロールを関連付ける:評価対象外
- 学科サイトでは使用されていない。また、大学のHPで、資料請求を一括して行っているので、敢えて用意する必要も感じない。
- (073)フレーム使用は最小限とし、使う際は必ずタイトルをつける:評価対象外
- フレームは一切使用されていない。
- (074)ナビゲーションの繰り返しをスキップできるようにする:1
- ナビゲーションをスキップできるように設定されていないので変える必要あり。
- (075)イメージマップは、クライアントサイトを使用する:評価対象外
- 学科サイトではイメージマップは使用されていない。
- (076)スクリプト、アプレット、プラグインには代替手段を提供する:1
- Top>卒業論文>卒業論文マニュアルのページで,Adobe Acrobat Readerへのリンクが用意されているが代替手段は提供されていない.
- (077)どうしてもアクセシブルにできない場合は、代替ページを用意する:評価対象外
- 学科サイトでは、代替ページを用意するような箇所はないのではないだろうか。
- (078)画面全体の明滅やコンテンツの点滅、移動は避ける:5
- 一切使用されていない
- (079)動画で視覚的にしか伝えていない情報には代替手段を用意する:評価対象外
- 動画は使用されていない。
- (080)音声だけで伝えている情報には代替手段を用意する:評価対象外
- 音声は使用されていない
- (081)モバイル、子供、外国人に配慮したコンテンツを提供する:3
- 学科サイトのターゲットユーザは、「子供」は含まれていないので、コンテンツそのものは問題はないと思うが、「留学生」を対象としたとき、
コンテンツが日本語のみでしか見れないのは問題かもしれな。(「東女に留学しようとしている」=「日本語がある程度読める」ことを前提として考えて
よいのだろうか)
平均点:3.4
「目次」に戻る
コンテンツ:表現の最適化
- (082)画像は、対象物の特徴や意味が伝わるようにする:2
- トップページの2枚の写真が何を意味しているのか説明がなく、結局無意味になっている。
教員紹介のページで各々の先生方の写真が載っているのは、有効だと思うので変える必要なない。
- (083)ダイアグラムなど、情報の視覚表現を積極的に使う:2
- トップ>MML>about MML では, 無意味なアニメーション(卵が割られる)が使用されている。そっちに気をとられてしまうので削除した方がいい。
またコミュニケーション学科の説明が、文章ではやや分かりにくくなっているので、そこで視覚的に工夫したらどうだろうか。
- (084)インタラクティブ性は、ユーザのタスク支援を目的とする:3
- 過剰なインタラクティブ性は見られないが、ナビゲーションの部分に工夫は必要。
- (085)自動的に再生されるスプラッシュムービーやBGMは控える:評価対象外
- そのような箇所は見当たらない
- (086)頻繁な更新によって、常に最新の情報を提供する:1
- 「What's New?」と「2004年度学年暦」では更新が見られるが、授業紹介では2002年度のままである。
- (087)コミュニティづくりを意識したコンテンツを用意する:1
- BBSなどを加えたユーザ参加型のサイトとは程遠い。このサイトの対象者のなかに「受験生」が入っているが、サイトで取りこぼしている点
について質問ができるようにしたらどうだろうか。但し、これを加えることで、こまめなチェックが必要となる。無理やりBBSを作ったところで
メインテナンスができないならばないほうが良い。管理者と要相談。
- (088)運営者の活動を積極的に知らせるコンテンツを用意する:3
- 86番でも述べたとおり、更新されている箇所とされていない箇所があるため「積極的」とは言い難い。テキストにはオンラインマガジンなどの
提案があるが、「学科」単位で発行するほどの内容はないのではないか。
- (089)逆ピラミッド型の文章構成でページを編集する:2
- もう少し文章そのものを短くまとめたほうがいいのではないか。(例:卒論について→1ページ以内にまとめる)
- (090)専門用語や外国語を使用せずにわかりやすい言葉を使う:4
- 対象者に「子供」(高校生以下)は含まれていないため、現在のレベルでは、ユーザにとって難解な表現などはないと思う。ただ、「ノスタルジア」や
「MML」については、初めてのユーザが見ると謎。
- (091)宣伝目的の誇張された表現よりも、客観的で説明調の表現を用いる:5
- 特に誇張表現などは見当たらない。
- (092)誤字、脱字、表記の不統一をなくす : 5
- 誤字、脱字もなく、表記も統一されている。
- (093)テキストのスタイルをシンプルに保つ : 5
- テキストのスタイルが、タイトル・見出し・本文・リンク程度に限定されておりシンプルで内容も把握しやすい。
- (094)コンテンツのカスタマイズなどで、ユーザーとの関係を強化する:2
- カスタマイズ機能は見られない。
- (095)目的達成に不可欠な情報は、早い段階で提示する:評価対象外
- 特に該当するものはない。
- (096)外部サイトへのリンクを、効果的に利用する: 4
- リンク集があるので、外部へのリンクは比較的簡単にできる。
- (097)故意にユーザーの予測を裏切るようなリンクを置かない: 4
- そのようなリンクはない。
- (098)広告ではないのに広告のように見えるリンクのデザインは避ける: 5
- 広告のように見えるデザインのものはない。
- (099)リンク切れや工事中のページをなくす: 1
- 「入学課のページ」は「自動的にジャンプします」と表示される。 他にもリンク切れのページが多い.
- (100)美しいグラフィックや文章で、サイトの品位と信頼性を高める : 4
- 特に問題はないが、全体的に見てシンプルなデザインになっている。
平均点:2.9
「目次」に戻る
チェック結果のまとめ
アイデンティティ,インフォメーションアーキテクチャ,インタラクション,アクセシビリティ,コンテンツの5分野とも1から5の評価が混在していた.
ユーザビリティ原則のチェック結果から,現学科サイトには,以下の問題点があることがわかった.
- トップページの写真がもっともよくない.肝心のコンテンツが写真に押しのけられてしまうし,写真の意味が不明.
- リンク切れが多い.
- メインテナンスされていないコンテンツがある.
- 情報が古すぎて実際と異なっている.
- トップページ右側のメニューがタスクを意識したメニューであることがわかりにくいので,左側のメニューとの差が見えず,利用者を混乱させている.
- グローバルナビゲーションに,学科サイトトップページへのリンクと,東京女子大学へのリンクがない.
- ナビゲーションが,全ページで同じ位置に配置されていない.
- ナビゲーションスキップがない.
- サイトマップがない.
- 検索機能がない.
- 運営者やサイトポリシーやヘルプを明記したページがない.
- 同じコンテンツが複数のページからリンクされているために,混乱を生じている.コンテンツの階層構造が整理されていない.
- コンテンツの一部にわかりにくい言葉(MML,ノスタルジア)がある.
- ページの横幅が固定されている.
- 閲覧中ページの上位層に移動できるする機能が不足.
- テキストリンクの下線が消されてしまっている場合がある.
- 自ページへのリンクが存在している.
- page not foundなどで表示されるエラーページがわかりにくい.
- 文書の構造が適切にマークアップされていない.
学科サイトリニューアルプロジェクトは,以上の問題点の解決を目指す.
「目次」に戻る
「学科サイト リニューアルプロジェクト」(作成中),
「渡辺研究室」