週刊Webテク通信

2013年12月第3週号 1位は，2013年のWebデザインのトレンド10個，気になるネタは，「ドコモメール」がiPhoneに対応 受信のリアルタイム通知も

Webテク, Webデザイン, Web広告, 視差スクロール, Webマガジン, iPhone, メール

この記事を読むのに必要な時間：およそ 2 分

ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から，Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は，2013年12月9日～12月15日の間に見つけた記事のベスト5です。

1. Top 10 Web Design Trends of 2013 | Skillcrushhttp://skillcrush.com/2013/12/10/top-10-web-design-trends-2013/

2013年のWebデザインのトレンドを10個紹介しています。

  1. 大きなテキスト
  2. インライン編集
  3. フルスクリーンのWebアプリ
  4. 左エリアのナビゲーション
  5. とても長ーいセールスページ
  6. 友達からのメールようなメールマガジン
  7. 視差効果
  8. モーダルウィンドウでのメールマガジンへのサインアップ
  9. GIFがハイブローに
  10. ブログの投稿／Facebookの更新情報／ツイートに見せかけた広告

友達からのものと見せかけた広告など，嫌な感じのトレンドについても取り上げられています。

図1　2013年のWebデザインのトレンド10個

図1　2013年のWebデザインのトレンド10個

2. What’s new for designers, December 2013 | Webdesigner Depothttp://www.webdesignerdepot.com/2013/12/whats-new-for-designers-december-2013/

Webデザインに役立つアプリやツール，素材などの新作を紹介しています。

レスポンシブなフロントエンドフレームワークのFoundationでおなじみZurbから，レスポンシブなHTMLメール用フレームワークが登場していました。

ほかにもマークダウンエディタやSVGアイコンなど興味深いものが揃っています。

図2　Webデザインに役立つアプリやツール，素材など

図2　Webデザインに役立つアプリやツール，素材など

3. White: Why to Use in Web Design? - MotoCMShttp://www.motocms.com/blog/project-news/white-use-in-web-design/

Webデザインに白色を使う理由を8つ解説しています。

  1. 明るい背景に暗い文字が目に心地いい
  2. 白はHTML，CSSでのデフォルトの色でそれには理由がある
  3. イメージは白地で効果的に見える
  4. 自然で文化的な配慮をしなくていい
  5. Webサイトは白の濃淡使いでエレガントに見える
  6. 白の濃淡は他のどの色の濃淡より優れている
  7. 白は乱雑さを軽減させる
  8. 白背景だとサイトに個性を持たせるのが簡単

図3　Webデザインに白色を使う理由

図3　Webデザインに白色を使う理由

4. 30 Beautiful Examples Of Parallax Scrolling Websiteshttp://www.inspireyourway.com/parallax-scrolling-sites-collection/

視差スクロールを使ったWebサイトのギャラリーです。

日本の東急エージェンシーのサイトも紹介されていました。

図4　視差スクロールを使ったWebサイトのギャラリー

図4　視差スクロールを使ったWebサイトのギャラリー

5. Using Square Blocks in Web Design - Designmodohttp://designmodo.com/square-blocks-design/

四角いブロックで区切られたWebデザインについて，その目的やコンテンツの整理の仕方などについて解説した記事です。

実例として紹介されているサイトもデザイン性に優れたものばかりです。

図5　四角いブロックで区切られたWebデザインについて

図5　四角いブロックで区切られたWebデザインについて

そのほか，最近の記事の中から，気になるニュース記事を3つ紹介します。

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

Digital Magazines That Work On Every Device - Beaconhttp://beacon.by/

BeaconはWebマガジンを簡単に作ることができるWebサービスです。月20ドルでいくつでも作ることができ，作ったWebマガジンを販売する場合は別途手数料などがかかるようです。

完成したWebマガジンのインターフェイスは，ページめくりボタンで見ていくか，クリックすると表示されるメニューから特定のページに移動するくらいのシンプルなものです。レスポンシブになっています。

大きな写真を背景に，ちょっとした文章を読ませるタイプのものに向いているようで，デザイン的には最近流行りの感じを取り入れているように感じました。

途中まで有料で，続きを読みたい場合には有料という仕組みが用意されているので，有料のWebマガジンのスタンドとして流行ってくると面白い存在になるかもしれません。

図6　簡単にWebマガジンを作れるサービス

図6　簡単にWebマガジンを作れるサービス

今週の気になるWebネタ

「ドコモメール」がiPhoneに対応 受信のリアルタイム通知も - ITmedia ニュースhttp://www.itmedia.co.jp/news/articles/1312/12/news096.html

ドコモメールがiPhoneに対応，IMAPに対応してパソコンなどでも利用可能になりました。どんなメールクライアントでも送受信できたら，もはやキャリアメールではない気もしますが，この方向性でいいのでしょう。専用サイトでWebメールとして使うときは，デコメ絵文字なども使えるようです。

iPhoneで受信のリアルタイム通知ができるということですが，プッシュ対応とは違うそうです。「⁠新着メールお知らせ設定」という設定をした場合に，メールが届いたことをSMSで通知するという機能とのこと。メールが届くとiPhoneに「新着メッセージがあります」という通知が来て，そのあとメールを見に行ってやっとで本文を読めるということです。

ちょっとややこしいですが，ソフトバンクもauもiPhoneでのキャリアメールの完全対応にはかなり時間がかかったようですし，まずは評価できる対応のようです。なんにせよ，ドコモでキャリアメールを使いたい人がiPhoneに換えても，なんとか使えそうな環境が整ってよかったですね。

Webテク, Webデザイン, Web広告, 視差スクロール, Webマガジン, iPhone, メール

著者プロフィール

芦之由（あしのよし）

Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター＆ライター。シャープMZ-80Bからのパソコンユーザーで，Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。

デイリーWebテクの購読やバックナンバーについては，以下の紹介サイトをご覧ください。

デイリーWebテク - Webテク関連の話題を毎日配信 -
URL：http://www.rgs680.com/dwt/