新聞・雑誌風レイアウトでみかけるウェブデザインの12のトレンド

新聞・雑誌風レイアウトのニュース系ウェブサイトでみかける特徴的な12のトレンドをVandelay Designから紹介します。

サイトのキャプチャ

Trends in News and Magazine-Style Web Design

1. ホワイト(明るい)背景

新聞・雑誌風レイアウトのサイトではコンテンツの比重が高く、ホワイトか明るい背景にする傾向があります。それは一般的にリーダビリティのために良いことです。
もちろん、例外もあります。しかし、メジャーなニュース系ウェブサイトではほとんどがホワイトの背景を使用しています。

サイトのキャプチャ

True/Slant

2. グリッドベース

新聞・雑誌風レイアウトのサイトのレイアウトには、グリッドベースのレイアウトが採用されています。多くのコラムやテキストが配置されるため、グリッドはこういったタイプに非常に効果的です。
グリッドはコンテンツを適度なスペースで配置し、より読みやすく提供できます。

サイトのキャプチャ

The New Yorker

3. デザインエレメントとしてのタイポグラフィ

新聞・雑誌風レイアウトのサイトではページに多くのコンテンツを配置しなければなりません。テキストと見出し、画像、ナビゲーション、広告などがあります。
これらをグリッドで配置する際は、タイポグラフィが重要なデザインエレメントとして活躍します。

サイトのキャプチャ

The Morning News

4. サムネイル画像

新聞・雑誌風レイアウトのサイトでは、記事やポストなどに多くのリンクを含んでいます。特に主要なものにはサムネイル画像を使用することはごく当たり前のことです。

サイトのキャプチャ

UGSMAG

5. サイト内検索

ビジターがサイト内の記事を探す際、サイト内検索は非常に役立つ機能です。たいていのサイトではサイト内検索は目立つ場所に配置されています。多くの場合はページの最上部です。
サイト内検索は、簡単に見つけられる場所に配置し、正確な結果を提供できるようにします。

サイトのキャプチャ

Voyager

6. カテゴリベースのナビゲーション

多くのコンテンツがあるサイトでは、論理的でシンプルなナビゲーションを配置することが必要です。たいていのサイトではコンテンツを分類し、ユーザーにカテゴリベースのナビゲーションを提供することで、探しているものを見つけ出せるようになります。

サイトのキャプチャ

Dazed Digital

7. 水平型のナビゲーション

水平型のナビゲーションはさまざまなサイトで利用されていますが、ニュース系ウェブサイトでは特に顕著です。
垂直型のナビゲーションはセカンダリナビゲーションのために使用します。ほとんどのサイトでは垂直型はプライマリナビゲーションとしては使用していません。

サイトのキャプチャ

guardian.co.uk

8. ドロップダウン

水平型のナビゲーションには、ユーザーに多くの情報を提供するために拡張型のメガドロップダウンを使用しています。
主要カテゴリだけでなく、サブカテゴリも見せることが可能です。このタイプはユーザーが簡単に利用できるように設計してください。

サイトのキャプチャ

New York Magazine

9. ビデオコンテンツ

最近になって多くのサイトでビデオコンテンツが増えてきました。フロントページやサイドバーにビデオは配置したセクションが含まれます。

サイトのキャプチャ

People.com

10. 人気があるコンテンツ

ユーザーに人気のあるコンテンツへのリンクをまとめるのは、ユーザーが何かを見つけるためにユーザビリティの非常に重要な部分です。このコンテンツはサイドバーによく配置されています。

サイトのキャプチャ

Inc.

11. ソーシャルメディア

ブログにも多く利用されているソーシャルメディアのインテグレーションを配置します。ボタンの投票型コンテンツ、Twitter、Facebookなどがよく掲載されています。

サイトのキャプチャ

GOOD

12. 右側のサイドバー

いくつかのサイトではサイドバーを左側に配置しますが、多くのサイトでは右側にサイドバーを配置します。このレイアウトはフロントページをはじめ、コンテンツページに利用されています。

サイトのキャプチャ

Omid for Iran

ショーケース

元記事では、多くのショーケースが紹介されています。

Trends in News and Magazine-Style Web Design

sponsors

top of page

©2018 coliss