2009年12月

2009
12.27

Web教育について考える。

webism09122702.jpgアメリカのWeb教育事情について、TPACに参加したスタッフはこんなことを言っていました。
「アメリカはWebは企業研修や学校教育で学ぶのが当たり前」なのだと。

さすがWebの最先端を行く国は違うな、という印象を私は抱きました。
日本のWeb教育はどうなのでしょう。

インターネット・アカデミーは日本初のWebの専門校です。
通われている方の大多数が社会人の方々なのですが、
ここ最近じわじわと増えてきたのが実は学生の方々。

Web業界に入りたくて…という方ももちろんいらっしゃいますが、
どこの業界に行くにも必要とされる知識だから、
といって学んでいる先見的な考え方の方もいらっしゃいます。

そう、Webは、いまやビジネスの上で必要不可欠な知識であり、スキルなのです。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

Web業界にとっての課題は、実はこの「教育」なのではないでしょうか。

学校教育でも”ITを学ぶ”という授業はありますが、
正直PCの使い方を学ぶ、というのはWeb以前の問題であって、
情報発信をする上でのWebの仕組み、表現方法、リテラシー、マーケティングといった
多くのことを学ぶことで初めて社会で活かせる知識になります。

その危機感からか、今Web教育を推進していこうという企業は増えてきています。

もちろんインターネット・アカデミーでも、
古くから産学連携プロジェクトとして北海道の稚内北星学園との連携で
Webサーバー、プログラム、ネットワーク系のカリキュラムの共同作成に取り組んできました。

インターネット・アカデミーの卒業生である三上洋介さんは、
お勤めされている株式会社COOSYと岩手大学との共同研究として、
産学官連携でWeb教育推進と人材育成に尽力されています。

産学連携ではありませんが、
W3Cも今年6月にWeb教育を推進するグループ、として「Open Web Education Alliance Incubator Group (OWEA XG)」というものを立ち上げました。
(カリキュラムに関してはこちら→Opera Web Standards Curriculum

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

今はWebサービスの普及もあって、若い方々はmixiやユーチューブ、携帯サイトを触る中で自ずと
Webの知識を少しずつ吸収している状態です。
そこからさらにWebの知識を深めようと能動的に学ぶことで、世界に羽ばたく力を養ってもらえたらなと、
通ってくださっている学生の方々を見ながら思う今日この頃です。

message by INTERNET ACADEMY | 2009年12月27日 23:48 コメント (0)
2009
12.25

Web業界でホットなワード。

webism091225.jpg12月22日発売の東京IT新聞では、『2009年を振り返る5つのキーワード』と題した特集が掲載されていました。

たとえば、全5分野のうち【Web・マーケティング編】では「Twitterのブレイク」、【モバイル編】では「iPhone」、【エンタープライズ編】では「クラウドコンピューティング・SaaS」というように、今年確かによく聞いた単語がピックアップされていました。

その中で、今年インターネット・アカデミーのスタッフ仲間にヒアリングをすると、
「iPhone」が一番ホットなキーワードだったようです。
スタッフのiPhone所持率も、じわじわと上がってますから、これも納得です。

………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

インターネット・アカデミーのグループ会社である「WEBSTAFF」から聞く情報でも、
下半期からはiPhoneの名がよく話題に上がっていました。

特に、”iPhoneのアプリケーション開発スキル”は今かなりホットなようで、
渇望している企業が多いそうです。

現状、iPhoneのアプリケーション開発には、
制作環境としてMacがなければならない上、「Objective-C」という言語を使わねばなりません。

結局はアプリケーション開発ですから、技術開発者の領域で
通常のWebクリエイターやデザイナーは手が出しづらい状況にありました。


しかし、今年の10月に行われた「Adobe MAX 2009」で、大きな発表がありました。

なんと、今開発中の「Flash CS5」から、iPhoneアプリが開発できるようになるというのです。
最新のFlashソフト(※1)を使うことさえできれば、
WebクリエイターもiPhoneのアプリケーションソフトが作れるようになるのです。
しかも、Windowsにも対応。

これは画期的!Web業界にとってかなり大きな話題でした。

ちなみに、Flash CS5を使って開発したアプリケーションソフトのサンプルは、
Adobe Labs -- Adobe Flash Professional CS5: Applications for iPhone」に掲示されておりますので
ご興味のある方は見てみてください。

………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

この待望のCS5は、1年後の2010年末に発売予定、といわれています。

WEBSTAFFから聞くWeb業界の企業からニーズのあるスキルの情報を見ていても、
おそらくCS5が出るタイミングでまたモバイルだけでなくWeb業界の流れに変化が起きるでしょう。

以前Flashのカリキュラム開発担当がどうカリキュラムを改定したか、
という記事を書いたことがありましたが、
もちろんCS5が出たらiPhoneアプリ開発も組み込みことを検討・予定しております。

最新のネタや情報はワクワクしますね。
2009年だけでなく2010年にかけても、「iPhone」は注目キーワードになりそうです。

----------
(※1)Flashとは、アニメーションやゲーム、動画コンテンツの作成ができるソフトです。
Flashのコンテンツを作る職業の人を「フラッシャー」といいます。

message by INTERNET ACADEMY | 2009年12月25日 22:03 コメント (0)
2009
12.24

好きになれるかどうか。 ~後編~

webism09122402.jpg前回、Webサイトを見た消費者の方が、見ていない消費者よりもその企業に対して好感度を抱いている可能性が高い、というお話をしました。
これは逆の言い方をすれば、Webサイトの質が悪ければ、消費者はWebサイトを見ることで逆に好感度が下がってしまう可能性が高い、ということでもあります。

ただ一つ言えるのは、Webサイト次第で企業イメージが大きく左右されるということ。
では、好感度が高まるWebサイトとは、一体どんなWebサイトなのでしょうか?

………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

ネットマーケティングを展開する株式会社アイシェアが、
これに関し市場調査でわかったデータを公開しています。(⇒こちら

まず、「インターネットで企業サイトを見たことがあると応えたユーザー」は全体の約65%だったそうです。
その65%のユーザーに対する質問の結果は以下の通りです。


………・・・………・・・………
【企業サイトでどんな情報を求めていますか?】<複数回答>
1位 商品情報  …94.0%
2位 店舗検索  …80.4%
3位 プレスリリース・ニュースリリース  …46.7%
4位 会社概要  …41.0%

【好感が持てるのはどんな企業サイトですか?】<複数回答>
1位 情報が整理されている  …85.9%
2位 軽くてページ移動がスムーズに行える   …80.4%
3位 サイト内検索が使いやすい  …64.1%
4位 情報が豊富  …48.1%

参考:株式会社アイシェア 「rTYPE」
………・・・………・・・………

やはり商品情報をどう見せるかが鍵になるということがわかりますね。
また、「好感が持てる企業サイト」の1位は「情報が整理されている」というものでした。

消費者(=ユーザー)は、情報を求めてWebサイトへやってきますから、
そのユーザーが求めている情報をいかに短時間でわかりやすく提供できるかが大切です。

これは、いくらWebサイトがあっても、なんとなくデザインされたようなサイトでは
好感度を高めることができない、ということの現われですね。
高感度を高めるには、Webデザイナーの腕はもちろんのこと、
コンテンツの情報整理をするディレクターの手腕にかかってきます。

………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

大切なのは、Webサイトの見た目ばかりを追いかけるのではなく、
きちんとユーザーが欲しい情報を提供し、使い勝手の良いものにできているかということです。

インターネット・アカデミーのインストラクターはみな、
上記の観点を欠かさず受講生の方の作品のチェックを行っています。

Webサイトの作品を作っている!という方、
今まさに企業のWeb担当者なんです!という方は、
今一度上記の観点を元にサイトの自己評価をしてみてください。
もし自分じゃわからない、という方はぜひスクールに聞きに来てくださいね~。

インストラクター一同お待ちしております☆

message by INTERNET ACADEMY | 2009年12月24日 16:15 コメント (0)
2009
12.23

好きになれるかどうか。 ~前編~

webism091223.jpgみなさんは、今年印象に残ったCMはありますか?

毎年「BRAND OF THE YEAR」という、
1年間で消費者のCM-Branding評価が高かった企業が表彰されるイベントがあります。(主催:CM DATABANK/CM総合研究所/月刊CM INDEX)

今年は、ソフトバンクモバイルが1位を獲得したようですね。iPhoneの隆盛といい、納得、という感じです。

「ブランディング」とは、企業が消費者にとって価値のあるブランドを構築するための活動を指します。
ブランドとは、企業が作り出すものではありますが、
実際は消費者の中で抱かれるイメージの総体を指します。

ようは、その企業や商品に対して消費者がどういう認識を抱いているか。それがその企業の「ブランド」です。

企業が消費者に対して自社や商品の「ブランディング」を行うには、広告戦略がモノをいいます。
その代表がテレビCMですから、「BRAND OF THE YEAR 2009」の受賞企業の顔ぶれを見ると、
消費者がどんな表現に対して「好感度」を抱いているかがわかります。

………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

最近ちょっと面白い統計の数字を見つけました。

日本ブランド戦略研究所が調査した「Web Equity調査結果分析2009」によると、
とある企業のユーザー(消費者)に対し、その企業に対する好感度の有無をヒアリングしたところ、
Webサイトを見た人の方が、見ていない人よりも好感者の割合が10%も高かったそうです。

つまり、ユーザーにWebサイトを見てもらった方が、よりブランディングの効果が高まるということです。

これは、メディアとしてのWebの価値が高まったこと、また、各企業がWebを重視し、
魅力的なWebサイト制作に取り組んできた結果でもあります。

うーーん。
これも納得。
いくら広告でステキなお店だったとしても、
Webサイトを見たときにその質があまり良くないと
かなりガッカリしちゃいますもんね。


…つづく。

message by INTERNET ACADEMY | 2009年12月23日 18:50 コメント (0)
2009
12.20

2010年のトレンドデザイン。

webism091220.jpg前回は、「昔流行ったけど、今はちょっと古くてキケン」というデザインの話題を取り上げました。
今回はその続編です。

2009年から人気が出て、おそらく2010年も発展・流行していくだろうと見られているデザインを紹介します。
参考は、前回に引き続き【Web Design Ledger】の「Web Design Trends for 2010」の記事です。

2010年のWebデザインのトレンドはこちら。
………・・・………・・・………
特大のヘッダとロゴ
手描き風のデザイン
大胆で大きなフォント
タイポグラフィ
1ページ レイアウト
インパクトがある画像
パースの活用
インタラクティブで直感的なデザイン
モーダルボックス
◆ 最小限主義、ミニマリズム
オーバーサイズのフッタ
レトロ
イントロボックス
雑誌風のレイアウト
………・・・………・・・………

2つ目の”手書き風デザイン”は、決して新しいものではありませんが、
来年は企業サイトでも一般的になるのでは、とも言われています。

既にデザイン系の企業サイトでは採用しているところも珍しくありませんね。
インターネット・アカデミーの卒業生、三上洋介さんがお勤めされている
株式会社クーシーのサイトは、上記のトレンドをいくつも取り入れておりとても先進的でオシャレなのでぜひご参考までに。

☆参考:株式会社クーシー

また、「大胆で大きなフォント」と「1ページレイアウト」は、
西部劇の指名手配ポスターなどで見かけるようなデザインに近いものがあり、これも2009年からじわじわと人気を博していますね。

☆参考:Krispy Kreme Doughnutus Japan


10コ目の「ミニマリズム」というのは、”最小限主義”と訳される現代美術用語です。
1960年代の米国で影響力をもった、形態や色彩を最小限度までに突き詰めたデザインで、
Webデザインにおいては
 ・十分な余白
 ・大胆なタイポグラフィ(文字デザイン)
 ・センスの良い配色
で表現された「ミニマリズム」なデザインが流行するのでは、といわれています。

☆参考:UNIQLOCK

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

来年のサイト制作にむけて、上記の内容はぜひ参考にしてみてくださいね。

とはいえ、前回も書きましたが、むやみやたらと流行を取り入れればいいというものでもありません。
サイトのコンセプトにあわせて、
上記の流行デザインをうまく活用することが大切です。

上記のサイトデザインを見ていて、「何か作れそう!」「アイディアが沸いてきた!」という方は、
ぜひぜひ今からアイディアを固めて、来年どんなサイトを作るか空想してみてください。

message by INTERNET ACADEMY | 2009年12月20日 22:14 コメント (1)
2009
12.18

流行りモノには気をつけろ!

webism09121802.jpg年末になると、一年を振り返って今年流行したものを紹介するメディアが増えますね。

Webデザインにももちろん流行り廃りがあります。
そこで、今日は「昔流行ったけど、今はちょっと古いよネ」というWebデザインの技法を【Web Design Ledger】という海外サイトの記事をもとにご紹介したいと思います。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

流行=トレンドのデザインは、うまく利用すれば
話題性を生んだり、流行に気を配っているというブランディングにも役立ちますし、
オシャレな印象を与える意味でも効果があります。

しかし、流行というものは工夫もなく過度に使いすぎたり、
既にトレンドでなくなったものをいつまでも使っていると、
途端に逆効果になってしまいます。

そんな”ちょっとキケンなデザイン”として、【Web Design Ledger】では次のものが挙げられています。

………・・・………・・・………
鏡面反射
アクアボタン
フラリッシュ(植物のシルエット)なデザイン
◆ 困ったらコーヒーカップの写真を使う
地球の画像を使うことでグローバル感を表現
コミックフォントの乱用
ストックフォトとあからさまにわかる画像の使用
ペーパー(紙)の質感の表現
◆ デザインモチーフがポラロイド写真
特大のRSSアイコン
◆ アクセスするとサウンドが自動再生される
アクセスカウンター
◆ テキストがスクロールするマーキー
ブラックの背景
◆ サイトに入る前にFlashかHTMLサイトかなどの仕様を聞くスプラッシュページの設置
◆ Flashサイトにおけるスキップの無いイントロ
黒い背景
………・・・………・・・………

うーん…納得するものもありますし、
いまだに日本では頻繁に使われているものも混じっていて読んでいてドギマギするものもありますね…。

一つひとつを解説したいところですが、
キリがなくなるので控えさせていただきます(^^;

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

一つ言えるのは、単純に流行を追いかけて、間違った使い方をするのが一番問題!ということ。

たとえば、上記の1つ目に挙げられている「鏡面反射」。
もともとは、高級感や透明感、浮遊感を表現するものですが、
意味なくただ流行を追って鏡面反射が使われているのを見ると、
強い違和感を感じてしまいます。

また、最後の「黒い背景」など、使うのが悪い!というわけではないものもあります。
これは単純に、使われすぎてトレンドが過ぎたので気をつけてね、という程度のものです。

第一、流行が過ぎたかどうかの明確な規定があるわけでもありませんから、
慎重に判断し、利用する必要があります。


流行に惑わされない。
使い方を間違えない。
Webデザインの流行を使うには、それを忘れないことが大切です。

message by INTERNET ACADEMY | 2009年12月18日 21:38 コメント (0)
2009
12.17

♥IA loves IA♥

webism091217.jpgIAといえば、InternetAcademy(インターネット・アカデミー)!と言いたいところですが、今日は別。
本日は、IAはIAでも、「Information Architecture」、情報アーキテクチャのお話です。

情報アーキテクチャとは、一言で言えば「情報設計」のことです。
複雑な情報をわかりやすく伝えたり、探しやすくする表現技術をさし、Webに関わる人ならぜひ身につけておきたいスキルでもあります。

なぜなら、より誘導効果が期待できるサイトデザインを実現するためには、
わかり易く情報を伝えるためのサイトの情報設計力が必須。
Webサイトのデザインは、見た目が美しくなるようパーツをレイアウトしていけばいい、
というものでもないんですね。

だからこそ、よりWebサイトの質を高めるために必要な知識を追求していくと、必ずIAの概念に行きつくのです。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

さて、昨日、IAに興味がある人にとってはとても興味深い
ITSUDEMO ATSUSHI100%」というサイトが公開されました。

こちらのサイトは『IA100:ユーザーエクスペリエンスデザインのための情報アーキテクチャ設計』
という本のスペシャルコンテンツで、
著者である長谷川敦士さん(株式会社コンセント代表取締役社長)が登場し、
IAについて楽しく紹介がされています。

このサイトのオモシロイ所は、なんとサイトに登場する長谷川さんと
擬似的な会話を楽しみながら、IAについての知識を深めることが出来るところにあります。

次々と繰り出される「知ってる?」の質問に回答をすると、
ときに的確なツッコミが、またときにはズレた返事が、そして唐突に違う話題の返事が返ってきます。

しかし、楽しいだけではありません。
そうやって長谷川さんと会話を楽しんでいく中で、IAについての知識がどんどん広がっていきます。

本もオススメですが、こちらのサイトは必見。
Flashによるコミュニケーションデザインの素晴らしさが十二分に発揮されています。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

ちなみに。
IAに関わる組織としては、米国を中心とした国際組織
Information Architecture Institute(略称:IAI)」というものがあります。
情報アーキテクチャの普及活動や設計ツールの整備、
教育・人材育成、ローカルコミュニティの統括などを行っています。

また、日本では「Information Architecture Association Japan(略称:IAAJ)」という団体があります。

ユーザーに作ったサイトを好きになってもらうには、IAを好きになり、IAについて知ることがイチバン。

IAはなかなか語りつくせる分野ではありませんから、
少しずつwebismの中で具体的な紹介をしていきたいですね。

message by INTERNET ACADEMY | 2009年12月17日 22:06 コメント (0)
2009
12.16

ラフを、ラクにつくりたい。

webism091216.jpg以前、『サイトの設計図をつくろう。』という記事で、ワイヤーフレームを作るときに使える便利なサイトの紹介をしました。

ワイヤーフレームとは、Webサイトの設計図のことでしたね。しかし、しっかりしたワイヤーフレームを作る前にはラフ案が必要です。

手書きで書くことも多いのですが、本日はラフが手軽に作れる便利なツールをご紹介したいと思います。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

Webサイト制作で作成する「ラフ案」は、別名「モックアップ(mock-up)」ともいいます。

「今回メニューはアイキャッチ画像の下に置こうか」
「ヘッダーに入れるのはロゴとサイト内検索枠でいい?」
レイアウトはデザインの屋台骨ですから、クライアントにヒアリングした内容をもとに、上記のようなディスカッションをしながら決めていきます。
その時にできる大まかなサイトイメージを図式化したのが、モックアップなのです。

モックアップとワイヤーフレームの違いについては厳密な定義があるわけではないため、ここではひとまず


  • 【モックアップ】…サイトの見た目を大まかに定義したもの

  • 【ワイヤーフレーム】…制作に必要な情報であるデザインやコーディングの指示などが記述されたもの

…としておきたいと思います。
ではさっそく便利なツールを紹介しましょう。

………・・・………・・・………………・・・………・・・………………・・・………・・・………
モックアップ制作に便利なサイト
………・・・………・・・………………・・・………・・・………………・・・………・・・………
LovelyCharts
オンライン上で、フローチャート、サイトマップ、その他ワイヤーフレームなどのチャートが無料で作れます。
日本語未対応であることと、会員登録の必要がありますが、かわいらしさと使いやすさは◎。
ちなみに今回の画像は、「LovelyCharts」で私が作ったサイトマップのサンプルです♪

Pencil [Add-ons for Firefox]
Firefoxというブラウザソフトのアドオン(※1)。
無料でかつ日本語対応。それでいて基本機能は全てそろえており、
参考サイトを見ながらモックアップが作れるのと、ネットにさえつなげればすぐに作れる手軽さがウリ。

………・・・………・・・………………・・・………・・・………………・・・………・・・………

もちろんソフトがあるならば、Adobe PhotoshopやIllustrator、
またはMicrosoft Office Visioなどを使った方がより細かい編集が可能です。

ただ、これらを使えば、外出先、ソフトがない場所で急に図が必要になった!なんていう場合でも、
ネットの環境があればモックアップの制作が可能です。

ちなみに、オンライン上のものではありませんが、もひとつオススメなのが
Balsamiq Mockups です。

手書き”風”のモックアップが作れるアプリで、日本語未対応、製品版は$79の有料とはいえ、ファンかなり多し。
トライアル版を使ってみて、気に入ったらぜひどうぞ。

--------------------------------
(※1)アドオン…ソフトウェアに追加される拡張機能のこと。
FireFoxは、ユーザーが好きなアドオンをインストールすることで、
自分仕様にカスタマイズをしてインターネットを楽しむことができるブラウザなのです。

message by INTERNET ACADEMY | 2009年12月16日 19:23 コメント (0)
2009
12.14

もっと楽しく色を配ろう。

webism091214.jpgデザインをしていて頭を悩まされることが多いのは、色。他は良くても配色がぴったりこなくて悩む…ということがよくあります。
受講生の方からも、「色をどうやって選んだらいいのか…」という質問を受けることもしばしばです。

しかし!色を選ぶのってもっと楽しいはず。
そこで、『Adobe Kuler』を今日はご紹介したいと思います。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

「Adobe Kuler」(アドビクーラー)は、グラフィックソフトの大御所、
Adobe Systemsが運営しているサイトです。

このサイトは、すごいです。
なんと、ユーザーが作った何千ものカラーテーマ(=色の組み合わせ)を閲覧できて、
さらに自分でオリジナルのカラーテーマを作成し、登録することもできるのです。

たとえば、上の画像。
こちらはKulerの中の「画像からテーマを作成する」という機能で、
カラー抽出ツールを使って、画像の中から採取した色を組み合わせて
カラーテーマを作成することができるのです。

カラーテーマが作れて、何がいいの?
と思うかもしれませんが、ここからがオドロキ。
作ったカラーテーマは、
Adobe Swatch Exchange(AES)という形式のファイルとしてダウンロードができます。

そして、このAESはPhotoshopやIllustratorなどのAdobe CS2以降の各バージョンソフトで
スウォッチ(色見本機能のことです)として取り込むことができるのです。
しかも、Photoshopにドラッグ&ドロップでAESファイルを放り込むだけで登録が可能。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

配色パターンが違うだけで、
Webサイトの雰囲気はいくらでも変化します。

Kulerはぜひ、ブックマークして使ってください。

message by INTERNET ACADEMY | 2009年12月14日 19:48 コメント (0)
2009
12.12

冬とお似合いのタータン。

webism091212.jpg冬本番の寒さが到来しました。
冬になると、コートやマフラー、雑貨まで、なんとなく気になるのが「タータンチェック」柄。ついつい買ってしまいます。

だからでしょうか、私の中で、冬を感じさせる模様だというイメージがあります。
今日は、そんな模様についてちょっと考えてみたいと思います。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

タータンチェックは、実は和製英語。
正しくは「タータン」もしくは「タータン・ブラッド」といいます。
(ゲール語ではbreacan(ブレアカン)です。)

もともとはスコットランドの高原ハイランド地方で織られた色物の格子柄、
またはその柄の綾織物を指し、民族衣装としても有名です。

実はタータンは、エンブレムと同様、氏族のみが使うことを許されている
一族の象徴としての模様だったとか。
日本の家紋に似ていますね。
そのため、伝統的なチェック柄のタータンを保護・展開する動きもあるそうです。

そんな歴史のある柄だからこそ、清廉さや、かっちり感を出したい時の
ファッションコーディネートとして使われることが多いのです。

では、この柄が冬に似合うのはなぜでしょうか?
これは私の憶測ですが、
タータンがもともと、紡毛か梳毛の毛織物であったこと、
生まれがスコットランドというところも起因しているのかもしれませんね。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

タータン、ストライプ、ポルカドット、ラティスパターン。
和柄なら、市松、雷門、唐草、矢絣(やがすり)、麻の葉。

デザインにおける模様の役割は大きく、
それだけで何らかの意味を与えることができます。
ただ、その模様が持つ歴史、意味、一般イメージを知らずに使ってしまうと、
違和感につながってしまいかねません。

色にも付随するイメージがありますが、模様にだってもちろんあります。
それを知っておくのも、大切なことですね。

message by INTERNET ACADEMY | 2009年12月12日 22:44 コメント (0)
2009
12.09

オシャレはfooterから。

webism091209.jpg「お洒落は足元から」と、よく言いますよね。

足元が汚かったらそれだけでイメージがダウンしてしまいますし、せっかく他のファッションのバランスが良くても、履いている靴のイメージがズレていると、強い違和感を感じるものです。

実は、それはWebデザインにも共通して言えること。


Webサイトの足元=フッター(footer)が良いか悪いかで、
そのサイトのデザインの質がずいぶんと変わります。
今日は、そんな”足元”のお話をします。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

フッターは、ワープロソフトで本文の下に位置する、
ページ情報などを記述するためのスペースのことを指します。
そして、Webサイトでも、ページ情報を記述する一番下の領域を「フッター」と呼びます。

フッターの作り方は多種多様ですが、
絶対にハズせないのが、「必ず何らかのフッターは設置する!」ということ。

何故ならフッターは、そのページを閲覧したユーザーにとってのゴールでもあります。
ページの情報をスクロールバーを下げながら閲覧していて、
最下部にたどり着いたとき、フッターがないと気持ちが悪いですよね?

フッターを見ることで、ユーザーはそのページの情報の末尾にきたことを実感し、
読み終わったという感傷に浸ることが出来るのです。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

また、最後に見るからこそ、デザインのクオリティは高くなければなりません。
「サイトの印象を強く植え付ける」ことを目的として、

………・・・………・・・………………・・・
・ロゴを改めて配置する
・フッターの色はメインカラーを使用する
………・・・………・・・………………・・・

…というのがセオリーですが、もちろんそれ以外の色でもバランスさえ良ければ問題ありません。
しかし、サイトイメージをひっくり返すような色だけは避けたいですね。

今年の頭によく言われたのが、
「海外のWebデザインはフッターを豪華にするのが2009年の流行になる」というものでした。
”豪華”というのは、よりグラフィカルにしたり、
ボリュームを増やしてスペースを大きくとる、ということです。

日本はまだそこまで波が来ていませんが、
フッターのリッチ化が進み、重要視される度合いも強くなったように思います。

ちなみに、リッチ化ってどんなの!?と気になる方はこちらのコンテンツをご覧下さい。

『40 Beautiful and Creative Website Footers』

海外サイトのリッチなフッターデザインを閲覧することができます。
ぜひ参考にしてみてください☆

message by INTERNET ACADEMY | 2009年12月09日 21:38 コメント (0)
2009
12.07

もしかしたらインフルエンサーかも。

webism091207.jpgみなさんは、誰かの影響を受けて何かを好きになった!なんていう経験がありませんか?

たとえばテレビで話題になっているから気になる、とか、自分の好きな芸能人がオススメしているから興味がわいた、なんていうのも良くあることではないでしょうか。

そんな、強い影響力を持つ人や物事を、「インフルエンサー」と呼びます。
influenceとは、「影響」という意味のイタリア語で、あの感染症「インフルエンザ」の語源でもあります。

今日は、そんな「インフルエンサー」のお話をしたいと思います。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

Webマーケティングにおいて、この「インフルエンサー」は
ブログやSNS(ソーシャル・ネットワーキング・サービス)、
コミュニティサイトなどで他のユーザーに対して影響力のある人物のことを指します。

情報が溢れている世の中、消費者にとって信頼でき、心動かされるのは
一方的なメッセージの「広告」ではなく、同じ消費者からの評判や口コミです。
(※口コミの大切さについては、以前の記事「気持ちがわかる、口コミ。」を参照。)

その口コミのスタートとなり、消費者に信頼される人物が「インフルエンサー」なのです。


マーケティング企業のブルーカレント・ジャパンは、
5人に1人は一定の情報発信力を持つ「個人インフルエンサー」であると定義しています。
また、個人インフルエンサーは

・コミュニケーション力
・信頼獲得力
・情報伝播力

…という3つの要素を全て備えた消費者だとも定義しています。
(インフルエンサー・マーケティングに興味がわいたら、
ブルーカレント・ジャパンサイト内のこちらのコンテンツがわかりやすくておススメです!)

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

テレビや新聞などを使って不特定多数の人に情報伝達を行う従来のあり方が「マス・コミュニケーション」ですが、
その逆が「インフルエンサー・マーケティング」。
一人ひとりの消費者の意見が、今の世の中に大きな影響を与えているのです。


Webの特性を掴み、インフルエンサーを操作せずにうまく活用する。
そんな力がある企業が、今後のビジネスの鍵を握るといっても過言ではありませんね。

常々、WebはWebサイトを作るだけじゃない、というところが面白いなーと思います。

message by INTERNET ACADEMY | 2009年12月07日 22:00 コメント (0)
2009
12.06

Webに季節感を!

webism091206.jpg冬の入り口はクリスマスが控えているからか、ワクワク感が街を染めていてそれだけで楽しい気分になってきます。
みなさんはいかがでしょうか?

実は、この「イベント」や「季節感」は、Webサイト制作やWebのキャンペーンを行う上でもとても大切な鍵だったりします。
今日は、そんなお話をしたいと思います。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

日本には、四季があります。
そして、日本人はイベントが大好き。

移ろいゆく季節を愛でる民族だからこそ、刹那的なモノに惹かれる傾向があるんでしょうね。
私も大好きです、季節のイベント。

だからこそ、広告に季節感を取り入れることはセオリーというより必須。

季節感のある広告にすることで、親近感や好印象を与えることができ、
ユーザーや消費者に「今しかない!」と思わせる効果があります。

お菓子や飲料なんかでも、「期間限定」「冬限定」なんてのも良く出ますよね。
(わかってても私はとてもその言葉に弱かったりします…)

いつでも買える、いつでも行動を起こせると思ったら、つい後回しにしてしまうのが人の性。
また、いつも同じじゃ飽きてしまうのも人の性。

それを、「今じゃなきゃダメ!」「今がチャンス!」と思わせることが
購買行動につなげる大切なポイントなのです。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

上記の話は、もちろんWebサイト制作にも共通することです。

たとえばサイト上のバナーや特設コンテンツ、
メールマガジンやアイキャッチ、リスティング広告に
いまひとつ効果が見られない…とか、更新がマンネリ化してきた!
という場合は、デザインやコピーに季節感を取り込んでみましょう。

ぐっと、訴求力が高まるはずです。

また、サイトデザインにおいて、雰囲気をより重視したい!という方も、
どこかのパーツに季節感を取り入れる手法もコツとして覚えておいて損はありません。

最近は、広告でも何でも
何ヶ月も先の季節やイベントを先取りしてキャンペーンが打たれていることが増えていますが…
それだけ季節感が重要だという表れなんでしょうね。

ぜひ皆さんもWebサイトの効果を高めるためにもうまく「季節」と「イベント」、取り入れてみてください。

message by INTERNET ACADEMY | 2009年12月06日 11:45 コメント (0)
2009
12.04

待たせないWebサイト。 ~後編~

webism091204.jpg前回は、Webサイトの表示速度は早ければ早いほうが良い、というお話をしました。

少なくとも目的をもって訪れたユーザーに対して、情報ではなくイライラを提供する、なんていう事態は避けたいものですね。

Webユーザビリティの第一人者、ヤコブ・ニールセンは自身のコラムAlertboxの中で次のように語っています。(⇒参考記事

………・・・………・・・………………・・・………・・・………………・・・………・・・………

ウェブページはスピードを第一にデザインすべきだ。
実際、デザイン評価よりもスピードを優先するべきなのである。
ページのサイズを抑えるには、グラフィックを最小限にし、マルチメディア効果は、
本当にそれがユーザの理解に資する場合に限って利用することだ。

Jakob Nielsen博士のAlertbox
………・・・………・・・………………・・・………・・・………………・・・………・・・………

”スピードを第一にデザインする”とはつまり、
画像をたくさん使うということが、必ずしも良いデザインにつながるわけではない、ということです。

無駄に画像やFlash技術などを多用することで、
独りよがりに”デザインに凝ったつもり”になっても何も意味がありません。

なぜなら、どれだけ見た目が良く、最新技術がふんだんに使われているサイトだったとしても、
あまりにも表示に時間がかかるのであればユーザーは二度と見てくれなくなってしまうからです。

Webデザイナーやコーダーは、まず表示にかかるスピードを第一に考えた上で、
見た目の美しさの再現がどこまでできるかが腕の見せ所なのです。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

画像を使わない代わりにどうするのか。
その問題を解決する手段の一つが、CSS3や前々回ご紹介したTypekitなのです。

いかにHTMLやCSSといった言語を使い、
画像を使わずテキストでデザインを再現できるかがポイントなのですね。

とはいってもサイトの表示にどれくらい時間がかかっているのかわからない…という方は、
ぜひ「ダウンロードTIMER」を使ってください。
回線速度別に、Webページが表示されるまでの時間を測定してくれます。

もちろん、ダウンロード時間の速い遅いの感覚は
ターゲットユーザーなど他の要因によっても若干変動しますから、
それを踏まえたうえで判断をすることも必要です。

ちなみに、インターネット・アカデミーのWebサイトはインストラクター陣で全て内部制作しているので、
作ったコンテンツの表示にかかる時間や、アニメーションの再生時間があまりにも長く、
ユーザビリティに反していると判断したら作り直しをしたりすることもあります。

実は地道に分析し、かなーりこだわって作っているのです♪

みなさんも、デザインにこだわればこそ、ぜひとも表示のスピードにもこだわってみてくださいね。

message by INTERNET ACADEMY | 2009年12月04日 14:20 コメント (0)
2009
12.03

待たせないWebサイト。 ~前編~

webism091203.jpgみなさんは、Webサイトが表示されるまでの待ち時間でイライラすることはありませんか?

インターネットが普及し始めたばかりのころ、Web業界では「8秒ルール」と言われていたものがありました。

「ユーザーがWebサイトを訪れてから、8秒以内にページを表示させなければならない」
というものです。


8秒以上待たせると、ユーザーは他のページへ移動(離脱)してしまい、
再訪してくれる可能性が低くなるから…というのがその理由でした。

しかしいまや当時とは状況が違います。
低速から高速へと通信回線状況が改善したことで、
8秒ではなく「3秒ルール」なんていう言葉も出てきたようです。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

いかにWebサイトを早く表示するかは、いくら通信回線が高速化しようとも
デザイナーにとって常に重大な課題です。

たとえば、ショッピングサイト最大手のAmazonいわく
0.1秒遅くなると、売り上げが1%減少する』そうですから大変な問題です。
Aberdeen Groupというリサーチ会社が出したレポートでは、
一般的に表示スピードが1秒遅くなると、PVは11%、CVは7%、顧客満足度は16%ダウンする(※1)』
…ということが判明しました。

まさしく「時は金なり」。

Webサイトの表示速度が遅い、というのは、
一般に考えられている認識や想像以上に大変で深刻な問題なのです。

Webユーザビリティの第一人者、ヤコブ・ニールセンは、
人間の反応時間について3つの重要限界、というものを示しています。

………・・・………・・・………………・・・………・・・………
・心理的・感情的な違和感を感じないのは0.1秒まで
・思考の流れが妨げられないのは1秒まで。1秒に近づくと、データを直接操作している感覚がなくなる。
・注意力を維持できる限界の時間は10秒まで。それを超えると心理的、感情的なストレスがかかる。
………・・・………・・・………………・・・………・・・………

これを見ると、8秒とか3秒とかいう話ではないと焦ってきます。


…対策を含め、次回へつづく。

------------------------------------
(※1)
PV(ページビュー)数 … ユーザーがWebページを閲覧した回数のこと。
CV(コンバージョン)数 …商用目的のWebサイト上で獲得できる最終的な成果のこと。
たとえば、ショッピングサイトにおける商品の購入や、ネットバンキングでの口座の開設など、それぞれサイトによって異なる。

message by INTERNET ACADEMY | 2009年12月03日 12:12 コメント (0)
2009
12.02

続・Webの文字革命。

webism091202_2.jpg以前、【webism】で「Webの文字革命。」という記事を掲載しました。

内容は、現在策定中のCSS3のWebフォント機能を使えば好きなフォントを画像ではなくテキストで表示することができる、というものです。

しかし、先月の11日、さらに衝撃的なサービスが始まっていました。
その名は「Typekit」。
これで、CSS3対応のブラウザの普及をまたずとも、好きなフォントをテキストとして自由に使用できるようになりました。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

「Typekit」は、なんとクラウドの仕組みを使用しているので
フォントデータをダウンロードをする必要がありません。

登録をしたら、一覧の中から自分の好きなフォントを選び、
たった2行のJavaScriptを Webページに埋め込むだけ。

契約のプランは無料のトライアルから有料のものまで様々です。

月間5000円ほどで、無制限で登録フォントが使用できるようですね。

フォントデータを用意し、Webフォントの設定をするよりは
ずっとずっと楽に好きなフォントをテキストデータで記述できます。

………・・・………・・・………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

今回の画像に使用させていただいたのがまさに「Typekit」のトップページなのですが、
アクセスしてみてきっと驚くはず。

前面に出ている大きな書体(この画像のものはBelloといいます)が画像ではなくテキストなので、
マウスカーソルで自由に選択が出来ます。

便利。
そして見た目がきれい!
しかもテキストだからSEOにも有利!!

まだ日本語のフォントがないことや、
サイトも英語のため、今は多少使いづらいかもしれません。
しかし、サイトの見出しに使用するだけでも十分利用価値がありますし、
Typekitの今後の動向はWeb業界で今とても注目を浴びています。

Webのデザインが、もっと広がる。
もっとビジネスに役立てるようになる。

数年後は、Webデザインの全てが、きっと今とはもっと違う状況になっているんでしょうね。

message by INTERNET ACADEMY | 2009年12月02日 20:12 コメント (0)
2009
12.01

好きなことを仕事にする。

webism091201.jpg街のイルミネーションが輝かしい12月になりましたね。いよいよ2009年も残すところあと1ヶ月です。

昨日、とあるスクール情報誌の撮影のために、卒業生の大島幸恵さんの職場へお邪魔してきました。大島さんは、今年の夏に正社員転職したばかりのWebマスター。
今回の取材の内容は、”「好き」を仕事にする転職に成功した方にそのノウハウを聞く!”というものです。

そんな「好きなことを仕事にした」方はたくさんいらっしゃいますが、
中でも大島さんは、ものづくりが好きな女性みんなが憧れるだろう。
そんな確信があって、今回の取材のお願いをしました。

………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

前職のお仕事はアパレルの販売。
当時ショップで扱っていたブランドのWebサイトを見て、
「こんなサイトを作ってみたい!」と思ったのがこの業界を目指したきっかけだそうです。

実際は転身することに不安もあったようですが、
周りの友人が「あってると思うよ」「やってみたら」と背中を押してくれたことも励みになって、
インターネット・アカデミーに通うことを決意してくださったとか。

今までの日常が変わることは誰だって不安ですが、
大島さんはむしろ「これが転機なんだ」と一歩踏み出したのです。

今は、ステキな靴のセレクトショップでWebマスターとしてお勤め。
ショップのWebサイト制作からネットショップの運営・更新まで何でもこなします。

前職と同じアパレル系の業界にお勤めではありながら、
いまや「Web」という手に職をつけて、イキイキしていた大島さん。(収入もUPしたとか…)

”接客は目の前のお客様のことを考えていましたが、
Webはまだ見ぬお客様のことを考えて作らなければならない。
それを考える楽しさを学んだ”

など、取材中は名言を連発してくださってました。

………・・・………・・・………・・・・‥…━━☆・‥…━━☆☆☆

私は過去にも卒業生の方々と何人もお会いしてきましたが、
全員に共通しているのは、

仕事が好きな人、自分の仕事に自信がある人は、他の人を元気づける力がある!

ということ。
大島さんからも、いっぱい元気をもらってきました。
アカデミーでWebを学んで、さらにもっと夢を持てる人が増えますように。
そんなことを願って、私達は今日も皆様をお待ちしています☆


------------------------------------
※大島さんがお勤めのショップ「minaminova」。
とてもステキなお店でオススメなのでぜひ行ってみてください!
また、インターネット・アカデミーの「2009雇用情勢」でも大島さんに取材のご協力をいただいております。

message by INTERNET ACADEMY | 2009年12月01日 20:54 コメント (0)

ブロガーのプロフィール

ささくらはなび
Webデザイン専門スクール講師。気ままにWeb世界を語ります。
twitter_bt_03.jpg

運営カンパニー

Webデザイン・Webデザイナー