モバイルオンリーの情報戦略を考える(2) - デザインってオモシロイ -MdN Design Interactive-
デザインってオモシロイ MdN Design Interactive

モバイルオンリーの情報戦略を考える(2)

  • 新規会員登録
  • ログイン管理
  • Twitter
  • facebook
  • はてなブックマーク
  • RSS

2026.5.14 THU

  • TOP
  • 特集
  • 連載
    • ALL
    • デザイン・アート
    • テクノロジー
    • コラム
    • インタビュー
    • レポート
    • インサイト
  • Tech
    • ALL
    • プログラミング
    • UI/UX
    • フレームワーク
    • Webアプリ
    • Webサービス
    • その他
  • ニュース
    • ALL
    • ニュース
    • 新製品
    • テクノロジー
    • アートイベント
    • モバイル
    • ネットで話題
新規会員登録
ログイン管理
  • プレスリリース
  • メルマガの登録・解除
  • プライバシーポリシー
  • 特定商取引法
  • 利用規約
  • お問合せ
  • 広告掲載について
  • インプレスグループ
閉じる
  • TOP
  • ニュース -
  • モバイルオンリーの情報戦略を考える(2)
【サイトリニューアル!】新サイトはこちら/MdNについて
  • ALL
  • ニュース
  • 新製品
  • テクノロジー
  • アートイベント
  • モバイル
  • ネットで話題

コラム

2014.7.28 MON

モバイルオンリーの情報戦略を考える(2)

モバイルオンリーの情報戦略を考える(2)

2014年07月28日
TEXT:小川 浩(シリアルアントレプレナー)


前回の記事はこちら>モバイルオンリーの情報戦略を考える(1)

僕が考えた、モバイルオンリー向けの情報デザインのサンプルを用意した。まずはこちらのサイトをご覧いただきたい。

■起業家たちの肖像
http://entrepreneurs.dino.vc/

まず、レスポンシブWebデザインは外せない。レスポンシブWebデザインとは、どんなデバイスの画面サイズでも最適な閲覧を実現する手法だ。これにより、PC・モバイルあらゆる環境で快適に情報取得ができる。

さらに、タブレットやスマートフォンのように狭い画面では、立体感のあるデザインはうるさく感じるので、フラットデザインを採用している。フラットデザインではグリッドを意識し、カラフルな単色とタイポグラフィを用いるのが通常だが、ここではあえて色を徹底的に使わず、画像を中心にしている。

画像を中心とするため、グリッドをさらに進めたタイルデザインと呼ばれる画像を矩形に並べ、タイトルやテキストをその上に浮かして表示する手法にした。代表的なWebサイトとしては、米Yahoo!のYahoo! Food(https://www.yahoo.com/food)がある。

これらフラットデザインやグリッドデザイン、さらにタイルデザインなどの潮流は、Pinterestの成功やWindows 8が採用したことで世界的に広まったといえるだろう。

そして、個々のコンテンツをクリックすると情報が展開するが、ここはすべてシングルカラムによる表示としている。大方のPCが横長の画面であったために、これまで多くのWebサイトがマルチカラムでより多くの情報を一覧させようとしてきた。しかし、モバイルオンリー世代には、縦長のスマートフォン画面のほうが慣れており、その感覚に合わせるにはシングルカラムのほうが好ましいのだ。

また、今回のサンプルサイトのように、画像を画面いっぱいに広げるインパクト勝負のつくりも増えている。これは、Twitter共同創業者のエヴァン・ウイリアムズがつくった新プロジェクトMedium.comでも採用されている方法だ。

ページ下には大きめのソーシャルボタンを配置している。これはバズフィードなどのバイラルメディアや、ハフィントンポストで採用されている。現代のメディアの多くはSEOよりSMO(ソーシャルメディア最適化。僕は一歩進めてソーシャル・モバイル最適化とよんでいる)を考慮しているからだ。

最近「メディアのフロントページはSNSだ」という言葉が流行している。意味するところは、メディアのフロントページに訪れる人は少なく、まずソーシャルメディア上で拡散された個々の記事をクリックすることでやってくる。だからこそ、拡散を促進するためのソーシャルボタンは目立たせる必要があるし、開かれたページにインパクトをもたせることは重要なのだ。

このような手法を用いて作成したサンプルサイト(http://entrepreneurs.dino.vc/)について、もしご意見があれば、http://entrepreneurs.dino.vc/wf/_contactもしくはFacebookページ(https://www.facebook.com/entrepreneurs.dino)からいただければ幸いだ。

起業家たちの肖像  http://entrepreneurs.dino.vc/
起業家たちの肖像
http://entrepreneurs.dino.vc/




■著者の最近の記事
モバイルオンリーの情報戦略を考える(1)
モバイルオンリー世代には「PCサイト≒ブラウン管TV」?
プラティシャーというムーブメントの本質
SEOに代わるSVOの時代(後編)
SEOに代わるSVOの時代(前編)
テスラに見るオープンソース時代のマーケティング
非シリコンバレーのスタートアップについて考えてみた
エディトリアルデザインの時代、再び



小川浩氏近影

[筆者プロフィール]
おがわ・ひろ●シリアルアントレプレナー。著書に『ビジネスブログブック』シリーズ(毎日コミュニケーションズ)、『Web2.0BOOK』(インプレス)、『仕事で使える!「Twitter」超入門』(青春出版社)、『ソーシャルメディアマーケティング』(ソフトバンククリエイティブ/共著)などがある。
twitter:http://www.twitter.com/ogawakazuhiro
facebook:http://www.facebook.com/ogawakazuhiro

twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちら/MdNについて

前の記事を読む

「怒ってなどいない!! 」怒り顔の猫・小雪 フォトコラム Day 32

「怒ってなどいない!! 」怒り顔の猫・小雪 フォトコラム Day 32

2014.7.25 FRI

次の記事を読む

MdN Design Interactive週間ランキング(7/20~7/26)

MdN Design Interactive週間ランキング(7/20~7/26)

2014.7.29 TUE

アクセスランキング

8.30-9.5

  • 携帯大手3社、メッセージアプリ「+メッセージ」を各社全ブランドとMVNOに拡大
  • テレビの音声をワイヤレス化して飛ばせる「トランスミッター」発売、サンワサプライから
  • iPhone 12/iPhone 12 Proに音の不具合、対象モデルは無償修理へ
  • ビクトリノックス、30色バリエーションのマルチツール「クラシック カラーズ」を発売
  • 今月発表のiPhone13、低軌道衛星通信を使い“圏外”でもテキスト送信などが可能か
MdN BOOKS|デザインの本

Pick upコンテンツ

現在

  • 【文房具連載】第19回 五十嵐製紙「Food Paper」/物語のある、ニューフェイスな文房具・雑貨
  • 見た目のかわいさだけじゃない、犬の形をした実用性の高いウェブカメラ
  • この秋に発表予定のiPhone 13(仮称)はどのような変貌を遂げるのか?
  • 植物性由来100%、合成香料不使用など、エコな洗濯洗剤5選/ライフスタイル連載・こんげつのきぶん
  • 【DESIGN DIGEST】書籍カバー『顔のない花嫁/K.R.アレグザンダー』、商品パッケージ『秋の限定商品/アフタヌーンティー・ティールーム』

MdN公式Instagram

Instagramでは、デザイン関連本や本に関連した参加型コンテストについて発信しています。

page top
MdN
impress
  • メルマガの登録・解除
  • プライバシーポリシー
  • 特定商取引法
  • 利用規約
  • お問合せ
  • 会社概要
  • インプレスグループ
  • 広告掲載について
  • MdN デザインの本
  • MdN新書 新ジャーナリズム宣言。
  • “静寂”文具サイト
  • MdN DESIGNFONT STORE

Copyright © MdN Corporation,
an Impress Group company. All rights reserved.

page top
MdN
impress
  • メルマガの登録・解除
  • プライバシーポリシー
  • 特定商取引法
  • 利用規約
  • お問合せ
  • 会社概要
  • 広告掲載について
  • インプレスグループ
  • MdN デザインの本
  • MdN新書 新ジャーナリズム宣言。
  • “静寂”文具サイト
  • MdN DESIGNFONT STORE

Copyright © MdN Corporation,
an Impress Group company. All rights reserved.