Webサイトデザインアドバイス

Advice

徳保隆夫の発言集41

私は方々のサイト批評掲示板でいろいろ書き飛ばしています。その一部を収録。新旧いろいろ入り混じっています。場所もいろいろ。

The Savior of round pink

[2002.09.25]

表示速度:

軽いサイトですね。装飾にほとんど画像を用いていないこと、極端に文章量の多いページがないことを考えれば、当然の、そして狙い通りの結果といえるでしょう。

視覚効果:

リニューアルによってデザインを統一されたページはまずまず読みやすく、すっきりとした印象でまとめられており、どうにか及第点といえるかもしれません。しかし小説のページはいただけませんね。色彩、レイアウトともに読みづらい箇所が少なくありません。

リニューアルを経験してよくおわかりになったことと思いますが、サイトのリニューアルは面倒なものです。今後サイトが発展すればするほど、リニューアルには苦労するようになります。簡単に気軽にリニューアル(そしてデザインの修正)ができるよう、CSSのお勉強をなさることをおすすめします。現段階で既にサイト全体のリニューアルが困難であるならば、今後はこのままではさらに苦しくなるはずです。

操作性:

フレームを使って楽をしよう、という意図がはまっておおよそ問題ありません。わずかに小説が読みづらいのが気になるくらいでしょうか。小説本文から目次に戻るリンクがなく、第1話から第2話へ進むリンクもないというわけで、まとめ読みするには不都合でした。

さて、リンクの下線を消しているわけですが、既読リンク色が画面の設定次第では(とくに液晶画面でしょうか)本文と非常に似た感じに見えて、少々気になります。私もつい「コンテンツ」をクリックしてしまいました。表紙に戻るリンクがないのも、混乱の原因になっていると思います。たしかにあまりコンテンツとしての価値がない表紙ですが、数多くの実験から、閲覧者は道に迷ったら表紙に戻ろうとすることが知られています。やはり表紙へのリンクは用意しておくのがよいでしょう。

ところでリンク集にバナー画像ありのサイトとなしのサイトが混じっていますが、私はこのような場合、バナー画像なしに統一します。その方が見た目もきれいで読み込みも速く、利用者にも使いやすいからです。

内容の充実:

創作系のコンテンツはなかなか充実させていくのが難しいことでしょう。今後も地道に、しかし気合いを入れて取り組まれるとよいと思います。ただ、サイト運営の基本は閲覧者、あるいはご近所サイトとのコミュニケーションとなっていくような気がします。そこをおろそかにしないことが長続きの秘訣となるでしょう。

関係ない話ですが、「荒らし行為は即効に抹殺します。なお、その場合ですが、通常のお客様には、影響のないように任務を遂行しますので安全に楽しんでいただけると思います。」ということであれば、あえてこうした荒らし行為を挑発するような文章は不要でしょう。私は荒らし対策には用意があるので、あえてサイト上では虚勢を張りません。いざというときに粛々と対応すればよいことだからです。ロッキー様もぜひご再考ください。

Rabbithole's HP

[2002.10.14]

JavaScriptの使い方

JSは結構敬遠されがちなようなんですが、デザイン上必要なところでしか使ってないのでとおっしゃいますが、これは逆ですね。必要なところで使われるから困るのです。どうでもいいところで使っているのなら、たんにJavaScriptを切ればいいわけです。けれども実際には、それなしじゃサイトを閲覧できないようにしているサイトが少なくない。だから私たちは嫌々でもJavaScriptONでサイトを見てまわらなければいけなくなってしまうのです。ですから、JavaScriptはなるべく、あってもなくてもいいような形で使ってほしいと思います。

シンプルでありながら操作性は高水準

すっきりとしていて、なおかつきれいにまとまって見えるデザインセンスは貴重ですね。Galleryのナビゲーションなど、ていねいなつくり込みにも好感を抱きました。また、フレームなしでも閲覧できる操作性の確保は、なかなか実現できる人がいないことなので、正直驚かされました。単に何もないだけの低質なシンプルデザインとはレベルが違いますね。リニューアルは成功だったと思います。

今後もぜひ楽しく頑張っていってください。

サイトの純化にどこまでこだわるべきか

ところで異ジャンルのコンテンツをおくかどうか、というお話ですが、私は置いていいんじゃないかと思います。ようするに広く浅くならなければよいわけです。もちろん異常に広ければウリにもなりますが、たいていは狭く浅くで終わってしまうんですよね。だからそれだけは気をつけて、新コンテンツが充実するまではあくまでも新コンテンツはサブということにすればよいでしょう。個人サイトですから、あまりサイトを分けるというのはおすすめしません。宣伝の手間も2倍になりますし、全般に面倒が増えます。

私のサイトも全然違うジャンルをセットにしていますが、別段それで困ることはありません。それぞれに閲覧者がたくさんいます。せいぜい数百ヒットまでのサイトなら、何でもありの個人サイトスタイルというのは、大した問題じゃないと思いますよ。何かメインがあればどうにかなるものです。

Lazy Style

[2002.10.18]

CSS未対応ブラウザへの対処は不要

CSS未対応のブラウザなんてのは問題にならないはずなんです。というのはつまり、HTML文書はそもそも、CSSなしでもブラウザのデフォルトスタイルでちゃんと表示されるものだからです。CSSはHTML文書の見た目を制御するものですが、使用の前提としてもとのHTML文書がちゃんとしたものである必要があります。

私のサイトではCSSを外した場合のデザインも選択できるようにしてあるのですが、CSS未対応環境でも全然問題なく文章は読めるようになっています。

HTML文書はパソコンでも携帯電話でも読めます。画面なしの音声読み上げ式のブラウザでも、あるいは検索ロボットにも解釈できます。これだけ多くの環境に対応するために、HTML文書は「内容と見た目を分離する」という発想に基づいて仕様が作られています。

HTML文書には見出し、段落、箇条書きといった文書の論理構造だけを書き、見た目は各環境におけるHTML文書表示ソフトが決めます。「製作者はHTML文書の見た目を決めたりしない」のが本来のシステムなのです。

現在は「たまたま」パソコン+IEなどの視覚系ブラウザという環境でHTML文書を見る人がほとんどなので、その環境向けに特定の見た目を用意したいと考える人が多くなっています。しかしこれは困ったことです。特定の環境のことしか考えずに作られたHTML文書は、他の環境ではまともに読んだり、利用したりできないことが非常に多いのです。

まずは環境に依存しないHTML文書を書く努力をするべきです。そうすれば、どんな環境(新旧のブラウザ、パソコン、携帯電話、……)でも文書の内容は読めるはずです。

その上で、もしパソコン+視覚系ブラウザなど、特定の環境向けにあるデザインを指定したい場合にCSSを使えばよいわけです。CSS対応ブラウザならCSSの指定通りに表示されますし、未対応ブラウザならCSSなしの見た目で表示されますが、もとのHTML文書がちゃんと作られているならば、いずれの場合も本質的な違いはありません。

註:CSSというと、よくNN4が問題視されます。このブラウザはCSSを間違って解釈するためです。CSSは本来「未対応/無視される場合には問題とならない」ものですが、間違って解釈されると深刻な問題と引き起こす場合があります。したがって、NN4にはCSSを読み込ませないようにする工夫が必要とされます。

ただしじつはこれは簡単なことです。あらゆる環境におけるHTML文書の見た目を制御するCSSなど書きようがないので、CSSは環境ごとに書き分ける必要があります。印刷の場合はこのCSS、パソコンとテレビではこのCSS、携帯電話ではこのCSS、といった具合です。NN4はこのCSSの書き分けにほとんど対応していないので、ちゃんと「このCSSはパソコンとテレビインターネット用ですよ」という指定をすれば、NN4はこのCSSに対応できず、無視してくれます。

Link Net Work

URI:http://homepage2.nifty.com/linknetwork/ [2002.10.19]

どこまで軽くすればよいか

重さが気になるのであれば、ファイルサイズを調べればよいわけです。画像とHTML文書、音楽ファイルなどの合計が50KB未満なら、よく頑張っていますね、というところ。100KB未満なら、まあ許せるんじゃないですか。Linkさんのサイトの表紙は121KBほどあるようですから、少し重いかもしれませんね。

100KB未満なら、サーバの状況や環境の相性など、通信の問題がかなり重さに影響してきます。努力しても成果が現れにくくなってきます。50KB未満ですと明らかに通信の影響が大きく出て、ファイルサイズと重さが比例しません。100KB以上では逆に、重さに占める通信の影響は相対的に小さくなってくるので、読み込み速度とファイルサイズが比例してきます。

努力できるところまで努力しておくことをおすすめします。50KB未満はともかく、100KB未満は達成しておくべきです。最低限そこまでやっておけば、「重い」といわれてもサーバのせいにすることが不可能ではありません。画像に気をつけていれば、100KBというのは案外余裕があります。目標をしっかり定めれば、すぐにでも実現可能だろうと思います。

ぼーじむ

[2002.10.19]

フレームとアクセス数

フレームなし版を作ったらアクセス数は増えるでしょうか。答えはNOです。まず、閲覧者の99%はフレームに対応したブラウザを利用しています。フレーム未対応環境に対しては、適切な内容をもつnoframes要素を準備すれば閲覧に支障ありません。フレームなし専用のページを用意するなどという手間はまったく無用です。こうしてみると、現状、フレームの使用とアクセス数の関係に最も大きな影響をもつ要素は、フレームが好きか嫌いか、ということなのでしょう。

とはいうものの、アクセス数を決定的に左右するのはサイトの内容です。内容に関心があるにもかかわらず、フレームを使ったデザインゆえに訪問を避ける、という人がどれほどいるというのでしょうか。事実上、無視して構わない人数といえます。そのようなことを気にするなら、サイトの内容の充実に努めるほうがずっと有益です。noframes要素さえ適切に記述されていれば、フレームは使ってよいのです。これはもう、断言できます。

フレームの使い方に上手下手はあります。そのあたりはいろいろお勉強していただくとして、フレームの使用自体を悩む必要はありません。(註:現状はnoframes要素の内容が悲惨なので、どうにかしてほしいです)

軽さは追求するべきだが……

重さについて心配されているようですが……軽いということはないけれども、ファイルの大きさを見る限りはよく注意されているのではないかと感じました。HTMLとCSSにもう少し詳しくなれば、ファイルサイズというレベルでは、より軽くすることも簡単です。けれどもファイルサイズをこれ以上減らしても、それほど体感速度は向上しないのではないでしょうか。フレームをもっと単純化すれば、やはり多少の改善が望まれますが、重い時間帯と軽い時間帯の差ほどにも変化は生じないことでしょう。ある程度の段階に達すると、努力の割に成果が現れないのが軽さ追求の悲しいところです。

配色について

最後に色使いですが、力強い原色の取り合わせという難しいところを狙いながら、なかなか成功しているのではないかと思いました。