今年の春頃からテスト的に各キャリア(docomoとかsoftbankとか)が5G対応を進めていくようで、問題がなければ少なくとも年内にはすっかり5G化しているかと思います。5Gになることで、よりシームレスなコミュニケーションが実現できますし、未来的な話は既にこのブログでもご紹介させていただいています。

そこで今回は、もうちょっと短期的に変わりそうな話として、デザインの話に触れたいと思います。

地球儀

流行の陰には消極策があった！？

ここ最近、サイト構築における流行であった「ワンカラム化」と「フラットデザイン」。これに関しては海外を中心に流行り出し、WordPressのテーマとしても増え、その斬新性もあってか日本でも多くのサイトで適用されていました。

しかし、もうちょっと背景を考えれば「ワンカラム化」と「フラットデザイン」の必要性は分かるはずです。まだまだ海外ではナローバンドが多く、米国も州によって通信性能は大きく異なります。日本はブロードバンド国家です(ちなみに今現在で最もブロードバンドなのは韓国ですよね)。つまり海外では「ワンカラム化」と「フラットデザイン」の背景にネガティブな要素(しかたない要素)もあったはずです。にも関わらず、流行好きな日本ではわざわざ情報を制限してまでワンカラム化してました…。私が見る限り、コミュニケーションとして情報の最大化が必要なサイトが不必要にワンカラム化してるケースもありました。

では、なぜナローバンドだとワンカラムなのか？
ワンカラムではなく、2カラム、3カラムにする場合、CSSの設定が増え、<div>タグの要素も増えます。つまり、レスポンスや表示速度に影響を及ぼします。だから通信性能が低い環境において、こうした手法は好ましくないわけです。
そして、なぜフラットデザインなのか？
画像ファイルの容量を決めるのは「画像内で使用された色の数」と「ドット数(画素数)」と「色配置の複雑さ」です。つまり、七色に配置された画像のほうが容量が重くなるのです。

以下に例を挙げます。左から以下の画像を配置しています。

左：ワントーン画像でサイズがW319×H283px
中：任意の七色画像でサイズがW319×H283px
右：同じ七色の画像で実際のサイズはW673×H598px

全て同じJPEGのファイル形式ですが、容量はそれぞれ以下になります。

左：ワントーン(W319×H283px)：2,067byte
中：任意の七色(W319×H283px)：10,975byte
右：大きめ七色(W673×H598px)：33,609byte

もうお分かりですよね？フラットデザインは画像ファイル容量を助けることに繋がり、結果として表示速度の向上にも繋がるわけです。

5Gでデザインが変わる？

しかし、こと日本においては、そもそもブロードバンドであるにも関わらず5Gという、非常に優れた通信環境が構築されるわけです。そうなることによって今まで遊べなかったデザインも遊べるようになるのではないでしょうか。結果、今後のWEBサイトデザインにおいては、以下の要素が増加すると私は考えています。

金や銀等といったキラキラ系やメタリックな色素
グラデーション要素
きめ細かいテクスチャー要素
動的なロゴデザイン
HTML5を活かしたJavaScript

そしてそれを裏付けるかのようにWeb Design Trends「2020年に流行するグラフィックデザインの最新トレンド13個まとめ」でも、より複雑なデザインが好まれている傾向が見受けられます。フラットデザインとは方向性が真逆ですよね？

デザインの見直しも！

Chromeのレンダリング力は昨年大きく飛躍し、伴って今ではGooglebotのレンダリングも大きく飛躍しています。JavaScriptにおけるSEO上の不利感も減少し、数年前までは「テキストを上部に詰め込む」よりも「空白を活かした清潔感のあるデザイン」が好まれる傾向にあります。つまり、5G国家になることで、日本ではSEO上もユーザーコミュニケーション上もより複雑なデザインが実現しやすい環境になっていくのです。

「もうそろそろリニューアルしなきゃ」「そろそろワンカラムも限界だ」と思っているサイトオーナーの方々には、是非こういった近未来状況も踏まえ、リニューアル方針にデザイン要素を加味してみてはいかがでしょうか。

5Gとデザインの関係

Search for articles

Archives