01
HTML Era
1991 — 1996
Tim Berners-Lee の最初のページから、テーブルレイアウトの登場まで。Times New Roman、青いリンク、紫の visited、ベーシックな HTML 1.0。
"I just had to take the hypertext idea and connect it to the TCP and DNS ideas and — ta-da! — the World Wide Web." — Tim Berners-Lee, 1991
The WorldWideWeb (W3) is a wide-area hypermedia information retrieval initiative aiming to give universal access to a large universe of documents.
Everything there is online about W3 is linked directly or indirectly to this document, including an executive summary of the project, Mailing lists, Policy, November's W3 news.
This site is best viewed in Netscape Navigator 1.0 at 800×600.
VISITORS: 0000042 🚧 UNDER CONSTRUCTION 🚧1991 年 8 月 6 日、Tim Berners-Lee が CERN のサーバ上に世界初のウェブページを公開した。情報構造としての HTML、ナビゲーション・プロトコルとしての HTTP、住所体系としての URL ── これら 3 つで構成される Web は、当初 テキストとリンクだけの情報ネットワーク だった。デザインの概念はまだなかった。
1993 年に Marc Andreessen が Mosaic ブラウザに <img> タグを実装し、1996 年に David Siegel が著書『Creating Killer Web Sites』で テーブルによるレイアウト 手法を広めると、Web は急速にデザイン媒体へと進化した。1996–2010 年は Flash 時代、Joshua Davis、Yugo Nakamura、2advanced、Hi-ReS! などのスタジオが 映画館の暗闇のようなインタラクティブ・サイト を量産した。
2010 年代、iPhone の普及により Ethan Marcotte が「Responsive Web Design」を提唱し、Jen Simmons や Brad Frost が「コンポーネント駆動」の方法論を確立した。2014 年 Material Design、2018 年以降の Brutalist 復権、そして 2024 年現在の AI 補助 Web デザインまで ── Web デザインは 既存のグラフィックデザインの 100 年史を 30 年で再走 しつつ、独自の規範を作り上げてきた。
Tim Berners-Lee の最初のページから、テーブルレイアウトの登場まで。Times New Roman、青いリンク、紫の visited、ベーシックな HTML 1.0。
Macromedia Flash が Web を映画化した時代。Joshua Davis、Yugo Nakamura、Hi-ReS! が画面いっぱいの映像的体験を量産。iPhone が殺した。
Ajax、ライトリフレクション、グラデーション、丸角、リフレクション。Twitter 鳥アイコン、Apple っぽい光沢ボタン。Web が SNS とブログの時代へ。
Ethan Marcotte の "Responsive Web Design"。iPhone の普及で全サイトが流動的グリッド + メディアクエリ + フレキシブル画像へ。Bootstrap が席巻。
Brutalism Web の復権、Awwwards 流の作家性回帰。同時に Webflow / Framer / v0 などの AI 補助ツールが量産部分を自動化していく時代へ。
HTML、HTTP、URL、最初のブラウザ (WorldWideWeb on NeXT) を 1989—91 年に発明。後に W3C 創設、Web の標準化を主導。Web デザイン全体の祖。Sir 称号、ACM Turing Award (2016) 受賞。
1998 年 praystation.com を開設、Flash アートの神となる。生成的アルゴリズム、毎日更新、抽象幾何学。Adidas、Yahoo、AT&T、IBM のキャンペーン。"Flash 時代の Andy Warhol"。
東京。tha ltd. 主宰。Flash 期に世界中を驚かせたインタラクティブ作品 yugop.com。ユニクロ UNIQLO Web、NHK 「ピタゴラスイッチ」、KIRIN、SEPHORA の Web 設計。日本のインタラクティブ・デザインの父。
2010 年 A List Apart で「Responsive Web Design」を提唱。流動グリッド + メディアクエリ + フレキシブル画像で「すべての画面サイズに 1 つの HTML が対応する」原則を確立。著書『Responsive Web Design』(2011)。
CSS Grid Layout の最大の伝道師。Mozilla、Apple WebKit チーム在籍。"Layout Land" YouTube シリーズで現代 CSS の可能性を世界に教育。エディトリアルウェブ・デザインの理論的指導者。
2013 年 Webflow を創業し、コードを書かずにレスポンシブ Web サイトを設計・公開できるツールを完成させた。Squarespace、Wix とは違い、デザイナーが 本物の HTML/CSS を書ける環境を提供。
The WorldWideWeb (W3) is a hypermedia information retrieval initiative.
See examples, people, history.
Web デザインが世界に手渡したものは、「グラフィックが時間 × 流動 × インタラクション × 状態 × アクセシビリティを同時に持つ」 という新しい設計の現実である。紙のデザインは固定されたサイズの中で完結したが、Web はサイズ・解像度・接続速度・OS・ブラウザ・言語・障害支援機能のすべてが変動する 「常に揺れている設計対象」 である。
同時に Web は、歴史上最も民主化された設計現場 でもある。HTML と CSS は 14 歳の中学生が独学で習得できる。Webflow、Framer、v0、Cursor などのツールがコードの障壁を下げ続けている。「View Source」でどんなサイトの実装も学べる。1991 年の Berners-Lee の最初のページに込められた精神 ── 誰もが情報を発信できる平等な装置 ── は、Web デザインの現場でも継続している。
21 世紀後半、Web デザインは AI 補助設計 の最前線へ。Cursor、v0、Galileo、Lovable、Bolt が、デザイナーの素早い試作を可能にしつつある。だが Tim Berners-Lee の最初のページを今もアクセスできる事実 (info.cern.ch) は、Web の本質が 「テキストとリンク」 という単純な仕組みの上に立っていることを思い出させる。Web の最高の達成は、その単純さが 33 年経っても陳腐化しない事実かもしれない。