太陽がまぶしかったから

C'etait a cause du soleil.

はてなブログで共同ブログを運営する際のウェブデザイン備忘録

f:id:bulldra:20150402204836j:plain

共同ブログ運営に向けたデザイン

 複数人のブロガー達が、毎回のお題に対して、自分なりの答えを書いていく期間限定のブログが立ち上がりました。企画を丸投げしつつ、デザインなどの足回りを担当したので、どんな感じで実装をしたのかについて解説していきます。

 はてなブログを用いて、共通のお題を複数人で執筆する形のブログを運営するのに適したウェブデザインを試行錯誤した時の備忘録って感じでしょうか。

テキストに集中できるデザイン

f:id:bulldra:20150402210208j:plain

 いくつかのコンセプトを混在させているのですが、まずはテキストだけを純粋に楽しめるミニマルなデザインにしました。『Medium』の影響を受けており、サイドバー、アイキャッチ画像、バナー広告、章分けなどの要素は出来るかぎりなくしています。メールマガジンのような気分で読んでもらえたら嬉しいです。

執筆者ごとに記事を独立させつつ全体でひとつの記事にもなる

f:id:bulldra:20150402210830j:plain

 個別の告知や編集を簡単にするためにも、執筆者ごとに記事を独立させてパーマリンクを設定するのは必須です。その一方で「お題」への全体観がなければ共同でやる意味が薄れてしまいます。「別に共同ブログでやる意味なくない?」となってしまうのは避けたいところです。

 この要件に対応するため、独自のページャーを設置して「ひとつの記事をページ分割している」という見え方をページ内に入れ込みました。また個々の記事には「執筆者」と「お題」をカテゴリとして設定しており、「特定の執筆者の記事だけを読みたい」「特定のお題の記事だけを読みたい」という用途に対応します。

ページ番号と記事アップロードは逆順にする

f:id:bulldra:20150402215757j:plain

 はてなブログのアーカイブ表示やRSSにおいては、投稿時間が新しい記事が前にくるため、ページ番号の順番で記事を更新していくと、逆順に表示されてしまいます。トップページを表示させた際に最終ページが表示されるのも望ましくないため、「4→3→2→1→目次」の順に更新日時を設定して予約投稿をしました。

 予約投稿時の告知は執筆者ごとのアカウントで行われると思っていたのですが、ブログに紐付いたアカウントで行われてしまうため、各執筆者には手動でシェアをしてもらう必要があります。このロゴは id:inujin さんが作成したものです。

「目次ページ」をページャーに組み込む

f:id:bulldra:20150402211807j:plain

 執筆者ごとに記事を独立させつつ全体でひとつの記事にもなるような構造にしているため、どのパーマリンクでシェアをしてもらうのかも重要となります。個別の記事も嬉しいのですが、まずは共同ブログとしての全体像が広まってほしいため、目次ページを用意してページャーに組み込むことで、企画全体のシェアや告知をしてもらいやすくしました。

 ひとつの記事が複数のページに分割されているWEBメディアにおいては「どのページでシェアされるか?」の導線をわかりやすくしないと、シェアされるパーマリンクが分散して良い結果にならない傾向があります。

著者プロフィール欄を記事下に用意する

f:id:bulldra:20150402214412j:plain

 共同ブログであるからこそ、「その記事を誰が書いたか?」も重要となってきます。「モーニング娘。」は「モーニングセットのように色々と付いてくる中の誰かを好きになれば、他のメンバーにも興味が湧いてくる」というコンセプトで運営されてきましたが、共同ブログを運営する意味合いもそういう所にあります。

 お題が気になって次のページに進んでもらっても、執筆者が気になって個々のブログに離脱してもらっても良いと考えています。

まとめ

 そんな感じで、はてなブログで共通のお題を複数人で執筆するブログを共同で運営するという要件において考えたことを書いてきました。まだまだ個々の記事で読んだ時に前提となる「お題」が分かりづらいや、離脱されやすいなどの反省点があるので、もう少し調整していければと思います。そんなわけで、期間限定の共同ブログをよろしくお願いします。

このブログは、それぞれ違う人生を歩き、違うことを考えてきた4人が、毎回のお題に対して、自分なりの答えを出そうと3ヵ月間だけ取り組むブログです。

はじめのお題は「インターネットとリアルの境界線」

関連記事