|
|
|
|
|
| 当メルマガでは、今までホームページの作成や公開の基礎的なことを取り上げてきましたが、グラフィック中心のメルマガですので、しばらくホームページのデザイン、レイアウトはどうあるべきか、どういうページデザインが効果的かということを考えていきたいと思います。
いろいろなホームページを見て歩くのが、一番勉強にはなるのですが、最悪なのは重すぎるページです。今、ISDNやADSL、ケーブルテレビや光ケーブルなど、ブロードバンド環境を整えている人も多いから大丈夫、という考え方もあるかもしれませんが、どんなに回線がよくなっても、本のページをめくることから比べれば時間はかかります。転送が早くなった分、ページの表示も早くならなければ、人は不満を感じるものです。 また、常に自宅の高速回線を利用できるとは限りません。外で携帯端末などを使って接続することもあるわけです。無駄な画像などは、なければ無いに越したことはないのです。 次に大切なのは読み易い、見やすいページですね。普通に文字を並べると、文字はページの左上に表示されます。これを自在にコントロールするためには、テーブル（表）の使い方が大切です。枠線の太さを０にしたり、列や行で結合したりすることで、ホームページらしいレイアウトが実現できます。また、テーブルやその内部のセルや行の色指定をしていくことで、画像をあまり使わなくても、カラフルできれいなページデザインを作ることができます。 それから、プラグインやブラウザによって表示できないかもしれない、という様な凝りすぎたページも慎重に考えなければならないでしょう。特にデザインを売りにしているようなウェブデザイナーに作ってもらうと、完璧に表示されれば、素晴らしいデザインながら、その様に見ることができない人が多い、なんていうページになる可能性があります。 請け負いでホームページを作成してもらう場合、そのホームページのアクセス数やビジネス的な効果より、作成者の技術の見本みたいなページを作られてしまう恐れがあるかもしれません。（もちろん、売り上げアップのためにいろいろ工夫したページを作ってくれる良心的なデザイナーが沢山いることは当然ですが） 例えば、トップページからフラッシュサイトというのは、内心どうなのかなあ？と思います。新しいパソコンだと、初めからショックウェイブプラグインがインストールされている場合もあるでしょうが、フラッシュのプラグインは基本的に自分でダウンロードしてインストールするものです。トップページからフラッシュで、トップページに×印のついた長方形が表示されるというのは、ちょっと考えものです。 ロード中（読込み中）ということで長時間待たされるのも正直いやです。長時間待ってやっと出て来た動画が、無意味なフライングロゴ、という経験を何度かするうちに、初めから飛ばすようになってしまいます。 フラッシュの使い方については、また後でゆっくり述べるとして、ホームページを見るのは人間だけではない、ということも考えた方がいいかもしれません。つまり、機械は絵を理解できない、ということなんですが、これは検索してもらうためには重要なことです。 いろいろなアクセスアップ方法というのが、あちこちで説明されていますが、それ以前の問題として、何もしなくても閲覧者が検索エンジンで探して見に来てくれる、というのが理想です。検索して来てくれる人は本当にそのホームページの情報を求めている人です。こういう人は商用ページなら顧客に、情報提供ページなら、最も喜んでくれる閲覧者に、そしてコミュニケーションページなら積極的な常連さんになってくれる可能性が高いわけです。 ホームページを作る際には、いろいろな目的があるはずです。もちろん、作るという事自体が、これからの社会を生きていく上で大きな武器を身につけるための勉強と考えてもいいのですが、それでも、それなりの目的を明確にして工夫していかないと、無駄な努力になってしまいます。 次回から、上に述べたようなことを一つづつ考えていきます。 |
渡辺 保史 (著) 平凡社 (2001/07) 形のない「情報」を「デザイン」するとはどういうことか？ウェブサイト構築のノウハウ？ それだけではない。「情報デザイン」とは、ものと人、人と人との新しい関係を作ることだ。
SEOを超えたホームページ集客術 ~プロが教えるSEM(検索エンジンマーケティング)の実践テクニック96 細木 康裕 (著) アスキー (2003/12/02) お金をかけずに自分のサイトにお客さんを誘導するとっておきの方法「SEO&SEM」。豊富な実例で、具体的テクニック、実践的使いこなしをわかりやすく解説。これぞアクセスアップ本の決定版！ |
| 【補足05.9.30】
まあ、今どきのウェブデザイナーは、SE0（Search Engine Optimization)までやらなければ、お金取れないから、上で書いたようなサイト作成をする業者はいないとは思いますけどね（笑）。例え、遊びのサイトでも多少は友だちがアクセスして見てくれないと、作る方も飽きてしまいますから、そういう点で工夫するのはたいせつなことだと思います。 |
| インターネットは私たちにとって新しいメディアです。ですから、ホームページのレイアウトも全く新しい考えた方をする必要があります。ギャラリーページのレイアウトを、カタログなどの延長と考えることは失敗の原因となります。
特にデザイン、レイアウトに係わってきた人でなくても、私たちは長いこと縦長の紙に慣れ親しんできました。ホームページは横長のモニタで見るもの、という事を新ためて認識する必要があるかもしれません。 また、同じモニタでもテレビとも違います。テレビは黙って座っていれば、時間軸に沿って、どんどん変化していきますが、ホームページは閲覧者の意志によって移動するものです。 さて、ホームページを見て歩いていると、今でも四角い画像表示予定の枠がずーっと下の方まで並んでいるページに出会うことがあります。出版形式のカタログでも１ページに並べる画像の数はそんなに多くはないはずです。「スクロール」という機能と「ページをめくる」という作業が多少似た雰囲気があるため、つい下へ増やしてしまうのかもしれませんね。 そこで、ひとつの提案です。それは、「できるだけ、スクロールしないで表示することができるページデザインをめざそう！」というものです。 多少大きな画像でも、１枚づつならそれほど問題なく表示できます。また、スクロール無しか、あっても画面の２倍程度までなら、閲覧者の視線の流れを計算して効果的なデザインを考えることもできます。 次に、文字と画像の量のバランスです。高速回線でなければ、まず最初に文字が表示され、後から少しづつ画像が表示されます。そのとき、適度に文章があればそれを読んでいる間に画像が表示され、閲覧者に「画像の表示を待った」と意識させないで済みます。 しかし、だからといって文字ばかりのページというのも、辛いものがあります。モニタ上の文字は紙に印刷されたものに比べて、読むのが疲れるものです。使い慣れてしまうと、気にならないかもしれませんが、そういう人ばかりとは限りませんし、印刷したものに比べて解像度も低いのですから、新聞のようなわけにはいきません。 そうでなくても、現代人に文字だけが並んだものを読んでもらうのは、難しいので、適度に絵や画像を配置する必要もあります。 この画像の大きさと数と役割が問題です。先週も書きましたが、ホームページに無駄な画像は置きたくありません。ですから、今配置しようとしている画像がどういう役割を担って、そこに置かれるのか認識すべきです。 ホームページ上に置かれる画像は、役割から考えて次のようにに分けられます。
１と２は兼用できる場合がありますね。特に私たちは四角や円などの、はっきりした形の輪郭で囲まれた画像をボタンやバナーと認識しやすいので、逆にそういう画像にリンクがついていないと、がっかりしたりします。ですから、雰囲気を出すための画像は、周囲をぼかしたり、切り抜きをしたりして「クリックできない」と主張させることも必要かもしれません。 どの画像も必要以上に大きくならないようにします。画像はそんなに大きくしなくても、十分閲覧者の目に飛び込んでくれます。つい大きくしがちなのが、４のコンテンツとしての画像ですが、ホームページは従来のメディアに比べてはるかに閲覧者優位のメディアです。全部見て欲しい、大きい画像で見て欲しい、と制作者が思えば思うほど、閲覧者は逃げていく、と考えた方が正解だと思います。 最初に書いた、ずーっとスクロールするほど画像が並んでいるページ、というのは、「１回のクリックで全てを見て欲しい」という制作者の願いの現れですが、なにごとも欲張りは失敗のもと。ホームページほど閲覧者の立場に立って考えなければならないメディアはないと考えるべきでしょう。 同様に文字にも機能があるのがホームページです。例えば、私たちは青い文字や下線付きの文字を見るとリンクがついている、と思いやすいものです。そういうものが多いので慣れてしまっているのですね。逆に言えばクリックできない文字が青かったり下線がついていたりするとがっかりします。 「がっかりさせてはいけないのか？」と聞かれそうですが、スムーズなコミュニケーションは、お互いの了解事項、共通認識のもとに行われるものです。ですから、できればがっかりさせない、期待を裏切らない方が気持ち良く、そのサイトに対する印象も良くなるのです。 **本日のポイント** 次回はテーブル（表）の効果についてです。 |
Basic of Web Design―誰も教えてくれなかったWebデザインの基本 加藤 才智 (著) 毎日コミュニケーションズ (2002/11) あなたのWebデザインはこの「基本」を押さえていますか? 「使える」素材の撮り方作り方、カラーを扱うための基礎知識、レイアウトの要フォントの基本など、知ってる人は知っているWebデザインの「原則」を紹介する。 目次
小笠原 たけし (著) ソフトバンクパブリッシング (2003/09) 企画から制作、公開後までの重要なチェックポイントとノウハウを制作の流れに沿って解説。これからウェブ制作に携わろうとしている人はこれが最低ラインの知識です。 目次 |
| 【補足05.9.30】
確かに高速回線になって表示は早くなりましたが、それでも１ページに大量の画像が並んでいると、多少は待つことになります。まして、それらがテーブルに入っていたりすると、そのテーブル内のデータがすべて転送されてくるまで、何も表示されないので、いくら待っても真っ白なまま、というページを今でも見ることができます。そのうえ、１枚のページにアクセスする度に、そのページに表示される画像がすべて読み込まれることになり、これは、転送量という意味でもサーバー管理者泣かせのページになります。この手のページは、制作者の横着としかいいようがないので、注意してくださいネ。 |
