ワシントンポストの新しいウェブサイト：印刷に触発された階層

他の

間違いなく、印刷された新聞ページの最も魅力的な機能の1つは、表示するコンテンツの階層をどのように表示できるかということです。編集者とデザイナーが協力してコンテンツの優先順位を設定する場合、タイポグラフィ、要素のサイズ設定、配置を組み合わせて、読者に最も重要なストーリーと、それらのランクと重要性を示すことができます。それが続きます。

たとえば、適切に設計されたフロントページには、ページの入り口となる視覚的影響の中心（CVI）が表示されます。それは私が書いた私自身の本ContemporaryNewspaperDesign（Prentice-Hall、1981）の目玉でした。

「デザイナーは、読者がページ上で視覚的に進む方法を制御します。ページデザインの基本的なルールの1つは、読者に即座に魅力を与えることです。 CVIは、読者の注意を一目で示すのに十分な関心または魅力を生み出す必要があります。」

これは、1980年代の独自のPoynter EyeTrack調査で検証されました。この調査では、読者の大多数の目が写真またはページの最大要素である見出しを介してページに入りました。

プラットフォーム間で情報を提示する必要があるため、一目でわかる視覚的な誘惑はさらに重要です。一部のプラットフォームでは、階層の作成がより困難になる非常に小さな画面が表示されます。

ワシントンポストで

ワシントンポストは、5月に開始された一連のテストに続いて、待望の新しいWebサイトの展開を開始しました。

WashingtonPost.comホームページのスクリーンショット。

私は新しいものを見てきました Washingtonpost.com そして、2つの点が際立っています。それは、そのクリーンでミニマリストなアプローチと、階層が果たす重要でより大きな役割です。それはまるで、WaPoデジタルチームがニュースが印刷物でどのように提示されるかに触発され、オンライン版を通じてそれを敬礼することを決定したかのようです。

Postの上品なフォントであるPostoniは、最初から慣れ親しんだ領域に私たちを配置するのに役立ちます。

ホームページから始めて、トップで注目を集めるために競うストーリーは少なくなります（約4つだけです）。ストーリーの数が少ないことは、これらが現時点で知っておくべきトップピックであることをすぐに伝えます。読者はキュレーションを高く評価しています。キュレーションは、結局のところ、コンテンツ選択の階層の形式です。

これらの記事の見出しのサイズが、それよりも少し変化することを願っています。見出しのサイズのバリエーションは、重要性を示す最も効果的な方法の1つであり、印刷編集者やデザイナーが常に活用してきました。新しいwapo.comでは、リードピースとセカンダリピースの間にごくわずかな違いしかありません。

ただし、真の優先順位は、ナビゲーションの表示方法にあります。新しいwapo.comの上部には、政治、スポーツ、ライフスタイルなどの従来の水平ナビゲーションバーがあります。しかし、私が最も気に入ったのは、その日の特定のストーリーを含む最も直接的なニュースナビゲーションバーです：ドナルドトランプ、レッドスキンズクォーターバック、教皇フランシスコ。 「ファッションポリス」。

ページを下にスクロールすると、階層も重要な役割を果たします。意見、その他のトップストーリー、ビジュアルストーリーなど、さまざまなセクションにコンテンツが表示されます。

記事のページは、私たち全員が同意する点ですが、ソーシャルメディアからのリンクを介して多くの読者が最初にアクセスする場所でもあり、クリーンでわかりやすいですが、テキストの右側の列にストーリーの強力なサンプルがあります。これは、編集者とデザイナーが読者に伝えている方法です。あなたが私たちに加わったばかりであることを私たちは知っているので、今日あなたが楽しむかもしれない他のいくつかの物語があります。

ポストのCoryHaikとJuliaBeizerとの会話

モバイル製品のディレクターであるPostのJuliaBeizerと、EmergingNewsProductsのエグゼクティブディレクターであるCoryHaikにミニインタビューを行いました。

ワシントンポストのモバイルセレンディピティデザインのスクリーンショットビュー。

昨年5月、PostはTeamRainbowによって作成されたWebサイトとモバイルサイトの2つのバージョンをテストする予定でした。セレンディピティという言葉は、新しい要素の1つとして言及されました。

ジュリア ：セレンディピティは、エンゲージメントを成功させるための重要な推進力であると考えています。ウェブ全体で、ニュース組織とテクノロジー企業は同様に、読者を彼らが好むかもしれないより多くのコンテンツに移動させる方法を夢見ようとしています。

Postは、編集制作、ビッグデータのパーソナライズなどの技術の進歩などを通じて、この分野で継続的に実験を行っています。RainbowWebはこれらの実験の1つです。私たちは私たちを導くためにセレンディピティのレンズを使用することを選びました。何年にもわたって印刷物で作成してきたような意図的なセレンディピティを紹介するために、どのような新しいユーザーエクスペリエンスを作成できますか？

では、ニュースバンドルの概念はどのように機能しましたか？

コーリー ：新聞用紙は死んでいます、長生きする新聞用紙！私たちはバンドルを完全に受け入れます。新聞は毎日玄関先に巻かれたオリジナルの「束」だったので、私たちはいつも持っています。これは、特にセレンディピティに非常に効果的であると私たちが考える製品です。非常に率直に言って、簡単に利用できる、閲覧性と拡張性。 Webは、ナビゲーションと完全な読書体験の観点から、西部開拓時代になる可能性があります。公平を期すために、この紙は100年以上にわたって完成された製品です。そこで、このバンドルコンセプトを採用し、それをWebに適用して、ユーザーが簡単に閲覧できるように、より完全な読書体験を作成したいと考えました。そして、それは機能しています！ユーザーはより長く滞在し、訪問ごとにより多くの記事を読んでいます。また、コンテンツのプログラミング方法は、他の方法では遭遇しなかったかもしれない興味深いストーリーに人々が到達するのに役立つと考えています。確かに、これは実験ですが、私たちが満足し、新しい方法で前進しているものです。私たちの今後の焦点は、レインボースイートで行っている豊富なニュースデザインをワシントンポストのより多くのコーナーにもたらす方法を見つけることです。」

どのモデルを採用しましたか？

ジュリア ：これは、RainbowWebの最初のA-Bテストでした。読者が覗き見を好むことがすぐにわかりました。そのバージョンではバウンス率が低く、費やした時間が長くなりました。モバイルウェブ上のRainbowのコアUXパラダイムとしてピンチをすぐに採用しました。それは私たちにとって効果的でした。モバイルRainbowWebでのページビューの14％は、右側の小さな記事をタップしたユーザーによるものです。カッコいい。他の場所にはないエンゲージメントです。

デスクトップでは、依然としてピンチパラダイムを使用していますが、より大きな画面サイズに最適化するために、過去数か月にわたってそれを繰り返してきました。添付のようなナビゲーションパラダイムをテストし、デスクトップ/タブレットWebのナビゲーション要素としてFirstReadsと呼ばれる視覚的に駆動されるニュースレターを取り込みました。これがエンゲージメントの促進に役立つと期待していましたが、実際には反対のことがわかりました。読者はこのレールを使用するよりもピンチビューで閲覧する可能性が高かったため、このコンテンツをハンバーガーメニューに追加しました。」

私たちのデジタル活動に移行する価値のある印刷物の品質に敬意を表して前進しているこの新世代のニュースオンライン版を見るのは満足のいくものです。

これらはまた、私たちに役立ってきた良いニュースデザインの原則であり、そうし続けるべきです。

1. ページまたは画面への入り口となる明確な視覚的影響の中心を確立します。
2. 写真/見出しのサイズを使用して、読者を最も重要なものから最も重要でないものへと導きます。
3. 目がローミングするためのクリーンな環境を提供し、雑然とした混雑を避けます（これは、内部の空白が適切であることが違いを生む場所です！）。
4. 重要度に応じてコンテンツに優先順位を付け、今日の情報の消費方法の鍵となるキュレーションの感覚を提供します。

ワシントンポストはそれを正しくやっています。これは、オンライン版の変更を検討している人のモデルとして役立つはずです。