Webデザイン今昔
こんにちは。デザイナーの@tyan_hikaruです。 この記事はイノベーター・ジャパンAdvent Calendar 2017の5日目の記事です。
昨日は当社のマーケター兼ディレクターのシュウさんから、仕事で心がけている事tipsメモということで、仕事をする上で為になるお話をしてもらいました。職種関係なく参考になる内容なので、まだ読んでない方は読んでみてくださいね(・ω・)
さて今年も残り26日。あっという間の一年でしたね。
Webの世界も進化が早く、技術や流行がくるくると変化しています。
そんなわけで2017年を振りかえ・・・る代わりに、 昔から最近までのWebデザインの変遷を振り返ってみたいと思います。
AppleやAmazonのサイトは他の記事などで取り上げられることが多い印象なので、今回は以下の異なる3業種のサイトをみてみたいと思います。
- Japan Airlines (以下：JAL)
- LAWSON
- STARBUCKS COFFEE
1990年代後半
昔といってもインターネットの昔は結構最近で、Webサイトというのは1990年代後半くらいからちらほら出てきました。 以下はJALとLAWSONの1990年代のサイトです。とてもシンプルですね。
この頃のデザインは、htmlタグ(fontタグ)やインラインスタイルシートで表現されていました。その為か、文章構造を定義するためというよりデザインするためにhtmlタグが使われていた印象です。
1996年 JAL
1998年 LAWSON
2000年ころ
1990年代と比べるとデザイン要素が増え、見た目が楽しくなっています。 この頃は、tableタグを使ってレイアウトを作るtableコーディングという方法でデザインを実現していたようで、tableタグを入れ子にしたマークアップが特徴的でした。
2000年 JAL
2002年LAWSON
2002年 STARBUCKS COFFEE
2005年ころ
デザインの細部に注目すると、丁寧にデザインされた画像をあしらったり、グラデーションを用いて質感を出してみたりとリッチな印象を受けます。
レイアウトは、①ヘッダー②グローバルナビゲーション③メインコンテンツ④フッターという、よく見られるレイアウトになっているのも面白いですね。
2006年 JAL
2006年 LAWSON
2007年 STARBUCKS COFFEE
2010年ころ
LAWSONやSTARBUCKS COFFEEのサイトでは、目立つ部分に大きなバナーを大胆に見せているのが特徴的ですね。 フッター部分の情報量も多くなり、デザインがリッチになっているのも特徴的です。
2010年 JAL
2010年 LAWSON
2011年 STARBUCKS COFFEE
2017年
今まで多く見られた、画像やグラデーションで装飾されたデザイン要素がぐっと減りました。 一方、魅力的な写真を大きく見せたり、コンテンツ毎の見せ方にメリハリをつけることで、よりコントラストの強いデザインになった印象です。 フラットデザインと聞くと、余計な装飾を避けたシンプルなデザイン。と早とちりしてしまいがちですが、サイト全体のバランスが重要なのだなと気づきます。
2017年 JAL
2017年 LAWSON
2017年 STARBUCKS COFFEE
最後に
いかがでしたでしょうか。
こうして時間軸に沿ってデザインを見てみると、時代の流れが見て取れて面白いですね。あと何より懐かしい・・・！
今回、過去のデザインを見るのに Internet Archiveを利用しました。 皆さんも過去のデザインを振り返り、思い出に浸ってみてはいかがでしょうか。
