今回は最近クライアントのご要望の中でもよく聞く「1カラムデザイン」「メイン動画」「レスポンシブ」「メディア化」の4つのトレンドをピックアップしたいと思います。

これら4つのトレンドはweb業界全体を覆うトレンドとも言え、これから新規制作やリニューアルを進めるサイトにはこれらのトレンドを取り入れることも多いと思います。そこで各トレンドの背景にある流れと制作時に気をつけたいポイントをまとめてみました。依頼する側も受注する側も参考になればと思います。

1カラムデザイン｜【トレンドと制作のポイント】

■1カラムデザイントレンドの背景

少し前までは、1画面内にカラムを複数作りコンパクトに情報をまとめることが多かったサイトデザインですが、最近のトレンドではフォントやコンテンツブロックも大きくレイアウトした、いわゆる「Big UI」が多くのサイトで取り入れられています。1カラムにすることで動線を一本化できて、分かりやすいサイト構成にできるというメリットも大きいのでしょう。

1カラムデザインはモニターサイズが大きくなり、タッチパネル方式へモニターがシフトしたことも大きな要因として考えられます。つまりタッチパネルをフリックして縦スクロールする操作性の影響です。フラットデザインやパララックス効果、レスポンシブデザインとも相性がいいので、それらのベースとして1カラムデザインは今後も広まると思います。

■1カラムデザインの制作時に注意するところ

2カラムで制作するときと同じ感覚で構成すると密度が高くなってわかりにくくなり、1カラムデザインの特徴でもあるBig UIのバランスが悪くなります。また、フォントサイズも2カラムでは「13ピクセル」程度でいいのですが、1カラムになると少し物足りなさを感じるかもしれません。もう1サイズ大きめのフォントサイズを意識してもいいかと思います。

また1カラムというレイアウト上、2～3行のリード文はセンタリングすることが多くなります。そういった際は、1行あたりの文字数を合わせバラつきを抑えるとキレイにデザインできます。
1カラムで構成するということは、サイトの1つ1つのパーツが大きくなりますので、写真や素材のクオリティがこれまでにもまして求められることも注意点です。

メイン動画｜【トレンドと制作のポイント】

■メイン動画トレンドの背景

動画を使ったWebサイトをよく見るようになりましたね。文字や写真だけでは伝わらない製品の良さ、社内の雰囲気、スタッフの仲の良さなどを動画で紹介するのはとてもいいアイデアだと思います。
最近特にトレンドとなっているのが「メイン動画」です。メイン画像のコンテンツや背景として動画が再生され、そこから得られる雰囲気や情報は写真イメージよりも情報量が多いです。

こうしたメイン動画が普及している主な要因としては

• html5のvideoタグ
• モバイルのスペックが上がり動画「再生」環境が向上したこと
• 動画「撮影」機能の向上と低価格化
• 動画「編集」アプリなどの普及

があると思います。

先月、Facebook内での1日の動画再生回数が40億回を上回ったというニュースに注目が集まりました。こうした動画への需要の高さがうかがえるニュースではないでしょうか。

■メイン動画制作時に注意するところ

一番の注意点は、コンテンツとして「魅せる動画」と、背景として「流す動画」を切り分けて考えることです。メインイメージで背景として動画を「流す」場合、コンテンツのように主張の強い動画ではメインの背景として使いにくくなります。逆に作業風景などサラッとした軽い動画は「魅せる」コンテンツとして物足りなさを感じてしまいます。動画は制作する最初の段階でどんな感じで使いたいかを明確にしておきたいところです。

また動画のファイル容量が重すぎると読み込みに時間がかかってしまうのも基本的ではありますが見落としがちな注意点です。動画の内容は伝えたいことをコンパクトに作るように心がけましょう。

レスポンシブデザイン｜【トレンドと制作のポイント】

■レスポンシブデザイントレンドの背景

「スマホファースト！」――よく聞きます。クライアントからレスポンシブ対応の要望も多いですね。今年4月21日にgoogleの「モバイルフレンドリーアップデート」もあって、新規で制作するサイトのほとんどがスマホ対応サイトです。

日本で独自の発達を遂げたガラケーが駆逐される一方で、スマホやタブレット端末が市場シェアを伸ばし続けています。こうしたマルチデバイスに対応するレスポンシブデザインを採用したサイトは「対応していて当たり前」の水準になりつつあるようです。

また、レスポンシブデザインはメディアクエリーの実用化を受けて、もはやトレンドだけでなく王道になったと言ってもいいのではないでしょうか。

■レスポンシブデザインの制作時に注意するところ

レスポンシブデザインでのサイト構築には、ブレイクポイントの設定が重要です。厳密には「利用シーンを優先したアダプティブ」と「デバイスを優先したレスポンシブ」の2パターンに分かれるのですが、どこにブレイクポイントを設定するかをデザイナーとしっかり共有することが重要です。

つまりレスポンシブデザインの制作の現場において、これは「サイトをどれほどのデバイスの機種に対応させたいか？」を共通認識としてチーム内ですり合わせておくこと、と同義です。

メディア化｜【トレンドと制作のポイント】

■メディア化トレンドの背景

以前からいわゆる「メディア化」はサイトで結果を出す王道的な方法でしたが、小手先のSEO対策で効果があった時代はどこもかしこも小手先のテクニックに頼っていたと思います。

過去のSEO対策を積極的に取り組まれていたようなクライアントは、現在ではもれなくこの「メディア化」に取り組まれてるのではないでしょうか。しかしメディア化は過去のSEO対策と性質的な違いがあります。

メディア化は一朝一夕で結果が出にくく、また1つのパターンをひたすら複製するだけでは質のいいコンテンツになりません。そこがこのメディア化の難しいところでもあります。

■メディア制作時に注意するところ

まずはコンテンツ（記事）の質が何よりも重要です。しかしながら質を担保しながら継続的にコンテンツを更新するのは簡単なことではありません。従来のサイト運営の場合はサイト担当者を置くだけで良かったのですが、メディア化したサイトの場合は編集長というそのサイトを継続的に運営できる責任者が必要です。

また、メディア化にはコーディング面での基本的な構造も非常に重要です。メタキーワードやディスクリプションなどが各ページ個別に設定できることや、HTMLを構造化データにマークアップするなども重要なポイントになってきます。

またこうした記事数が溜まってくれば、ページ構成やレイアウトをブラッシュアップしてユーザーが見やすい配慮を加えていくことも重要です。

まとめ

サイトは本来的に企業イメージを高めたり、コンバージョンを改善する役目を担っています。そうしたWEBサイトにはその時々に応じたトレンドがあります。サイト訪問者の心をつかむためには、常に最新のトレンドを取り入れることも重要なのです。

少し以前だとフラットデザインがブームでシンプルなサイトが多かったのですが、最近では上に挙げたような「1カラムでのBig UI、メインには動画を入れて…」という「シンプルなだけでなく訴求力を高めた」デザインが多いと感じます。

スマホやタブレットの普及と共にWEBサイトの閲覧環境が大きく変わり、googleのアルゴリズムのアップデートによるWEBサイトに対する本質的な価値観が変わり、と外部環境の流れの中でWEBのトレンドが決まると言えるのかもしれません。

また、過剰な表現でインパクト重視のWEBサイトが消費者から倦厭（けんえん）され出し、ありのままの商品やサービスの紹介、企業の理念などが消費者に受け入れられる時代になってると感じます。

これは単に「流行り/廃り」の問題ではなく大きなトレンドの変化と言えそうです。サイトリニューアル時には、これらトレンドを検討してみてはいかがでしょうか？