Yahooなどの大手ニュースサイトなどでも使用され、情報系ポータルサイトで人気のあるウェブレイアウトのひとつにマガジンスタイルがあります。
多くの情報をまとめて表示することで、ユーザーに閲覧するコンテンツの選択肢を広げることができ、アクセスアップにもつながります。
今回はそんなマガジンスタイルのウェブレイアウトにおける12のトレンド＆具体例をまとめた「Trends in News and Magazine-Style Web Design」がVandelay Design Blogで公開されていたので、ご紹介します。
ポータルサイトをデザインしようと考えている方は参考になるトレンドが見つかるかもしれません。
詳細は以下から。
白またはライトな背景色を使用しよう
情報コンテンツの豊富なマガジンスタイルのホームページに使用されている背景色は、可読性を考え、白やライトな色使いとなっています。
もちろん例外もありますが、大手サイトなどでは特にこの傾向が高いようです。
via True/Slant
グリッドを使用しよう
最近のニュースサイトのレイアウトはグリッドを使ったデザインが目立っています。
グリッドを使うことで等間隔に整列されたカラムを作成することができ、多くの情報をまとめて表示するときにも便利です。
via The New Yorker
タイポグラフィーをデザインとして使おう
ニュースサイトではたくさんのコンテンツでページを埋めなければいけません。
タイトルやテキストはもちろん、イメージ画像、ナビゲーションメニュー、広告枠などがレイアウトされており、どれもデザインよりも情報が重視されています。
Webフォントなどを使ってヘッドラインを表示するなどして、デザイン性のあるタイポグラフィーを使用したりしています。
日本語サイトではなかなかWebフォントの使用は難しいかもしれませんが、英語表記などには気を配りたいところです。
via The Morning News
サムネイル画像を使おう
多くのニュース、マガジンスタイルサイトでは、トップページからたくさんの記事やエントリー、コンテンツにリンクさせています。
ユーザーにとってわかりやすく情報を知るためにサムネイル画像を表示することで、アクセスアップにもつながります。
特に人気の高い記事や最新記事などによく使われています。
via UGSMAG
検索ボックスに気を配ろう
サイトに多くのコンテンツが掲載されている場合、検索ボックスはビジターにとって、探しているコンテンツを見つける強力な武器となります。
多くのニュースポータルサイトにおいて、ヘッダー部分など簡単に見つけることができる場所に検索ボックスはレイアウトされています。
使いやすさを考えたユーサビリティの面においても改善することができるでしょう。
via bmi Voyager
カテゴリー別のナビゲーションメニューを使おう
多くの情報を扱うポータルサイトには、ナビゲーションをメニューを利用することで論理的でシンプルにまとめることができます。
記事をカテゴリー別に分けることで、ビジターが探している情報をわかりやすく提供することができます。
via Dazed Digital
水平型のナビゲーションメニューを使おう
メニューバーのスタイルとしては、水平型ナビゲーションを使用しているサイトが多い傾向にあります。
垂直型ナビゲーションを使用しているサイトもありますが、数は限られているのが現状です。
via the Guardian
ドロップダウンメニューを使おう
水平型ドロップダウンメニューの多くはドロップダウンメニューを利用しており、ビジターに多くの選択肢を提供しています。
さまざまなカテゴリーの大量のコンテンツがある場合などは、特にビジターにもわかりやすく求めている情報にたどり着きやすくしています。
ビデオコンテンツを作ろう
最近では当たり前になっているYouTubeなどのビデオ動画などにリンクを貼ることで、ビデオコンテンツを提供してみるのもよいかもしれません。
通常トップページかサイドバーなどにコンテンツを作成している傾向が高いようです。
サイト滞在時間が長くなるというメリットもあります。
via People
人気エントリーを表示しよう
ビジターにとって人気エントリーを見つけやすくすることで、ユーサビリティの改善につながります。
多くのニュースサイトでは、サイドバーを中心にカテゴリー別の人気エントリーを表示しています。
日本の場合、はてなブックマークなどのソーシャルメディアで人気のエントリーを表示してもよいかもしれませんね。
via Inc.
ソーシャルメディアを活用しよう
ブログなどでも使われているtwitterなどのソーシャルネットワークを活用することで、さらに話題性のあるニュースサイトを作り上げることができます。
また独自に投票ボタンなどを設置しているケースも多く見かけます。
via GOOD
サイドバーは右側に設置しよう
左側に設置しているニュースポータルサイトももちろんありますが、多くの場合、トップページとコンテンツページの右側にレイアウトしている傾向が強いようです。
via Omid for Iran
マガジンスタイルの具体的サンプル
具体的にマガジンスタイルでレイアウトされているニュースサイトをまとめています。
デザインの際のアイデア参考に使ってみるとよいかもしれません。
参照元サイトにはこの他にもマガジンスタイルデザイン作成の参考になりそうな具体的サンプルがたくさんまとめられていますので、こちらもよろしかったら一緒にどうぞ。
[参照元 : Trends in News and Magazine-Style Web Design – Vandelay Design Blog]
