Tweet

Pocket

みなさんこんにちは、mayukouです。
仕事でキュレーション風ニュースメディアのwordpress案件を担当していましたが、
その際、いろいろとつまづいたことがありました。
そのため、今後そういったメディアを作るときに参考になるようにメモしておこうと思います。

キュレーションメディアとは？

キュレーションメディアの有名どころといえば、Gunosy、SmartNews、MERY、iemoなどが挙げられます。
キュレーションメディアのきちんとした定義はないのですが、以下の特徴があるそうです。

つまり、サイトテーマに沿ったコンテンツの集合体のようなサイトのこととも表現できます。

デザイン面はシンプルイズベストがよい？

最近のキュレーションメディアの傾向は、コンテンツファーストなデザインが主流です。
コンテンツファーストについての記事はこちら
コンテンツが豊富な分、ページが重くならないようデザインや装飾は極力排除。
個性を出すためには、カラーを統一したり、ロゴデザインに個性を打ち出したり。
ゴテゴテしたくないので、カラーはあまり使わないほうが（あっても2、３色）、
シンプルでスッキリとして見えることがわかりました。
私の場合、２色に絞らず、カラフルなレインボーカラーを使ってみたところ、賑やか感は出ますが、
サイトの印象が弱くなる感じもしました。
とはいえシンプルデザインが多用されるキュレーションメディア界の中で
差別化を図るために、色をうまく多用するのも、ありかもしれません。
色使いに関しても、要検証です。

wordpressは総合的な知識が必要。でも調べることで力がつく

既存テーマをカスタマイズするのではなく、オリジナルテンプレートをゼロから作りました。
デザイン・コーディング・wordpress開発すべて担当しました。
wordpress歴は4年ほどの私ですが、
つまづく点がボロボロと出てきました。
プラグインばかりに頼って、サイト表示の自由さが失われてしまったり。
あと、やはり実際に記事を投稿しないと、
実際の挙動がわからなかったりします。

ローカル環境に同じブログが作れるプラグイン

ローカルに同じように記事を反映させたり、
ミラーサイトなどを作って、挙動を確認することをお勧めします。
その際に、便利なプラグインが「All in one Migration」です。

wordpressは調べつつ、共同制作者と知識を共有しつつがんばる。できるだけ独力で

会社内なのでwordpressの動きをチェックしてくれる方がいますので、
不具合があった場合もすぐに指摘してもらえますが、
調べるとなんとかなることが多いです。どうしてもわからない場合は、
会社の方にやってもらったりしましたが…
力をつけるには、独力必須です。
こういったコンテンツが大切なメディアは、実際にサイトを公開してからが本番で、
時間をかけて育てていくメディアだと思うので、最初からデザインに完璧を目指さなくてもいいのでは、とも思います。

HTML（フロントエンド）はXHTMLに。誰が見てもわかりやすいコードがベター

コードが理解しやすいXHTMLでコーディングしました。
また、SASSは使っていません。SASSを複数人で修正する際と、それなりの専門知識が必要になって混乱してしまうからです。
wordpressとsassの相性に関しては、こちらの記事をどうぞ。
使わない方が良い？WordPress 案件をsassでカスタマイズして思う３つのこと。

XHTMLコードであっても綺麗に書かないと共同で作る人に迷惑かけてしまいますので、気をつけたいと思います。

最後に

いかがでしたか？wordpressでつくるキュレーションサイトは、実際に記事を投稿してみないと、わからないことも多々ありました。
でも作ることで、必ず力になっています。先ほど述べたように、キュレーションメディアのようなブログは、育てるメディア。気づいたところは、どんどん意見を取り入れ、改善していけるといいでしょう。
また、次回サイトを作る時に、レベルアップしたサイトが作れるはずです。今後もがんばりましょうね！

投稿者プロフィール

mayukou

Webデザイナー修行中のmayukouです。webデザインのお仕事を始めてなんとか約６年が経ちました。とにかく技術を高めようと思っています。仕事で得た知識やお役立ち情報をご紹介いたします。宜しくお願いします。水彩画を勉強中です。趣味は音楽鑑賞（洋楽）、料理、読書、ブログです。
詳しくはこちら

最新の投稿

この著者の記事一覧

• 2019.07.27デザインお店の顔！仕事の幅も広がる私流ロゴデザインマニュアル
• 2018.11.10Photoshop画像からフォントを探してくれる！Photoshopのマッチフォントが素敵。
• 2018.09.02CSSフレームワークサイト制作が早くなる！Bootstrapの特徴
• 2018.08.04jQueryJQueryで要素を消すスクリプト！ECサイトの注意書きにもオススメ！