週刊Webテク通信

2012年8月第2週号1位は、2012年のWebデザインのトレンド、気になるネタは、LPレコードをiPhoneに直接取り込める「iLP Turntable」発売

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2012年8月6日~2012年8月12日の間に見つけた記事のベスト5です。

1. Top 15 Web Design Trends of 2012http://smashinghub.com/top-15-web-design-trends-of-2012.htm

2012年のWebデザインのトレンドについてまとめています。

挙げられている15項目は以下の通りです。

  1. レスポンシブなユーザーインターフェイスデザイン
  2. スマートフォンとタッチスクリーンモバイルデバイス
  3. フリー素材
  4. HTML5&CSS3
  5. リボンとバナー
  6. 有料のWordPressテーマ
  7. オンラインマガジンの成功
  8. ドロップシャドウ
  9. タイポグラフィの新しいトレンド
  10. スライドショー
  11. ポップアップするボックス
  12. リスト
  13. 画像のサムネイル
  14. 巨大なアイコン
  15. ハイパーリンク

リスト、ハイパーリンクといった、従来からある当たり前の要素も入っていますが、重要な要素であることは変わらないことから取り上げられているようです。

図1 2012年のWebデザインのトレンド
図1 2012年のWebデザインのトレンド

2. Designing For Device Orientation: From Portrait To Landscape | Smashing UX Designhttp://uxdesign.smashingmagazine.com/2012/08/10/designing-device-orientation-portrait-landscape/

デバイスの画面が縦長か横長かを考慮したデザイン作成について考察しています。

縦横の回転に対応したデザインとしては、以下の種類があるとのことです。

FLUID
幅にフィットするように流動的に要素が可変する
EXTENDED
画面サイズに合わせて要素が追加されたり減らされたりする
COMPLEMENTARY
縦サイズで表が表示され、横にするとグラフに変わるなど、相互に補完する内容が表示される
CONTINUOUS
縦表示ではコントローラーで横表示にすると番組表が表示されるなど、別のインターフェイスに切り替わる
図2 デバイスの画面の向きに対応したデザインについて
図2 デバイスの画面の向きに対応したデザインについて

3. CSS Style Guides | CSS-Tricks http://css-tricks.com/css-style-guides/

有名サイトのCSSスタイルガイドをまとめて紹介したリンク集です。

ガイドへのリンクと、特徴的な部分の引用とが掲載されています。

図3 有名サイトのCSSスタイルガイド
図3 有名サイトのCSSスタイルガイド

4. Great Web Design Examples of Magazine and Newspaper Based Websites | Designs Madnesshttp://designsmadness.com/web-design/great-web-design-examples-of-magazine-and-newspaper-based-websites

雑誌や新聞のようなアプローチのWebサイトのショーケースです。要素が盛りだくさんのものからシンプルなものまで、バリエーション豊かなラインナップです。

図4 雑誌・新聞のスタイルを応用したWebデザインいろいろ
図4 雑誌・新聞のスタイルを応用したWebデザインいろいろ

5. 20 Beautiful and Creative Mobile Websites | UnderWorld Magazineshttp://www.underworldmagazines.com/20-beautiful-and-creative-mobile-websites/

モバイルサイトのデザインショーケースです。企業サイト、特にECサイトを中心として紹介しています。

図5 モバイルサイトのショーケース
図5 モバイルサイトのショーケース

そのほか、最近の記事の中から、レスポンシブWebデザインに関する記事を3つ紹介します。

先週の気になるWebサービス

Sellboxhttp://sellboxhq.com/

Sellboxは、Dropbox内のファイルを販売できるようにするサービスです。

Dropboxのアカウントで認証した後、販売したいDropbox上のファイルを選び値段を設定するだけと、簡単な作業でファイル販売が可能となります。

決済はPayPalを利用するようになっており、手数料は9%とのことです。依頼を受けて作ったデジタルデータを納品する際、このサービスを利用して代金回収するといった利用法もありそうですね。

また、Dropbox関連のサービスとして、site44というDropboxと連動したWebサイトホスティングサービスもあります。

5サイト以下で月100MBのデータ転送量なら無料で使え、月4.95ドルの有料版では50サイト/月40GBの転送料まで利用できるようです。

図6 Dropbox上のファイルを販売できるサービス
図6 Dropbox上のファイルを販売できるサービス

おすすめ記事

記事・ニュース一覧