2010年、押さえておきたいウェブデザインのトレンド
Post on:2010年1月25日
CSS3やHTML5などをはじめ、トレンドのフォント、見出しのデザイン、クオリティをアップする背景など2010年に押さえておきたいウェブデザインのトレンドをWeb Designer Wallから紹介します。

Design Trends (Predictions) in 2010
下記は、各ポイントを意訳したものです。
元記事では、サンプルも豊富に掲載されています。
はじめに
2010年はウェブデザインが今まで以上に刺激的で試行錯誤に満ちたものになるかもしれません。
HTML5、そしてCSS3の魅力的な新機能をデザイナーとデベロッパーが巧みに取り入れようとしています。
去年からのトレンドだと、現在は手描き風や大きい背景は少なくなり、繊細なテクスチャやセリフフォントは引き続き人気が高いです。
そして、CSS3の登場でドロップシャドウや角丸、半透明などが簡単に利用できるようになりました。また、高機能なスマートフォンの登場はモバイルユーザーの想定を検討すべきです。
1. セリフフォント
昔のウェブデザインではVerdanaやArialなどのサンセリフフォントが主流でした。
しかし、これからはセリフフォントに注意を向けるべきです。


2. 大きい見出し
大きい見出しをヘッダのデザインに溶けこむように配置します。


3. 埋め込みフォント
ページ内の「ここ!」という箇所のフォントにクオリティの高いカスタムフォントを使用します。


4. 繊細なテクスチャ
大きい画像の背景は時代遅れになり、今では繊細なテクスチャが使用されるようになりました。
特にちょっとノイズがはいってるものが好まれています。


5. ミニマリストとグリッド
ミニマリストとグリッドは決して新しいものではありません。しかしながら、この二つを組み合わせたものは非常に人気が高いものとなっています。


6. CSS3
CSS3はまだ全てのブラウザに対応しているものではありませんが、角丸、マルチバックグランド、マルチカラム、アニメーション、ボーダーイメージなど魅力的なものがたくさんあります。

Neutron Creations
CSS3 Animation

Adii Rockstar
Text Shadow

24 ways
RBGA & Opacity
7. モバイル対応
2007年にiPhoneがリリースされてから、モバイル用のデザインが盛んになりました。CSSとJavaScriptもフルサポートされ、ウェブデザインからはずせないものとなっています。


sponsors