目指せ、Webデザイナー！

メッセージ性の研究２ 文字について（情報を伝える効果について）

メッセージ性の研究２　文字について（情報を伝える効果について）

文字には２種類の使い方があると考える。
いや、むしろ「使い方」と言うよりは「効果」と言ったほうが良いかもしれない。

まず１つ目の効果は、「情報を伝える」というごく当たり前の効果だ。
小説、日記、説明文…ただ記号を羅列するのではなく、何らかの意味を持った集合体と言うことだ。

もう１つは「イメージを伝える」と言う効果だ。いわゆるタイポグラフィのことだ。
「文字」というより「画像」という感じの使い方だ。
今回は「情報を伝える」効果についてみていこうと思う。

「情報をつたえる」について

効率よく情報を伝えるには、どうすればよいのだろうか？
まずはそれについて考えてみようと思う。

まず、「わかりやすい文章」であることは前提条件だ。
しかし「わかりにくい文章」を書きたがる人はいない。何ゆえに「わかりにくく」なってしまうのだろうか？

プレゼンを勉強したときに、文章表現についても勉強をした。
わかりやすい文章のコツは次のようになる。

・簡潔な表現
・短文主義
・「の」や「が」を１つの文章に多用しない
・文体の統一
・単調になり過ぎない

まぁ、そんなに難しいことではない。だいたい優先すべき者から順に並べてみた。
どれも、少し気をつければ十分なことだ。

簡潔な表現

まず簡潔な表現についてみていこう。
一言で言えば「変に難しい言い回しをしない」ということだ。

とても簡単なことだ。ビジネス文書の逆にすればよいのだ。
無駄な装飾を入れない。これだけでもずいぶんと変わるものだ。
「中学生でもわかるだろう」と思えるような文章を心がけること。

短文主義

日本語は句読点を打っていればダラダラと続けることが出来るし、文法的にもおかしなことではないので知らず知らずに誰もがやっていることでもあり、「別に簡潔な表現をすれば読みやすいんでしょ？」と思うこともあるかもしれないが、それは間違いなのだ。

上の文章を１度読んだだけで、完璧に内容を把握すことが出来るだろうか？
おそらく、「結局は何が言いたいの？」と感じるはずだ。
続けられるからと言ってダラダラと続ける必要は無いのだ。

日本語で会話の場合、１文６０字が限度だそうだ。
それ以上だと、最後まで理解できないのだ。
文章ならもう少し多くなるだろうが、それでも６０字を目安にしたほうが良い。
短い（理解しやすい）に越したことは無いからだ。

「の」や「が」を１つの文章に多用しない

Wordなどでチェックされたことは無いだろうか？
実際に、「の」や「が」を用いることでもダラダラと続けられる。
だからといって、わかりやすいと言えるだろうか？

ちょうど良い例がある。
ＪＴのコマーシャルだ。
「○○の○○さんが、○○で○○しているとき…」そうやってダラダラと続いていく、あのコマーシャルだ。
「わかりにくい文章」の良い例である。

文体の統一

語尾が「です・ます」調か「だ・である」調かということを統一しろ、と言うことだ。
（…私の書いている文章でところどころ違うのは、打っている日にちと気分が違い、直すのが面倒だからだ。ミスじゃあない）

少し話は変わるが、「話し言葉」で書いている人がいる。
使い方によっては効果的かもしれないが、多くはわかりにくいだけだ。
理由は次のようになる。
「話し言葉の場合、普通は内容を整理していないために乱雑になる」

文体がころころ変わっては、読んでいる人にとって負担になる。

単調になり過ぎない

さきほど「簡潔な表現」といったが、装飾を省きすぎてもいけないのである。
多少の変化をもたせないと、読者は飽きてしまうのだ。

ここはさじ加減の難しいところでもある。
変化を大きくしすぎると読者にとって負担になるし、変化が（わからないぐらいに）小さすぎると単調になって飽きてしまうのだ。

まとめ

情報を効率よく伝えるには、わかりやすい文章を書けばよいのだ。
そして、わかりやすい文章とは「読者に負担をかけない文章」ということなのである。

普通の人が使わない表現は避け、文章を適度なところで区切り、ＪＴのコマーシャルみたいにはしないで、文体を統一し、文章に（多少の）変化をつけるのだ。
と、これじゃあわかりにくいだろう。

しかし、このように箇条書きすればわかりやすい。
・普通の人が使わない表現は避ける
・文章は適度なところで区切る
・ＪＴのコマーシャルみたいな文章にしない
・文体を統一する
・文章に（多少の）変化をつける

箇条書きなどもうまく使う。複雑なものは図解する。そういった工夫も必要だ。
こういっては身も蓋も無いが、何も表現は文章だけではないのだ。
文章だけに凝り固まらないで、柔軟な表現が必要だ。

メッセージ性の研究１ Webを構成する要素

メッセージ性の研究１　Webを構成する要素

まず、メッセージ性を考える前に「Web（サイト）とは何で構成されているのか」から考える必要がある。

Webを構成する要素

まずは、何と言っても「文章（テキスト）」でしょう。
ハイパーなテキストをマークアップするランゲージなのですからね。

次に「画像」。
今日日、画像を表示できないブラウザを使っている人なんていないですしね。携帯電話の古い機種を使っている人ぐらいですか？

…基本はこの程度ですか？
この２つさえあれば、とりあえず作れると言うことですか？

あと、プラグインなどが必要になるものもいくつか…
まず「Flash」です。
インターネットをしている人の（バージョンにもよるけど）実に９割９部近くがこれをインストールしています。まさに、デファクトスタンダードですね（あれ？　タダでも「市場」って呼べるの？）。

他には「動画」ですね。
世界中の人が、全部ＦＴＴＨなら上の基本にはいるかもしれませんが、まだ現在は…
…でも動画って、デザインに関係する…？

あとは、CGIなんかのプログラムですか？
でもこれも、直接はデザインに関係しないような…

まとめ

改めて考えてみると、とてもシンプルです。
どんな凝ったWebページでも、基本のテキストと画像、その他の動画などの要素で出来ているはずです。

素人が作ろうと、プロが作ろうと使っている要素はそう変わらないはずです。
確かに、写真やプログラムのクオリティ等は違うかもしれません。しかし、違いはそれだけでしょうか？

肝心なのは、「どう扱うか」なのではないでしょうか？
同じ素材を与えられても、プロのほうが良い物を作れるはずです。

良い素材を用意する（作る・見つける）、素材を生かして上手に魅せる。
なんだか、寿司屋みたいですね。

デザインについて考える２

デザインについて考える２

つい、先日とあるウェブ（ゲーム？）製作会社に行ってきました。

面接官の、最初の一言が「いやぁ、実力不足だねぇ」です。
………ゲハァ！

== 何が足りなかったのか？ ===
はっきりいって、HTMLとCSSの扱いに関しては、私のほうが上です。
その会社は、テーブルでレイアウトをしていて、（ごく一部の）フォントの設定ぐらいにしかCSSを使っていません。

「CSSって、デメリットもあるからねぇ」
ブラウザによる対応の違いですか？　そのための「ハック」ではないのですか？
フォントタグで設定をしていくよりも、よほどスマートだと思うのですが………

とまぁ、「作るだけ」なら私のほうが上でしょう。
問題は「何故に実力不足か」という点です。

結論としては、「メッセージ性・訴えかける力」が不足していたからだと思います。

実際のところ

別に、テーブルでデザインしようが、CSSを使おうがソフトを使って作っていれば関係ないでしょう。
ブラウザで見るだけなら、ウェブ標準化なんてものも関係ありません。
閲覧者が見るのは、サイトのソースではないのですから。

だから、実際にはどうやって作ろうが、何を使って作ろうが関係ないわけです。
問題は内容、見栄えなのです。見栄えさえよければたいした問題はありません。

勘違い

別に、フレームを使おうが良いです。
フレームみたいに、「文書の構造化」に役立たないものであっても、見栄えが良くなればよいのです。

きちんとした文法で、非推奨のタグを使わないで………そんな風に作らなくても良いのです。
もちろん、「正しい文法で書く」「非推奨のタグは使わない」に越したことはありません。
しかし「文法チェックでもパーフェクトだ！」といって、悦に浸ってよいわけではありません。

ようは、「効率よく作れて」「効果的に見（魅）せる」ことができればよいのです。
見栄えの効果を減らしてまで、きちんした文法で作る必要はないのです。

QCとVE

というわけで、私はQC的な発想だったわけです。
これに気づいたおかげで、もっと自由な発想ができるようにあったのです。

つまり、「きちんとした効果が出せればそれでよい」ということ。
「新しい技術を使った」「規格に則った文法で作った」　それだけでは意味がありません。
問題は、「何を使って作ったか？」ではなく「きちんと伝わるか？」「効果的か？」なのです。

とはいえ

だからといって、テーブルデザインを推奨するわけではありません。
ソフトで作るのならともかく、メモ帳などで作るとわかりにくいだけです。

フォントタグを使う気にも慣れません。ソースがごちゃごちゃします。
これも、ソフトなら関係ないですけど………

きちんと作ったことによるメリットは、バカにできるものではありません。

まとめ（実際のところ）

話はかなりそれましたが、そういうことです。
「正しく作ろうと、きちんと伝わらなければ意味がない」

ちょっと、バカみたいな観念にとらわれていました。
もうちょっと気づくのが遅ければ、「ただのオタク」になるところでした。
私が目指しているのは、「ただの技術屋」でも「ただのデザイナ」でもないのです。

メッセージ性

プロのデザインにあって、私のデザインにないもの。

私の作った物の方が、（印刷屋あがりの）ウェブデザイナーよりもすっきりとしたソースです。
でも、閲覧者が見るのは「ソース」ではないのです。

私のサイトを（自分で）見ても、特にメッセージが伝わってきません。
（趣味のものだから仕方がないかも知れないけれど）これは致命的です。

デザインは、「実用性」だけでなく「メッセージ性」も必要なのです。
しかも、「芸術」とは違うメッセージです。

クライアントの「考え」「思い」だけでなく、金銭にかかわるメッセージも伝えねばならないのです。
元が取れなければ、「デザイン」の価値はないのです。

企業の場合「広告」のためのウェブサイトです。
商品、ブランド、企業イメージ…目的はたくさんありますが、「伝えるため」ということは同じです。
そのためには「メッセージ性」が必要なのです。
メッセージ性のないサイトに、企業は金を払ってはくれません。

これからは

メッセージ性をきちんと持っているサイトを作ろうと思います。
ですので、「メッセージ性を持たせるにはどうすればよいか」みたいなことを考えていこうと思います。

文字化けの原因と回避方法

文字化けの原因と回避方法

テキストより引用〜

Webの文字化けには、必ず原因があります。文字化けの仕組みを知って対策方法を身につけましょう。

Webでは、リロードすれば大抵直り、CGIやデータベースを使用しているサイトでは、なかなか直らないそうです。

文字化けの多くは、文字コードを変換し損ねた場合に起こります。

文字コード

HTMLでは、HEAD内にMETAタグで宣言をして文字コードを指定します。
ここで文字コードの指定をしなかった場合、TITLEの部分の日本語が文字化けすることもあります。

日本語の文字コードは、シフトJISのほかに、JISやEUC(Cxtensive Unix Code)等があります。

JISコードは、インターネットメールなどに使われます。
シフトJISは、Windows98やMac OS 9等のパソコンで使用されています。
EUCは略語の通り、Unixの日本語環境で使用されます。

インターネットで使用される文字コードは、IANA(Internet Assigned Numbers Authority)という団体が管理をしています。
ここで登録されていない文字コードは使用しないほうが良いでしょう。

外国語Webページを作るときに

「日本語のWebページ作成時には、シフトJISをしておくと良い」と有ります。
JISだろうが、EUCだろうが、勝手に判断してくれますので問題はありません。

問題なのは外国語のページを作成するときです。
この際は、きちんとMETAタグで宣言をする必要があります。
これを忘れると、海外のユーザに文字化けのページを公開（後悔？）することになります。

理由は簡単です。
（英語などの場合）全角文字に対応していないからです。
もし、全角の文字やスペースが残ったままになっていると対応していないブラウザでは文字化けして表示されてしまいます。

英語のページを作る際には、Latin-1(ISO-8859-1)を指定して、欧文フォント表示のチェックをしておきましょう。

機種依存文字

例え同じ文字コードを使っていようと、文字化けすることがあります。
原因は、「製作者が使っている機種にしか入っていない文字」を使っているからです。つまり、「機種依存文字」と言うことです。

例としてあげると、丸数字（数字を丸で囲んだもの）や、ローマ数字です。
Web上でも結構使うことがあるので、注意が必要です。

半角カタカナ

携帯電話のメールでは良く使われる半角カタカナ。使うのは、ケータイだけにしましょう。
JISコードには半角カタカナがありません。文字化けになります。
また、ソフトによっては検索できなかったり、禁則処理が適用されなかったりします。

HTML4.01で記述すれば、半角カタカナを使用しても特にトラブルはないそうです。
でも、それだけきっちりと書ける人がそんなものを使うかと考えると………

「美乳」と「雀の往来」

データベースやCGIを使う場合にはEUCで書いたほうがベターです。
なぜなら、シフトJISの場合はエスケープ・シーケンスが入ってしまうからです。

EUCのHTMLファイルで、文字化けを防ぐのに良い方法があります。
HEADの中（の上部）に、<!--美乳-->や、<!--雀の往来-->と書いておくだけです。

「冗談でしょ？」と思った貴方。ウソではありません。
テキストによれば、

「これらの文字はEUC独自の文字コード範囲が割り当てられているため、この文字が記述してあれば、ブラウザはメタタグでの指定に頼ることなく、そのHTMLファイルの文字コードはEUCだと認識して文字化けを回避できる」

とのこです。 まぁ、おまじないだと思っても変わらないでしょう。

他にも、「龠」や「京」でも同じ効果があるそうです。
Yahoo!のソースを見てみると、確かに「京」と書いてあります。

テキストには余談として書いてありますが、

「この方法を考えた人が、幾つかの文字候補の中から、面白がって覚えやすいものを選んだのだと思います」

だそうです。

「文字コードを扱うプログラマーの中では有名な話なので、興味のある人は検索してみるといいでしょう」

とあります。 暇な人、興味のある人は検索してみると面白いかもしれません。

フォント指定による文字化け

日本語の文章を表示するのに、欧文フォントを指定しまうと文字化けをすることがあります。
もっとも、ブラウザやＯＳのバージョンによりけりと言うことなので、まぁ大丈夫だとは思いますが…用心するのに越したことはありません。

基本は、日本語なら日本語のフォント、欧文なら欧文のフォントときちんと指定することです。

読ませる文章？

読ませる文章？

テキストより引用〜

Webで文章を読ませるためには、的確な編集作業と、きれいな文字組みが必要となります。CSSの利用がポイントです。

Webの文字が読みにくいのは、前回やったとおりです。
ユーザに読ませるためには、幾つかのコツがあります。

Webテキストのポイント

印刷物に比べて、Webの文章は可読性が低いです。

まずは、文章自体の長さを短くするようにしましょう。
もっとも、印刷するものであってもダラダラ書くのはいただけません。

ボリュームがある場合は、タイトルや小見出しを工夫する必要があります。
「たとえ、本文が読まれなくても大体わかる」ようににしましょう。
小見出しの数を多くするのも良いでしょう。

本文の文体も、出来るだけやさしいものにしましょう。
どこかの国の憲法のようにしても、読みにくいだけです。

誤字脱字は必ず調べましょう。
「たかが１つ」かもしれませんが、情報の信用性をなくすには十分です。

用語や記号の統一も必要です。これも、信用性に関ってきかねません。
たとえば「パソコンをPCと略す。全角か半角かまできちんと統一する」と言うことです。
全角と半角が違うと、「別の物」としてとらえる人がいるかもしれませんので注意が必要です。

記号は、Webでは表示できないものが多々あります。

引用についても注意が必要です。
引用元はどこか、ということが明らかになっているか注意しましょう。

文字組のコツ

１行の長さを指定する
ウィンドウサイズが可変だと、１行の長さはユーザによって変わります。
この、「変わる」と言うのが曲者です。デザイナーには予測が出来ないからです。

テキストの長さは可変にしないほうが良いでしょう。
CSSを使ったり、テーブルに入れたりして、長さを指定しておきましょう。

フォントについて

HTMLのFONTタグは非推奨のタグです。フォントを設定するにはCSSを使いましょう。
ただ、どんなに「カッコイイ」フォントを使っても、ユーザ（見る側）の環境に入っていなければブラウザの標準フォントで表示されます。

CSSを使えば、文字のサイズを絶対値指定できます。
しかし、画面解像度の違いにより必ずしも同じ大きさで表示できるわけではありません。

行間を指定するときにもCSSを使います。
この値にも絶対値を指定できます。が、ユーザの環境によっては、行間が狭くなったりしてしまうことがあります。
%等の相対値を使ったほうが良いでしょう。

段落

Webでは（通常は）行間が狭いため、どこまでが１つの段落かわかりにくいです。

CSSを使えば、確かに１文字下げと言うことが出来ます。
しかし、段落ごとに間を空けるなどして工夫する必要があります。

感想

ようは、変なことをしなければ良いのです。
「わかりやすい文章で書きませう」などとするのは「バカ」がやることです。
しかもわざわざ第２水準の漢字や、旧字体まで使ったりする奴は終わっています。

結局、文章は読みやすくてナンボの代物なのです。
読みにくいものは「文章」ではなく、「文字の羅列」にすぎません。

あとWebに限らず、文章で誤字脱字が無いかをチェックするのは常識ですね？
文体をやさしく。どこかの国の憲法は、国民に知られるとまずいことが書いてあるためにあんな古臭い文体を使っているのです。

ただ盲点だったのは「テキストの幅を固定する」ということ。
たしかに、固定しておかないと用語が途中で途切れたりとかしかねませんね。

でもまぁ、変なことをしないでいればＯＫです。
変な記号を使ったりとか、変な文体で書いたりとか…常識的に考えれば特に難しいことではありませんね？