http://blog.el-school.com/ [el]:schoolのサポートスタッフによるサポート日記 ja http://blog.el-school.com/archives/50920829.html こんにちは。ツカモトです。 本日は「グリッドシステム」というデザインの技法についてご紹介します。 グリッドシステムとは、縦横線の格子（グリッド）を目安にして、 格子内にできたブロックごとに画像や文字を配置し、デザインを行うものです。 書籍や雑誌、ポス... elschool 2007-08-07T17:36:42+09:00 デザイン 本日は「グリッドシステム」というデザインの技法についてご紹介します。

グリッドシステムとは、縦横線の格子（グリッド）を目安にして、
格子内にできたブロックごとに画像や文字を配置し、デザインを行うものです。

書籍や雑誌、ポスター等でよく使用されていましたが、Webデザインでも
よく利用されます。特に、きっちりしたイメージのものを作成したい、
情報量が多いサイトを作成したいといった場合には有効な技法です。

その単純な構造のため、

・配置される画像や文字等の情報の構造がわかりやすい
・各ページのメニューやリンク等の位置を把握しやすい
・サイト全体のイメージを統一しやすい
・table、CSSを使用したコーディングに適している

等の特長があります。

非常に簡単な技法であるため、初心者の方でもすぐにできるのですが、
情報ごとの間隔をどうするか、画像と文字の比率をどうするか等の具合で
いろいろなイメージも変えることができるので、いろいろお試しください。

次回もデザインの細かい技法について勉強していきたいと思います。
]]> http://blog.el-school.com/archives/50913406.html 今年も８月の１、２、３日に東京ビッグサイトでeラーニングワールドが開催されます。 うちの会社もブースを出展させてもらいます。 さらに今回はおそろいの衣装を用意してみなさんをお待ちしています。 ぜひとも見に来てくださいませ。 elschool 2007-08-01T04:24:59+09:00 eラーニング うちの会社もブースを出展させてもらいます。
さらに今回はおそろいの衣装を用意してみなさんをお待ちしています。
ぜひとも見に来てくださいませ。
]]> http://blog.el-school.com/archives/50882123.html 東京国際ブックフェアに行ってきました。 国際展示場で行われた大規模なイベントです。 ブックフェアの名前の通り書籍のイベントですが、同時開催として学習教育ソフトフェアとデジタルパブリッシングフェアも開催されました。 携帯電話で読むデジタルブックの出典な... elschool 2007-07-07T20:07:53+09:00 eラーニング 東京国際ブックフェアに行ってきました。

国際展示場で行われた大規模なイベントです。
ブックフェアの名前の通り書籍のイベントですが、同時開催として学習教育ソフトフェアとデジタルパブリッシングフェアも開催されました。

携帯電話で読むデジタルブックの出典など、書籍のデジタル化についての出典もあり、eラーニングのヒントにと足を運ばせてもらったというわけです。

会場はかなり広く、かなりの盛況ぶりでした。

気になったブースとして、googleが紹介していた「ブック検索」というものがありました。

これは「書籍の全文を検索して、ユーザーの興味にあった書籍を見つけ出し購入できる場所や貸出先を案内するサービス」だそうです。
図書館などと提携して書籍登録を行っていくとのことで、何かキーワードを入れて検索を行うと、そのキーワードを含む書籍の表紙とキーワードが載っているのが何ページ目か、さらにその内容の一部が閲覧できます。

本屋さんでパラパラっと内容を確認してから買うような感覚でしょうか。

一度皆さんも試してみてはいかがでしょうか。


（東京国際ブックフェアは明日まで開催しています。）
]]> http://blog.el-school.com/archives/50874529.html Vista使ってますか？ 2007年1月30日の発売から半年近くを経ていますが、そろそろVistaの操作にも慣れてきましたでしょうか。まだXPから乗換えを検討している方も多いようですね。 かなりインターフェースが変更されて、ビジュアル面での美しさや３Ｄ機能などが取り上げ... elschool 2007-07-02T11:16:39+09:00 Windows
2007年1月30日の発売から半年近くを経ていますが、そろそろVistaの操作にも慣れてきましたでしょうか。まだXPから乗換えを検討している方も多いようですね。

かなりインターフェースが変更されて、ビジュアル面での美しさや３Ｄ機能などが取り上げられていましたが、やっぱりXPの操作方法になれているし、ウィンドウが半透明じゃなくてもいい、という機能重視の方は、下記の方法をお試しいただいてはいかがでしょうか。

VistaのスタートメニューをXP風に変更する

１．画面左下【スタート】ボタンを右クリック。
２．表示されるメニューから「プロパティ」を選択。【タスクバーと［スタート］メニューのプロパティ】が表示されます。
３．【［スタート］メニュー】タブを開き、【クラシック［スタート］メニュー】にチェックを入れ【適用】ボタンをクリック。

以上で、XPと同じスタートメニュー表示ができるようになります。

使いやすい方を選んでみてくださいね。
]]> http://blog.el-school.com/archives/50871275.html こんにちは。ツカモトです。 本日は「3分の1の法則」というデザインの技法についてご紹介します。 これは、昔の画家たちが構図を決定する際に格子を使用したことに由来する ものです。 やり方は簡単で、画面の上下左右を3等分して、9つの長方形と4つの交点を つくり... elschool 2007-06-29T22:39:00+09:00 デザイン 本日は「3分の1の法則」というデザインの技法についてご紹介します。

これは、昔の画家たちが構図を決定する際に格子を使用したことに由来する
ものです。

やり方は簡単で、画面の上下左右を3等分して、9つの長方形と4つの交点を
つくり、デザイン内の主要な要素をその交点に置きます。
一見、非対称的な構図になりますが、見る者におもしろみや美しさを感じ
させることができるようになります。

これは、比率が黄金比に近いため（黄金比は0.618、3分の2は0.666）で、
現在でもデザインするときにはよく使われているようです。

ただし、大抵のデザインに活用でき、しかも使いやすいこの「3分の1の法則」
ですが、重要な要素が１つの場合にはこの方法はあまりいい結果を生み
ださないので注意が必要です。

その他、デザイン以外にも写真や絵画の構図等にも簡単に活用できますので、
レイアウトを決定する際に迷った時には一度試してみては如何でしょうか。。

次回もデザインの細かい技法について勉強していきたいと思います。 ]]> http://blog.el-school.com/archives/50826704.html こんにちは。ツカモトです。 今回は「見た目」によって受ける印象を良くするための技法として、 「アフォーダンス」について見ていきます。 「アフォーダンス」とは、「与える、提供する」という意味の英語で、 具体的にはその物自体がもつ形や色、材質等が、その物を... elschool 2007-06-01T10:05:48+09:00 デザイン 今回は「見た目」によって受ける印象を良くするための技法として、
「アフォーダンス」について見ていきます。

「アフォーダンス」とは、「与える、提供する」という意味の英語で、
具体的にはその物自体がもつ形や色、材質等が、その物をどのように扱ったら
いいかというメッセージを伝えている、という考えのことです。

つまり、目の前にドアがあり、そこに取っ手がある場合、その扉を開けようと
する人は「このドアは引いて開けることができる」と感じると思います。
これは、そのドアは、取っ手が扉を開けようとする人に対して、
「ドアを引く」というアフォーダンス（メッセージを伝えている）を
持っているということになります。

このアフォーダンスの考え方がしっかりしていないと、使っているユーザ
に間違った動作をさせてしまったりすることにもなるので、デザインをする
際には注意が必要です。

Webのデザインでいうと、ボタンやアイコン等がこれに当たります。
例えばボタンは簡単な2Dのボタンに比べると、現実的にあるような、
3Dっぽいボタンの方が、やはりボタンと認識しやすいと思いますし、
アイコンについてもたとえばWindows等のごみ箱などのアイコンはすぐに
そのアイコンがどういった役割を持つかがわかりやすくなっている
と思います。

では具体的にはどういって取り入れていけばいいのでしょうか。
一番簡単な、そして確実な方法としては、ありふれたものや環境のイメージを
使って、それが実世界でどのような機能を果たしているかをユーザに思い出
させることで、デザイン内の機能に「アフォーダンス」を持たせることが
できると思います。

デザインについて「使い方がわからない」等の指摘を受けた際には、
一度このあたりも意識してチェックしてみては如何でしょうか。

次回もデザインの細かい技法について勉強していきたいと思います。 ]]> http://blog.el-school.com/archives/50767290.html Windowsの新しいOS『Vista』を搭載したパソコンが多く売り出されています。 購入を迷われている方も多いのではないでしょうか。 便利になっているのか、美しいグラフィック以外にどういう機能があるのか、 いまいちわかりにくいようです。 また、OSだけではなく高性... elschool 2007-04-30T10:19:47+09:00 Windows 購入を迷われている方も多いのではないでしょうか。

便利になっているのか、美しいグラフィック以外にどういう機能があるのか、
いまいちわかりにくいようです。

また、OSだけではなく高性能なパソコンが必要になるわけですから出費も
結構なものですね。


Vistaの新機能で真っ先にあげられるのは、3Dや透明感のあるデスクトップでしょう。

「Aero（エアロ）」と呼ばれる機能です。

しかしちょっと気をつけていただきたいのが、Vistaでもこの「Aero（エアロ）」を
利用できるものとできないものがあるのです。

今一般に売り出されているVistaの種類は下記の4つです。

Windows Vista Home Basic
Windows Vista Home Premium
Windows Vista Business
Windows Vista Ultimate

この中で、『Windows Vista Home Basic』については、「Aero（エアロ）」を
利用することができません。

手頃な値段のノートパソコンなどは、Windows Vista Home Basicであることが多いようです。

Vistaを買ってはみたけど「Aero（エアロ）」が使えない？というかたはOSのバージョンを
確認してみましょう。

また、購入を考えている方は、「Aero（エアロ）」機能が必要かどうか考えて
OSを選んでくださいね。
]]> http://blog.el-school.com/archives/50725627.html こんにちは。ツカモトです。 今回は「見た目」によって受ける印象を良くするための技法として、 「黄金比」について見ていきます。 「黄金比」は、簡単にいうと、人が見て最も美しいとされる比（1：1.618） のことで、これを利用してデザインをすることで、見る人に対... elschool 2007-03-01T09:49:41+09:00 デザイン 今回は「見た目」によって受ける印象を良くするための技法として、
「黄金比」について見ていきます。

「黄金比」は、簡単にいうと、人が見て最も美しいとされる比（1：1.618）
のことで、これを利用してデザインをすることで、見る人に対して好ましい
デザインにすることができる、というものです。

「黄金比」は様々な建築、美術品、また、自然界のものにいたるところにも
見ることができます。パルテノン神殿、ギザのピラミッド、ストーンヘンジ、
また、自然界のものでは、貝殻やまつかさ、人体もほぼ黄金比で構成されて
います。

では、なぜ「黄金比」がいいとされているのでしょうか。
実はこの「黄金比」がいいといわれる由来は、相当数の調査によって、
実証はされているものの、明確な理由というものは未だわかって
いないようです。

ただわかっているのは、「黄金比」が、過去から現在に至るまで、
デザインの世界にかなりの影響を与えている、ということです。
現に、現在でもそのあたりにある様々なものに「黄金比」は
取り入れられています。
（家具や雑誌、音楽プレイヤーのiPod等にも取り入れられている。）

以上のように、非常によく使われている「黄金比」ですが、
ではデザインをする上で必ずこの比率を組み入れる必要があるかといえば、
もちろんそうではありません。

ただ、デザインをする上で「何かしっくりこない」と感じたり、
「これ以上はどうデザインをすればいいかわからない」というような
手詰まり状態にになった時などに、黄金比を利用してデザインをしてみると、
いい結果が出るかもしれませんので、そういう時は是非利用してみては
如何でしょうか。

また、「黄金比」以外にも好まれる比率として「白銀比」
（A3やA4などの用紙サイズに利用されている比率）と呼ばれる比率も
存在します。

このあたりはネットや本などで調べるともっと詳しいことが
書いてありますので、興味のある人は調べてみてください。

次回もデザインの細かい技法について勉強していきたいと思います。 ]]> http://blog.el-school.com/archives/50711692.html 大々的に・・・というほど世間では騒がれていないようですが、Windows Vista が発売されました。 サポートでも、この新しいOSできちんと受講ができるのかを調べるために、Windows Vista Home Premium Edition 環境を用意してみました。 インストールにはかなり手間取っ... elschool 2007-02-10T15:47:49+09:00 Windows
サポートでも、この新しいOSできちんと受講ができるのかを調べるために、Windows Vista Home Premium Edition 環境を用意してみました。

インストールにはかなり手間取ってしまいました。

といっても心配していたパソコンの性能云々ではなく、パソコンのCDドライブが壊れていたことが原因で、それが解決するとあっさりとインストールできました。

ところで、Windows Vista のインストール中表示される説明の中で、ちょっと心にひっかかるものがありました。

「すべてのディスクが読み取られるまで、コンピュータのそばにいてください。」

・・・そばにいて・・・何を甘えたことを言っておるんだ。

妙に曖昧な表現で、なんとなく「お子様から目を離さないでください」のような感じを受けてしまいました。

ま、それだけなんですけどね。 ]]> http://blog.el-school.com/archives/50704659.html こんにちは。ツカモトです。 さて、今回は「見た目」についてお話したいと思います。 皆さんはデザインをされている物を見た時に、「なんとなくカッコイイ」 「なぜかわからないけどイイ」等、特に理由はないのにそのデザインを 好きになってしまうことはありませんか... elschool 2007-01-31T22:32:59+09:00 デザイン さて、今回は「見た目」についてお話したいと思います。

皆さんはデザインをされている物を見た時に、「なんとなくカッコイイ」
「なぜかわからないけどイイ」等、特に理由はないのにそのデザインを
好きになってしまうことはありませんか？

また逆に、テキストも読み易く、色も自分が好きなものを使っているのに、
そのデザインはなんとなく好きじゃないと感じることはないでしょうか。

私はそのようなことがよくあるのですが、そのような感じを受ける
大きな原因のひとつとして、そのデザインの「見た目」によって受ける
「印象」に大きな影響あるのかなと思っています。

では、この「印象」をよくするためにはどうすればいいかという答えを出すのは、
誰であってもかなり難しいことに感じるでしょう。実際そうだと思います。

この「印象」というのは人それぞれ違うもので、ある人からしてみれば
良いものに見えても、別の人から見れば悪く見える、そういったもの
だからです。

ただ、見ている人のほとんどが「イイ」と感じるような「見た目」にする
ことも、デザインの歴史の中で培われてきた技法を使えばある程度は
可能になっています。

これらの内容を少しデザインに盛り込むことで、さらにもう一歩デザインに
深みが出てくることになりますので、次回からその細かい技法について
少しずつ勉強していきたいと思います。
]]> http://blog.el-school.com/archives/50697792.html Windows XPからはや5年、次期OS（日本語版）が発売されることになりました。 その名も【Windows Vista】（ビスタ） 目玉となる機能は、グラフィック表現の美しさや直感的な操作性の向上 といったところで、後ろが透けて見えるウィンドウだったり、 奥行きを持たせて３... elschool 2007-01-22T19:21:07+09:00 Windows その名も【Windows Vista】（ビスタ）

目玉となる機能は、グラフィック表現の美しさや直感的な操作性の向上
といったところで、後ろが透けて見えるウィンドウだったり、
奥行きを持たせて３Ｄ表現でファイルが探しやすいことだったりします。
（Windows Aero（エアロ）という機能名だそうです。）

ただしその機能を使うためにはかなり高性能なパソコンでないと快適には使えないようです。

①　ハードウェアによるPixel Shader 2.0サポート
②　1.6Gbytes/sを超えるグラフィックス・メモリ帯域
③　WDDMドライバの供給
④　32bitカラー・モードの利用
⑤　適切なグラフィックス・メモリ容量

なんのことだか難しくて分かりませんね。

まぁちょっと古いパソコンだと快適には動いてくれないということです。
またノートパソコンでは厳しいでしょう。

しかしAero機能を使わなければWindows Vistaを動かす条件はぐっと低くなるそうです。
・・・それって意味があるんでしょうかね。


あと、Vistaは６種類で発売されます。

Windows Vista Home Basic Edition
Windows Vista Home Premium Edition
Windows Vista Business Edition
Windows Vista Enterprise Edition
Windows Vista Ultimate Edition
Windows Vista Starter Edition

いやーいよいよ迷いますねこれは。
]]> http://blog.el-school.com/archives/50685915.html あけましておめでとうございます。ツカモトです。 今年もまた、いろいろなデザインに関するお話をお伝えできるように がんばりたいと思いますので、どうぞよろしくお願いいたします。 さて、今回は、「レイアウト」の作業における4つのポイント ●Webサイトの内容に... elschool 2007-01-06T18:22:04+09:00 デザイン 今年もまた、いろいろなデザインに関するお話をお伝えできるように
がんばりたいと思いますので、どうぞよろしくお願いいたします。

さて、今回は、「レイアウト」の作業における4つのポイント

●Webサイトの内容に合ったレイアウトになっているか。

●情報がしっかり整理、分割されているか。

●更新しやすい仕組みになっているか。

●フレームレイアウトになっていないか。

のうち、「フレームレイアウトになっていないか」についてお話したいと思います。

フレームレイアウトとは、ひとつのWebページに対して複数のページを表示させること、
具体的には、複数のHTMLをひとつのHTML（フレームセット）に表示させることを言います。

フレームレイアウトを使用すると、例えばWebサイトの全ページ共通となる部分
（メニューなど）がある場合、各ページ1ページずつにメニューを入れる必要が
なくなりますので、メニューの項目を増やすなどの変更があった場合等の管理が
非常に楽になります。

以上のような理由から、フレームレイアウトはInternet Explorer3.0、Netscape2.0以降で
フレームレイアウトがサポートされて以来、急速に普及しましたが、少し以前から、

・音声ブラウザなどを使用すると正常に動作しない場合がある。

・ブラウザによっては、想定通り表示されない場合がある。

・特定のページのブックマークが困難

・検索ロボットに収集されにくい

等の理由から、このフレームレイアウトを使用したサイトは減少しつつあるようです。
また、WWWに関する技術の標準化を行っている団体であるW3Cでは、このフレームは
非推奨（将来的には廃止される予定）となっていますので、新しくサイトを作成する際には、
使用を控えた方がいいでしょう。

以上、4回に渡って「レイアウト」の作業における4つのポイントについて考えてみましたが、如何でしたでしょうか。

これ以外にも、Webサイトのレイアウトをする際には、それが多種のブラウザでしっかり
表示されるか等、様々なことを意識する必要があります。

以上のような内容は未だ「これ」という定義がないものも多く、日に日に変化しつづけていますので、
デザインをする側としては、できるだけそういった情報に常に触れることができるように
意識しておく必要がありそうです。

次回はデザインにおける「見た目」について考えてみたいと思います。 ]]> http://blog.el-school.com/archives/50684226.html 皆様 あけましておめでとうございます。 今年が皆様にとって有意義な年になりますよう願っております。 有意義にするためにも、eラーニングで資格を目指すなどしてみてはいかがでしょうか。 （多少宣伝も入っております） 本日1月4日よりサポート再開しております... elschool 2007-01-04T10:40:12+09:00 サポート日記
あけましておめでとうございます。

今年が皆様にとって有意義な年になりますよう願っております。
有意義にするためにも、eラーニングで資格を目指すなどしてみてはいかがでしょうか。
（多少宣伝も入っております）

本日1月4日よりサポート再開しております。
ぜひぜひがんばって受講してくださいませ。

サポートスタッフ一同も皆様によろこんでいただけるようにがんばります！

2007年も[el]:school をよろしくお願いいたします。
]]> http://blog.el-school.com/archives/50666100.html こんにちは。ツカモトです。 今回は、「レイアウト」の作業における4つのポイント ●Webサイトの内容に合ったレイアウトになっているか。 ●情報がしっかり整理、分割されているか。 ●更新しやすい仕組みになっているか。 ●フレームレイアウトになっていない... elschool 2006-12-11T16:49:12+09:00 デザイン 今回は、「レイアウト」の作業における4つのポイント

●Webサイトの内容に合ったレイアウトになっているか。

●情報がしっかり整理、分割されているか。

●更新しやすい仕組みになっているか。

●フレームレイアウトになっていないか。

のうち、今回は「更新しやすい仕組みになっているか」について
お話したいと思います。

自分が作成したWebページを、多くの人に見てもらおうと考えると、
どうしても必要となってくる作業が「Webページの更新」という作業です。

どれだけ綺麗で、おもしろくて、わかりやすいサイトでも、更新がなければ
次第にサイトを訪れる人も減ってしまいますので、Webサイトを制作する際には、
最も気にしなくてはいけない作業になります。

ですので、HTMLやCSSでサイトをコーディングをする際に、更新が滞りなく
ちゃんとできるかを意識する必要があるんです。

例えばHTMLタグに、そのタグがページのどの部分を表わしているかをコメントで
書いておくといったことや、更新する情報量が増えることを想定して、縦幅は
情報に応じて広がるように作るといったこと、フォルダ、ファイル名のつけ方に
規則をつけるといった細かいことなどです。

これらの作業は、一見、時間がかかるのでおろそかにしがちですが、実際に
それ以降の作業や、他の方へ作業の引継ぎをする際などにはとても必要なこと
ですので、「まだしたことがない」といった人は一度試してみてください。

また、作業していく中で、自分なりの作業フローもできてくると思いますので、
日ごろの作業で自分なりの作業フローを作っていくのもいいかもしれませんね。

次回はレイアウトのポイント「フレームレイアウトになっていないか」について
考えてみたいと思います。 ]]> http://blog.el-school.com/archives/50657417.html お久しぶりです。ツカモトです。 第5回目となる今回は、前回の続きで「レイアウト」の作業における 4つのポイントについてです。 ●Webサイトの内容に合ったレイアウトになっているか ●情報がしっかり整理、分割されているか ●更新しやすい仕組みになっている... elschool 2006-11-30T10:28:01+09:00 デザイン
第5回目となる今回は、前回の続きで「レイアウト」の作業における
4つのポイントについてです。

●Webサイトの内容に合ったレイアウトになっているか

●情報がしっかり整理、分割されているか

●更新しやすい仕組みになっているか

●フレームレイアウトになっていないか

これが4つのポイントなのですが、このうち、「情報がしっかり整理、
分割されているか」について少しお話したいと思います。

「情報がしっかり整理、分割されているか」ということは、
Webデザインにおけるレイアウト作業をする上で最も重要なポイントと
なります。

これは、ビジュアル的な要素が重要となるアートなどの芸術作品と違い、
Webページの目的は「情報を伝えること」が大切となるからです。

ですので、レイアウトの作業をする際には、「情報を伝える」ために
「情報がしっかり整理、分割する」ということに気をつけて作業をする
必要があります。

具体的な作業としては、テキストを分かり易くまとめる、読み易くする、
といったことはもちろん、情報量が多い場合には、カテゴリ分けをして整理
する必要がありますし、同じようなカテゴリでも、区別して見てもらいたい
情報には色で情報を区別するといったことなど、様々な作業や配慮が必要に
なります。

そして、上記のようにしっかり情報が整理されたWebページにビジュアルを
組合せることで、もっと魅力的なWebサイトを制作することができるのです。

これら「情報を伝えるためのデザイン」は、「情報デザイン」という
デザインの分野で、最近では本やWebなどでもよく取り上げられていますので
興味のある方は調べてみては如何でしょうか。

次回はレイアウトのポイント「更新しやすい仕組みになっているか」について
考えてみたいと思います。
]]>