メニューまで移動する

とりココBlog - 福島県郡山市のITブログ

超サイヤ人2.0になる前のWebデザイン

2005年10月16日

超サイヤ人2.0になる前のWebデザイン

Web 2.0が声高に叫ばれる時代だが、もっと基本的なWebデザインもまた重要だ。そこで、ちょうど「ウェブ・デザインの間違いトップ10」というページを見かけたので、自分のサイトを照らし合わせつつ、考えてみたい。

#関係ないけど、なんで「Web2」とか「NextWeb」じゃなくて「Web 2.0」なんだろう

1. 読みやすさに関する問題

フォントサイズ (△)

Web情報の大部分である文字情報。その可読性はユーザービリティの最も基本となるものだ。

誤解が多いが基準となるフォントサイズはユーザーが決めているものであって、フォントサイズ・デザインは(情報の重要度に対する)相対比でなければならない。よほどの理由がない限り固定フォントサイズは使うべきでない。

余談だが、Firefoxなどの先進的なブラウザでは固定フォントのサイズ変更が可能だったり、最小フォントサイズを指定できる。

#とかいいつつ、このサイトの基本サイズは1emの90%…

行間サイズ (○)

ブラウザが基準にしている行間サイズは、アルファベット・フォントに最適化されているため、日本語フォントには狭い。だいたい1.2〜1.8倍のサイズを指定するとより読みやすくなるようだ。

2. 非標準的なリンク

クリックできる部分はどこなのかを明確に示す (○)

デザインによるが、特に理由がない限り《青色+下線》がいいと思う。

訪問済みのリンクと訪問していないリンクを区別する (×)

これも特に理由がない限り《紫+下線》が望ましい。少しダサくなるのでためらいはあるが…

リンクの先に何があるかを前もってユーザに知らせること (△)

これは当たり前のことなのだが、実際にやってみると、どこまでの情報を載せていいものか難しいところがある。最低限のルールとして「リンクはこちら」のような使い方をやらない、URLテキストにはリンクを貼る程度の心がけはある。

ユーザがリンクを行き来するときの標準的なインタラクションを受け付けなくするJavaScriptに代表されるテクニックは使わないようにする (△)

できるだけ使うべきでない。しかし使わなければならない場合も少なからずあるので、最近書いたコラム「SEO的window.open()の使い方」を参照のこと。

リンク先のページを新しいウィンドウで開かないようにすること (×)

これはとても難しい問題。本来ならユーザーが決めるべき事柄だが、自分が「新しいウィンドウ」で開けることを知らないユーザーがまだまだ多いのも事実。基本的に外部リンクには_blank属性をつけるようにしている。

3. Flash

使ってもいないし、あまり好きではないが、まんざら否定派でもない。au by KDDIのサイトのような使い方や、プレゼンテーション・ツールとしての使い方がベストだと思う。サイト全体をオールFlash化するのはコストパフォーマンスが悪くなるため、よほどの大手でない限り現実的でないと思う。

4. ウェブページ向けに書かれていないコンテンツ

理解はしているつもりだが、なにぶん文才がないので…

「流し見」できるように見出しをこまめにつけたり、できるだけ簡潔な文章は心がけているつもり。

5. 検索性能の低さ

livedoorBlogのブログ検索は動作が不安定だったりするので、いろいろと試行錯誤した結果、Googleに落ち着いている。

6. ブラウザ間の非互換性

IE、Firefox、Operaでは動作確認しているが、Macのブラウザでは少し表示が乱れる恐れがある。閲覧自体に支障がでるものではないはず。

7. 扱いにくいフォーム

このサイトではユーザーフォームを特に使っていないし、言いたいこともほとんどリンク先に書かれてある。ちょっと一口には語れない問題なので、いずれそのうち。「お願いだ。"label"をくれ」も参照のこと。

#「お問い合わせフォーム」ぐらい作っておかないとな…

8. 問合せ方法や企業情報の未掲載

最大限、掲載しているつもり。このブログの中では少し地を出し過ぎている感はあるが…でも友人からはよく「いい人振りやがって!」とご指摘を受ける。

9. ページの幅を固定したレイアウト

リキッドデザインも好きなんだが、動作確認作業が大変なのでなかなか踏み切れず。ヘタするとスカスカなデザインになったり。

10. 不適切な画像の拡大

大きい画像のソースがある場合は、できるだけ提供するようにしている。サイズは640x480を基準にしているが、これからは800x600ぐらいあってもいいかも。

あとがき

Webはコミュニケーションツールでもあるのだが、その特性上、ユーザーからの意見が直接伝わりにくい面がある。これを補っていくためには、常にアクセシビリティ・デザインを意識し、アクセス解析やユーザーフィードバックを進めていくことが、Web 2.0時代にもまた重要であるはずだ。

関連記事

スポンサードリンク

コメントとトラックバックを読む

この記事へのコメント

こんにちわ。

2005年 ウェブ・デザインの間違いトップ10、これ分かりやすいですね。

>関係ないけど、なんで「Web2」とか「NextWeb」じゃなくて「Web 2.0」なんだろう

私もかなり思いました(w
「NextWeb」ってなんかかっこいいですね。でもその次のwebの名称付けに困るか・・・。
Redさんによる [2005年10月16日 10:29] の投稿。No.1
>>1
>>Redさま

> 2005年 ウェブ・デザインの間違いトップ10、これ分かりやすいですね。

本当は具体例を挙げてチェックしようと思ったんですけど、サンプルを用意しないといけなかったりで概論のみになってしまいました。
そのうちユニバーサル・デザインの特集記事みたいなものもやってみたいですね。

> 「NextWeb」ってなんかかっこいいですね。でもその次のwebの名称付けに困るか・・・。

「ウェブ リローデッド」→「ウェブ レボリューションズ」のがよかったですかね(笑)
とりココさんによる [2005年10月16日 19:29] の投稿。No.2
>「ウェブ リローデッド」→「ウェブ レボリューションズ」のがよかったですかね(笑)

あぁ、それもかっこいいですね(w
つーか、そっちの方が流れてるっていうのが分かりやすいかも。
しかしながら映画見てない人にはますます謎は深まりますなぁ。ははは。
Redさんによる [2005年10月16日 21:23] の投稿。No.3

コメントまたはトラックバックを投稿する

コメントを投稿する





トラックバックを送信する

この記事へのトラックバックURL:
http://trackback.blogsys.jp/livedoor/disctop/50148401

メニューとコンテンツ