週刊Webテク通信

2015年4月第1週号1位は、Webデザインのトレンドの有効性を考えるヒント、気になるネタは、子供の見守り「ドコッチサービス」4月4日開始

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

1. Trends vs. Value | Yesterdayisherehttp://yesterdayishere.com/now/trends-vs-value/

Webデザインで最近流行っている要素について、その有効性を考えて使いましょうという記事です。

以下のトレンドについて、本当にそれを使うことが有効かどうかを判断するヒントがまとめられています。

  1. カルーセル
  2. 固定ヘッダ
  3. フラットデザイン
  4. 視差効果
  5. 細い文字
  6. 画面いっぱいの写真と背景の動画
  7. スクロールのコントロールを奪う
  8. Webフォント
  9. 隠れたナビゲーションメニュー
図1 Webデザインのトレンドの有効性を考えるヒント
図1 Webデザインのトレンドの有効性を考えるヒント

2. 4 simple ways to design killer call to action buttons | Webdesigner Depothttp://www.webdesignerdepot.com/2015/03/4-simple-ways-to-design-killer-call-to-action-buttons/

ユーザーをうまく誘導するボタンをデザインするための、テクニックをまとめた記事です。

  1. 視線の移動を誘導する
  2. 最小限のシンプルなデザインのボタンにする
  3. 明確で最小限のテキスト
  4. 色のコントラスト
図2 ボタンデザインのテクニック
図2 ボタンデザインのテクニック

3. Analyzing the Explainer Video Trend in Web Designhttp://marketblog.envato.com/trends/explainer-video-trend-web-design/

Webデザインに動画を使うことが流行っていることを踏まえ、動画を使うときに気をつけることを解説しています。

また、動画をページに埋め込むときに使えるプレイヤーもいくつか紹介されていました。

図3 Webデザインにおける動画について
図3 Webデザインにおける動画について

4. Web Design Trend Showcase: Centrally Divided Layoutshttp://line25.com/articles/web-design-trend-showcase-centrally-divided-layouts

水平方向中心で二分割されたWebデザインのギャラリーです。

横幅の大きいPCサイズでは水平に2分割されていて、スマホサイズでは2つの要素がタテに並ぶというレスポンシブのパターンは作りやすそうですね。

図4 中心で2分割されたWebデザイン
図4 中心で2分割されたWebデザイン

5. 日本語Webフォントを使用している60のWebサイト | 株式会社シロクロhttp://www.4696.co.jp/blog/9/

日本語のWebフォントを使用しているサイトを大量にまとめています。

Webフォントを使っているということで、デザインにこだわっているサイトが多いようで、日本の優れたWebデザインの実例としても参考になりそうです。

図5 日本語Webフォントを使用しているサイトまとめ
図5 日本語Webフォントを使用しているサイトまとめ

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

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

はてなブックマーク10周年新機能「トピック」 - はてなブックマークhttp://b.hatena.ne.jp/10th/topic

「はてなブックマークトピック機能」は、はてなブックマーク10周年を記念した10の企画の第1弾として公開されたサービスです。はてなブックマークの「人気エントリー」の記事から、関連性の高い記事をまとめてトピックページが生成されています。

ひとつの話題に対して複数の記事を一覧でき、はてなブックマーク数から記事の人気度も分かります。また、いつどんな話題が流行ったのかをざっと振り返ることも可能です。

ところで、はてなブックマークですが、IT系に詳しくない人への認知度はかなり低いと思います。良いサービスなので、もっとスマホ世代の若者にも認知されるといいなと個人的には応援しています。

図6 はてなブックマーク10周年記念企画「トピック」
図6 はてなブックマーク10周年記念企画「トピック」

おすすめ記事

記事・ニュース一覧