« ブログのトップページに戻る

押さえておきたい! WEBデザイントレンド7選

   投稿者 : 2018年5月24日 By

イメージ画像

5月18日、JECCICA(ジャパンEコマースコンサルタント協会)主催の「ECデザイン大賞2018」が開催され、大賞他各受賞者、WEBサイトが発表された。
ダイヤモンド賞(大賞)を獲得した達磨正宗のWEBサイトはワンカラムで、商品ページに特徴があり、写真、動画、キャッチコピーなど、クォリティが高い内容だった。
「ECデザイン大賞2018」では、ただ売るだけではないECサイトが評価され、大賞を受賞したようだ。 WEBサイトデザインは分かりやすく使いやすく、美しいデザインであるべきである。 昨年はグラデーションやスプリットスクリーンレイアウトなど、モダンデザインがトレンドだったようだ。
今年は何がトレンドとなるのだろうか?今回は2018年流行するだろうWEBデザインを見ていこう。

●01.基本はモバイルファースト

Googleはモバイルフレンドリーを重要視している。スマートフォンに対応したデザインを行っていないと評価が下がるのである。 なぜなら、インターネット・トラフィックの4分の3はモバイル端末からのアクセスだからである。
この事実を考えると、モバイルファーストでデザインすることは至極当然と言えよう。 これまでのデザインは、まずPCサイトのデザインを行ってから、モバイル用のデザインを作るという方法だった。しかし、モバイルファーストデザインではまず、モバイル用のデザインを行い、その後、PC用のデザインを作るという考え方である。

モバイルファースト

 

●02.大画面の中心にタイポグラフィをレイアウト

高画質なビジュアルを全体に配し、中央に大きなタイポグラフィで印象的に見せる大胆なデザインのサイトを良く見かけるようになった。
タイポグラフィサイズもより大きくなり、中央に印象的に配したもの、ビジュアルにタイポグラフィが少しかかるようにしたものなど、高品質なビジュアル一枚とタイポグラフィで魅せるデザインが今年も流行りそうだ。
Appleのサイトデザインは以前からこのデザインスタイルを採用している。製品の良さ、クオリティがユーザーに端的に伝わるデザインだ。

design01

URL:https://funplex.co.jp/

 

●03.鮮やかなグラデーションは、まだまだ、活用されている

昨年から引き続き、グラデーションを取り入れたサイトデザインは増えているようだ。 色も鮮やかなサイトが多くなったように感じる。文字にマスクをかけて文字にグラデーションを行ったりと、カラフルなグラデーション表現はがユーザーを惹きつけるには有効だろう。
グラデーションデザインはフラットデザインに立体感や奥行き感を出すことができる、フラットデザインの発展形と言えるだろう。 サイトを都会的に見せたいときや、デザインにオリジナリティが求められる時に取り入れると良いだろう。

design03

URL:http://globekit.co/

 

●04.多様化するスプリットスクリーンレイアウト

紙面デザインに近いと言えるスプリットスクリーンレイアウトは、昨年からこちらもよく見かけるようになった。 最近では、分割面が右と左の2面だけではなく、複数あったり、写真とテキストと分けたり、写真と写真であったり、右と左で面積を変えたりと、いろいろなパターンが出現している。
スプリットスクリーンレイアウトはレスポンシブデザインと相性が良く、フルスリーンレイアウトで面白みを感じない時、インパクトを出したい時に取り入れてみると良いだろう。

design05

URL:http://fannymyard-design.com

 

●05.グリッドデザインはもう古い 自由なレイアウト

グリッドレイアウトでデザインすると、単調なデザインになったり、整然としすぎてなんか面白みに欠けるなど、デザインに物足りなさを感じる時がある。 このグリットデザインの弊害を解消しているが、「ブロークングリッドレイアウト」と呼ばれる手法だ。
ブロークングリッドレイアウトとは一部の見出しやタイトルや画像などをあえてグリッドからずらしてレイアウトするデザイン手法で、より紙面デザインに近いデザインを行い、デザインを印象つけることができるものだ。
ただし、デザインのバランスが崩れたり、見づらいデザインになってしまっては本末転倒なので注意したいところだ。

design05

 

URL:http://marchenotredame.com

 

●06.美しいローディングアニメーションは離脱率を抑える

読み込み中にローディングアニメーションを使うサイトが増えている。海外からのアクセスがあった場合、サイト表示に時間がかかる場合が多く、サイトが表示される数十秒の時間に印象的なGIFアニメーションを活用することで、離脱率を抑える効果を期待できる。
ローディングアニメーションは、ユーザビリティ向上のための手法で、アニメーションを用いることで、ユーザーの待ち時間のストレスを緩和し、さらにアニメーションを面白くすることで、サイトの世界観を作ることもできるだろう。

design06

URL:http://star-ale.com/

 

●07イラストを用いて直帰率を改善する

1960〜1970年代の広告を牽引していた、イラストレーションだが、最近ではWEBの世界にもこの手法が用いられるようになった。
イラストレーションは、WEBサイトに個性を見出す画期的な方法であり、ユーザーの関心を引くだけではなく、ユーザーとのコミュニケーションとしても活用できるだろう。
イラストは遊び心を印象づけ、直帰率を改善し、エンゲージメントを高めるなど見直され始めている。

design07

URL:https://www.playground.it/

 

●まとめ

2017年から引き続き、サイトデザイントレンドはグラデーションや大画面デザインは続いているようだが、今後は、さらにモバイルファーストは加速するだろう。今や若者の多くはPCではなく、サイトへのアクセスはスマートフォンである。
モバイルデザインでは、よりシンプルでわかりやすいインターフェースが求められ、画像などは軽く読み込み時間がかからないWEBサイトを目指すことが第一義だろう。
時代はグリッドデザインから、ブロークングリッドレイアウトになりつつあるように、WEBデザイントレンドはミニマルデザインから少しづつ離れて、オリジナリティが要求されるデザインが求められているようである。 ユーザーファーストでありつつも、印象的で大胆で、なおかつ的確に情報が伝わるデザインが2018年のトレンドとなるのだろう。

 

 

関連する記事

2019年 Webデザインの潮流 Webデザインはその年、その年で新しいものが生まれ、トレンドとなったり、ならなかったりする。 2018年のトレンドと言えば、グラデーション、スプリット(分割)レイアウト、タイポグラフィデザインなど見た目のデザインが多かったように感じられる。 今年はどうだろうか? デザインを行うには「見た...
今さら聞けない? SEO内部対策の基本 前回はユーザビリティについて書いたが、今回はSEO対策についても再確認してみたいと思う。こちらもユーザビリティと同様に継続的な見直しが必要な項目である。SEO対策とはズバリ、googleなどの検索エンジン対策である。 検索エンジンは日々サイト内の情報を収集し、その情報やコンテンツは評価され、...
色がもつイメージ:安心と信頼をメッセージする=ブルー効果... 色が何らかのサインを送りだしていることは誰もがよく知っている。誰がどんな色を選ぼうと、共通しているのは、その色に対して人は反応するということだ。私たちは色に条件反射し、気づくこともない。色に対する反応は直観的反応とも言われ、個々の色は人の本能的な反応と密接に関係し、その反応は生理的、感情的、環境...
お客様はここで離脱してるかもしれない:クレジットカード入力を最適化する8項目... ECサイトでは通常、お客様情報を入力した後に、決済(支払い)方法に遷移する。 その時、クレジットカード決済を選択した場合には、お客様は、カード番号や有効期限などのカード情報を入力する必要がある。説明が不十分なために、ここで離脱する割合が多い。 今回は、クレジットカード情報の入力内容で気を...
マレーシアのネット通販 2021年までに利用者数2000万人へ... この記事ではマレーシアのネット通販事情について見ていきましょう。 経済 マレーシアの人口は約3000万人、GDPは2,960億ドルである。1人当たりGDPは10,757ドルで、2021年には15,492ドルに達すると予想されている。2015年から2021年にかけて8.4%以上の高いCAG...
2016年、日本のEC市場はどうだった? 今回も前回に引き続き経済産業省から2016年の「我が国におけるデータ駆動型社会に係る基盤整備」報告書に基づき、国内のEC市場を中心にまとめてみた。 報告によると、日本国内のBtoC-EC市場規模は、15兆1,358億円。前年より9.9%増加したとしている。 各分野では物販系分野で8兆43...

タグ: , ,

このエントリーをはてなブックマークに追加
 

今なら海外展開の為の成功BOOKを無料ダウンロードできます。是非この機会にお読みください。