Advertisement

designtrendsin2010

 

早いもので2010年を迎えてから1ヶ月が経過しようとしています。

ウェブデザインにおいても、CSS3やHTML5などの今までにない表現方法の充実によって、いろいろなプロジェクトやデザインが登場するのではないでしょうか。

 

 

今回は、そんな2010年に流行するであろうウェブデザインのトレンドをまとめた「Design Trends (Predictions) in 2010」をご紹介します。

 

 

2009年にいろいろなウェブサイトデザインに用いられた、手書き風デザインや大きな背景画像などは徐々に少なくなるであろうと予想しています。

また昨年に続き、ノイズなどを加えた繊細なテクスチャやセリフフォントなどの人気はこれからも期待でそうです。

 

 

トレンドを取り入れた具体的なウェブサイトデザインも一緒に紹介していますので、一度確認しておくと良いかもしれません。

 

 

 

詳細は以下から。

 

 

 

2010年のウェブデザイントレンド予想&具体例


 

 1. セリフフォント

ウェブサイトにおいて、昨年まではVerdalやArialといった、文字の端に飾りやハネなどのないサンセリフフォントが主流でした。

 今年からは、リーダーの目を惹きやすいセリフ系フォントが人気の兆しを見せています。

日本語においてはどのようになるのでしょう。楽しみです。

nytimes

New York Times

 

 

 

secondandpark

Second & Park

 

 

 

markdearman

Mark Dearman

 

 

 

2. 大きなヘッダーデザイン

ヘッダー部分に大きな見出しデザインを使ったサイトが増えそうです。

ウェブサイトを開いたときにまず最初に目に飛び込んでくる部分ですし、デザイン次第でオリジナリティにあふれるレイアウトに仕上げることができます。

ndesign

N.Design Studio

 

 

 

carsonified

Carsonfied

 

 

 

hugeinc

HUGE

 

 

 

3. ウェブフォントの利用

TypeKitなどがサービスを開始している「ウェブフォント」を使うことで、強調したい文章などのみ別のフォントを使ってディスプレイしたりすることができます。

日本語は英語に比べて文字数も多いのでロード時間などがかかりそうですが、どうなんでしょう。

ウェブフォントについてはフォントブログさんの説明がわかりやすいかもしれません。

elliotjaystocks

Elliot JayStocks

 

 

 

taptaptap

Tap Tap Tap

 

 

 

4. テクスチャを使った背景画像

背景に使われていた大きな画像などは徐々に少なくなり、細部にこだわった繊細なテクスチャを用いるウェブサイトが増えてきます。

特に「背景に粒状のざらざらテクスチャを使った、立体感のあるウェブサイトまとめ」で紹介したような軽くノイズの入ったデザインなどが人気高いようです。

neutroncreations

Neutron Creations

 

 

 

delibarapp

Delibar App

 

 

 

cogaoke

Cogaoke

 

 

 

5. ミニマリスト&グリッド

無駄を省いたシンプルなミニマルでざいんや、グリッド枠を使って整列させたウェブサイトはここ数年人気ですが、今年もその傾向は続くのではないでしょうか。

見やすくて、使いやすいデザインがやはり好まれますね。

informationarchitects

Information Architects

 

 

 

aentan

Aentan

 

 

 

6. CSS3

CSS3はまだすべてのブラウザに対応しているわけではありませんが、魅力的なテクニックがたくさん揃っています。

たとえば、角丸ボックス、マルチバックグラウンド、マルチコラムやアニメーションなど多くのデザイナーやディベロッパーの人がデザインに取り入れようと考えています。

neutroncreations-blog

Neutron Creations’ Blog

※ Mac ChromeかSafariでページを開くとアニメーション確認できます。

 

 

 

abduzeedo

Abduzeedo

※ 角丸ボックスの具体例となります。

 

 

 

adiirockstar

Adii RockStar

※ CSS3を使うことで型押し文字をデザインしています。

 

 

 

 

sambrown

Sam Brown

※ RGBAを用いた不透明な枠を使用しています。

 

 

 

7. モバイル対応デザイン

2007年にiPhoneが発売されて以来、モバイル向けウェブデザインの作成が活発になっています。

またGoogle携帯として有名なNexus Oneが全米で発売となったことも踏まえ、今後さらにデザイン性の高いモバイルサイトが登場するかもしれません。

mashable

Mashable

 

 

 

nikelab

NikeLab

 

 

 

いかがでしたでしょうか。

どれも無視することができないテクニックとなっていますので、次のウェブサイト制作の時に参考にしてみたらいかがでしょう。

 

 

 

参照元サイトにはこれらのほかにたくさんの具体例を示したウェブサイトがまとめられています。

よろしかったら、合わせてどうぞ。

また人気デザインブログColissさんも紹介していますので、そちらもどうぞ。

 

[参照元 : Design Trends (predictions) in 2010 – Web Design Wall]