2020年トレンドのwebデザインのレイアウトとは?

men drawing sketch on white board about ui design website designWebsite / Design
Website / Design

昨今のwebデザインのレイアウトについて、Googleは「モバイルファースト」を強く推奨しているようです。
PCよりもスマートフォンのニーズが強まっている現況では当然の帰結ですが、この流れはGoogleが2015年4月より実装した
モバイルフレンドリーアルゴリズムによって加速した感があります。

2020年、webデザインレイアウトのトレンドはどうなっているのでしょうか。

2020年webデザインレイアウトの方向性とは

webデザインレイアウトのトレンドについては2019年と方向性は変わらないと思います。
スマートフォンに最適化したデザインレイアウトが基本となり、そこからどういった個性を出せるか。

ですので、最低限、レスポンシブwebデザインの導入はマストです。
モバイルフレンドリーアルゴリズムが導入されて、すでに数年経過しているのですが、いまだレスポンシブwebデザインでないwebサイトが散見されます。
未導入のサイト運営者は早急に対応しなければなりません。

それから具体的なデザインレイアウトについてですが、2019年にはフラットデザインがトレンドになっていました。
2020年も引き続きトレンドを形成していくと思われます。では、具体的にどのようなwebデザインレイアウトがトレンドとなるのか、いくつか挙げていきます。

ユーザビリティを考慮した「フラットデザイン2.0」

様々なデザインの要素

ここ数年、マルチデバイス時代に適したwebデザインということで「フラットデザイン」が流行っていました。
2019年はそのフラットデザインが進化した「フラットデザイン2.0」がトレンドでしたが、
2020年も引き続きこの流れを汲みそうです。

「フラットデザイン2.0」とは、従来のフラットデザインの「アイコンかボタンかが判別できない」といった
ユーザビリティ面での弊害を解消したセミフラットデザインと言えます。
ボタンにシャドーを入れたりアニメーション効果を入れたり、立体感・素材感を出してアイコンとの差別化を図っています。
フラットデザイン以前に部分的に戻ったとする向きもありますが、ユーザビリティの向上という面では進化ですので、
ユーザーにとっては歓迎すべき流れだと思います。

自由度・オリジナリティーを演出! 「ブロークンイングリットレイアウト」

レイアウトの演出

「ブロークングリッドレイアウト」もここ数年のトレンドで2020年も続くと思われます。
「ブロークングリッドレイアウト」とは、「イングリットレイアウトを崩す」、
つまり、グリッドによって整然としたレイアウトを、要素を重ねたりずらしたり、あえて崩すwebデザインのことです。
そうすることによってデザイン自由度が高まりますので、オリジナリティーの演出が可能になってきます。

フラットデザインと組み合わされたものもよく見られますが、フラッとデザインによる平面感に表情を付けることができますので、
今後はますます2つのデザインレイアウトは流行りそうです。

もっとも、やりすぎると、散漫な印象を与えかねないので、通常のグリットデザインとのバランスを取っていく必要はありそうです。
デザイナー、ディレクターの力量が問われるwebデザインレイアウトかもしれません。

スマートフォンでより映える?「タイポグラフィ」

タイポグラフィ

読者に何らかのメッセージを伝えたい場合のwebデザインとして、昔から用いられてきた手法に「タイポグラフィ」というものがあります。
「タイポグラフィ」とは、ひと言でいえば文字のデザインです。
なにか特別に伝えたいメッセージを、フォント・サイズ・色などによってひときわ目立たせるようにする手法のことです。

タイポグラフィの効果を理解するための事例として「apple」のwebサイトを挙げておきたいと思います。
「apple」の公式サイトに訪問すると、大きなサイズの文字がよく出てきますよね?非常に印象に残りませんか?

タイポグラフィは「apple」社がよく使う手法であり、2018年ごろから他のサイトでも「apple」社と同じような使われ方がなされてきましたが、
2020年も続くものと思われます。
参考: 「apple」社日本語webサイト

イメージ演出に最適!「イラストを用いたデザイン」

イラストを用いたデザイン

最近、イラストを多用したwebデザインのサイトをよく見かけませんか?
もちろん、イラストはオリジナルで、なんだかかわいらしくて親しみのあるものがほとんどです。
このイラストを用いたwebデザインは近年のトレンドになっていて、2020年も続きそうな気配です。

効果としては、やはりオリジナリティーが演出できますし、親しみやすいイメージの演出もできます。
このイラストのwebデザイン、「タイポグラフィ」と組み合わされることが良くあります。
イラストのイメージ演出とタイポグラフィのメッセージ性、この2つがシナジーとして際立たせる効果があります。
どのような演出をしたいかはイラスト次第になってきますが、非常に効果的な手法です。

まとめ

いかがでしょうか。
いずれもスマートフォン最適化を意識したwebデザインレイアウトであることがお分かりになったと思います。

トレンドはあくまでトレンドなので、時を経れば変わってきますが、方向性自体はまだまだ続きそうですね。
どのデザインレイアウトを取り入れるかはwebサイト運営者次第ですが、
ユーザーファーストの理念は忘れずに、過剰にならぬよう注意してください。

記事をシェアする
株式会社kurokawa&co.をフォローする
テジタルマーケティング/DXコンサルティング | K.K.kurokawa&co.