- 1997年のWebデザインは、FlashとCSSの台頭によって、視覚的実験・標準・ユーザビリティが衝突していた時期であり、Zeldman・Siegel・Nielsenはそれぞれ異なる解決策を代表していた
- David Siegelは、CSSやFlash以前の表現上の限界を超えるためにHTMLハックを積極的に活用し、見えないテーブル・1ピクセルGIF・特定ブラウザ向け最適化もいとわなかった
- Jakob Nielsenは、Webサイトが「真剣なビジネスツール」になるにはセマンティックHTMLとブラウザ全般でのアクセシビリティが必要だと考え、CSSをコンテンツと表現の分離の解決策として受け入れた
- Jeffrey Zeldmanは、CSSを支持しつつもShockwave・Flashのようなツールを活用する実用的な折衷を選び、美的表現と標準準拠の両立を目指した
- 3人のその後の進路は分かれたが、1997年の論争は、Webデザインが装飾・互換性・ユーザビリティの間でどのようなバランスを取るべきかを示している
1997年のWebデザインを分けた3つの潮流
- 1997年のWebデザインは、FlashとCSSが同時に台頭しながら急速に変化していた時期だった
- David Siegelは、視覚的完成度のためにHTMLを迂回的に使う方法を擁護した
- Jakob Nielsenは、シンプルさ、アクセシビリティ、セマンティックな構造をWebの中核原則とみなした
- Jeffrey Zeldmanは、視覚的センスとユーザビリティの両立を追求し、この2つの潮流の間に立っていた
Jeffrey Zeldman: グラフィックと標準の間のプラグマティズム
- Zeldmanは1997年初頭に42歳で、小説家志望・ジャーナリスト・ツアーミュージシャン・広告業を経てWebデザインに移った
- 広告で身につけた「即時に伝える」訓練がWebに役立ったと考え、1995年に最初のWebサイトを作った
- 1996年末、個人Webサイトには「ハイパーリンクテキストがWebを作り、グラフィックがそれを消費者の遊び場にした」と書いていた
- 当時のWebはファイルサイズと画像使用量の制約が大きく、Zeldmanは画像をできるだけ少なく使い、ファイルサイズを減らすよう助言していた
- WebページはMacintoshの一般的なテキストエディタでHTMLを書き、Photoshopでグラフィックを作る方式で制作していた
- HTMLの基礎を重視しつつも、他のデザイナーの仕事を学ぶには
File: View Sourceを活用するよう勧めていた
David Siegel: 「HTML terrorist」と視覚的コントロール
- Zeldmanは、初期のWebデザイナー時代にDavid Siegelの Creating Killer Web Sites: The Art of Third-Generation Site Design から大きな影響を受けた
- この本の1996年版は、CSSやFlashが本格化する前だったため、より魅力的なWebサイトを作るためのHTMLハックを擁護していた
- 見えないテーブルと1ピクセルGIFでレイアウトを制御する方法が中核的な技法だった
- 1996年版には「A PDF Primer」の章があったが、CSSには触れていない
- 1997年の第2版ではPDFの章が外れ、「A CSS Primer」が新たに加わった
- Siegelは1997年初頭に約37歳で、デジタルタイポグラフィの背景を持つデザイナーだった
- Webで優れたタイポグラフィと明快なコミュニケーションを実現するために必要なあらゆる手段を使うと述べ、Netscape Navigatorに注力していた
- 「すべてのブラウザに最適化されたページは作らない」と述べており、この姿勢は特定ブラウザでしか正しく表示されないWebサイトの流れとつながっていた
Jakob Nielsen: ユーザビリティとセマンティックなWeb構造
- Jakob Nielsenは1997年に39歳で、自らを「usability guru」と呼んでいた
- Webから表面的な派手さを取り除き、Webサイトを真剣なビジネスツールにすることを目標に据えた
- 主要ブラウザすべてでアクセス可能なデザインを強く擁護し、コンテンツと表現を分離するためにセマンティックなエンコーディングを推奨した
- 初期には、HTML仕様で定義された構造を守ることに焦点を当てていた
- たとえばヘッダーには「18ピクセルの太字Garamond」のような表現方法ではなく、H1、H2のような構造を使うべきだという考えだった
- 各ブラウザがユーザーにヘッダーをどう表示するかを決めるべきだという立場だった
- やがてCSSを支持し、1996年末の時点ではまだCSSは広く使われていなかったが、ブラウザと表示装置が増える状況では、よい表現を実現する唯一の解決策だと考えた
CSSサポートの限界とブラウザ戦争
- 1997年初頭、2大ブラウザのCSSサポートは不完全だった
- Internet Explorer 3.0はW3C CSS標準のサポートに最も近かったが、バグが多く一貫性に欠けていた
- Netscape 3.0はCSSサポートが弱く、JavaScriptベースのスタイリング方式であるJavaScript-Based Style Sheets(JSSS)をCSSの代替として作ろうとしていた
- JSSSは結局広まらなかったが、Netscapeが初期のWeb標準であるスタイルシートを支持する速度を遅らせる役割を果たした
- 1997年が進むにつれて、Siegelの美学中心のアプローチとNielsenのセマンティックなアプローチの隔たりは大きくなった
Flashの台頭とCSSとの対比
- Zeldmanは後にFlashから離れたが、1997年にFlashが人気を集め始めたときには、Webマルチメディアを次の段階へ引き上げるアニメーションツールと見なされていた
- 1997年5月、MacromediaはFlash 2をリリースし、プログラミングなしでベクターベースの解像度非依存グラフィックを作成・アニメーション化できるツールとして紹介した
- Flashの強みは、当時のCSSの弱みと対照的だった
- CSSより学びやすかった
- 当時のCSSより視覚的にはるかに多くのことができた
- ブラウザ企業の実装に依存せず、ブラウザプラグインとして動作した
- ユーザーがプラグインを大規模にダウンロードすれば活用できた
- Siegelは1997年9月刊行の Creating Killer Web Sites 第2版で、FlashはWebにベクターグラフィックを主流として持ち込む最良の選択肢だとみなしていた
- 同じ本でCSSの章も新たに扱ったが、1997年8月当時のブラウザはスタイルシートの約束をきちんと実装できていないと評価していた
- NielsenはFlashをすぐに退け、数年後にはFlashは「99% bad」であり、ほとんど常に「ユーザビリティの病」だと書いた
- Siegelも、FlashがMacromediaの所有・管理する独自ツールである点を懸念していた
- Flashソフトウェアはオープンソースではなかった
.fla ファイル形式は独自形式だった
- 生成物はWeb標準に従っていなかった
3人のその後の歩み
- 3人はいずれも、初期のWebデザインという職業を前進させようとしており、1997年のWebプラットフォームの変化のため、Webデザインは必然的に実験的だった
- NielsenのUseitは装飾のないミニマルデザインを維持し、Web 2.0の時代には多くのWebデザイン関係者にとって時代遅れのサイトに見えた
- Useitはその後も数年維持され、2012年末にNNGroupのWebサイトへ統合された
- 2025年、NielsenはSubstackでAIについて書いている
- Siegelはデジタルタイポグラフィの修士号とPixarでのキャリアを持ち、3人の中で最も専門的なデザイン背景を備えていた
- 1996〜1997年の Killer Web Sites 2版の後、WebデザインからWebビジネスの側へ移った
- その後、Pull: The Power of the Semantic Web to Transform Your Business を宣伝し、ブロックチェーンにも関心を示した
- 現在のWebサイト cuttingthroughthenoise.net は、さまざまなビジネス上および個人的関心を示している
- Zeldmanは現在もWebデザイナーであり続けている
- 2019年から、WordPressやTumblrなどを手がけるAutomatticのExecutive Creative Directorを務めている
- zeldman.com でWebデザインをテーマにブログを書き続けている
- 2019年2月からデフォルトのWordPressテーマを使っており、2025年にはサイトのリデザインを準備中だと明かしている
- Zeldmanのアプローチは、Web標準とデザイン感覚を結びつけるものだった。そして1997年の3人のグルの中では、当時の彼のWebサイトが最も興味深く、異国的なサイトだと評価されている
1件のコメント
Hacker News のコメント
この記事では Nielsen を「技術的には正しい」側に置いているが、少なくとも私にとって Nielsen の影響は、経験的に正しいことに強く集中させてくれた点にあった。
情報を伝えるうえで何が効果的かを実際の人を対象にテストするやり方で、「見栄えの良さ」はしばしば犠牲にされた。
だから彼の成果物は「絶望的に時代遅れ」に見えたが、その戦いでは正しい側にいたと思う。
サイトに入る前に Flash のスプラッシュ画面を見せるのが良い考えだと信じているサイトが多く、デザイナーたちは普通の人が読めるくらい大きな文字に恨みでもあるかのように振る舞っていた時代だった。
当時は、デザイナーも古典的な HCI の人たちもプログラマーも Web をきちんと理解していないように感じていて、Nielsen は少なくとも Web に集中してはいた。
ただ、まったく新しいメディアの初期ユーザーの期待に固執する一方で、まだ黎明期なので必然的に進化するという点を見ていなかった。
「ハイパーリンクは常に青い下線であるべきだ」といったことを言っていたが、その時点では Web の普及があまりに初期段階で、そうした硬直したルールを適用するには適していなかったと思う。
そのおかげでユーザビリティに大きな敬意を持つようになり、デザイナーたちは Nielsen を嫌っていた。
それ以来、すべての設計と再設計に継続して適用している。
昔の UseIt.com https://web.archive.org/web/19990125092506/http://useit.com/ は、頭の中に永遠に無料で居座り続けそうだ。
https://www.nngroup.com/articles/why-you-only-need-to-test-w...
Zeldman の A List Apart が好きだったが、私たちがみんな20代半ばだった頃に、彼がそんなに年上だったとは知らなかった。
同じ世代だと思っていた :D
Nielsen は正直いなくてもよかったし、何百万人もの人がより使いやすいサイトを使えるよう助けたのかもしれないが、あまりに硬直的で退屈だった。
特に「ホームページにはこういうリンクがあるべきだ」といった処方箋的なアプローチがもどかしく、Philip Greenspun がいつか彼をうまく刺したように思う。
人々は答えと方向性を求め、それに大金を払う用意があり、彼はコンサルタントとしてコンサルティングをしていたのだから、なぜそうしたのかは理解できる。
急速に変わる世界では答えの賞味期限は短く、だから彼は自分の指南があまりに古びていくことを知って、ずっと前にサイトを下ろしたのかもしれない。
それでも楽しい時代で、本当に良い時代だった。
1ページにすべて詰め込む問題だけでなく、今日から見ると驚くほど多くのユーザーが下にスクロールしなかったため、ファーストビュー内に全部入れる問題でもあった。
人々はスクロールできることを知らず、その後の実験でスクロールが普通になる転換点が観察された。
サイトが動作すべき環境は技術的にだけでなく社会的にもまったく違っていて、そうした細部が今日までそのまま続いていないのは当然だ。
当時は高校生だったが、Dave Shea、Andy Budd、Doug Bowman、Shaun Inman、Mike Davidson、そして今では忘れてしまった多くの人たちを好んで追っていた。
Siegel は「Killer」本のある版で、サイトに2〜3段階の「入口ポータル」を置くことを提案し、Greenspun はそれを愚かだと見なした。
Nielsen のアプローチはかなり高く評価している。
Web が再びユーザビリティに戻るなら、ずっと良くなるかもしれない。
私たちは Flash が提供していたもののかなりの部分を作り直そうと必死に頑張ってきたが、本当にスクロールすると写真やテキストブロックが飛び回ることを望んでいるのだろうか。
最初に見たときは格好いいが、その次はどうだろう。「このサイトの情報は素晴らしいけれど、ジャック・ラッセル・テリアのように画面上を跳ね回ってくれたらいいのに」と言う人がいるだろうか。
しかもホーム画面には、明日で1年経つ記事に「new」タグが付いている。
時代が変わったようだ。
自分の好みや毎日回していたテストの現実に比べて、あまりに硬直的で重箱の隅をつつくようなところがあった。
Jeffrey Zeldman が1997年初めに42歳になったのだと、今になって気づいた。
2000年代初頭には、彼は私たちより数歳上くらいだとずっと思っていた。
彼らの Web サイトで「View Source」を見るのは、教育的に有意義な時間の使い方だった。
警告: 一部の地域では「View Source」が違法な場合があるので、各自の判断で使うように、という冗談も思い出す。
2000年代初頭にキャリアを始め、自分のデザインや Flash の作品がインターネット上にあった頃には、Zeldman、Siegel、そして多くの人たちがヒーローで、Nielsen は悪役だった。
2000年代半ばごろには、病院や医師向けにアクセシビリティ、HIPAA 準拠などを深く扱う仕事を多くしていて、その頃には Nielsen のような人たちがヒーローになっていた :-)
ページ上の格好いいものがどう動いているのかを、ただ View Source で見られた初期の頃が懐かしい。
今では格好いいものはほとんどなく、あったとしてもインスペクターで探ることはできるが、たいてい難読化された JavaScript の奥深くに埋もれていて、解読できない可能性が高い。
ここ数年で体験した最高のソース表示体験の一つだった: https://github.com/BenjaminAster/CSS-Minecraft/tree/main
現代の CSS は信じられないほど豊かだ。
私にとってもう一つ重要な本は Web Pages That Suck だった。
あの本は実際、Creating Killer Web Sites をかなり批判していたし、当時はプライドの高い人が多かった。
あの本からはかなり多くを学んだし、Flanders は今もサイトを持っているかもしれない。
彼のメーリングリストに入っていたが、この10年ほどは何の便りも聞いていない。
最近はあらゆるものが最適化され効率化されすぎていて、Web ページが時々めちゃくちゃだった時代が懐かしくなった。
使いにくくても、少なくとも個性はあった。
車に似ていて、博物館でとても古い車を見ながら、あのペダルやレバーが何をするのか気になるのは楽しいが、自分で運転しなくていいのはありがたい、という感じだ。
Flanders がまさに批判していた mystery meat navigation は私に大きな影響を与え、ユーザビリティの問題を考えるとき、今でも頭の中で響いている。
まだ本棚に Creating Killer Web Sites がある。
ただ早めに買った本で、古典になるとはまったく思っていなかった。
それでも、その本で示されたやり方でデザインされた Web サイトを見るのはすごい体験だったが、実用的ではなかったと思う。
私の目には、印刷メディアをそのまま複製したものに近かった。
当時の ColdFusion や Dreamweaver がどう動いていたかを覚えているなら、QuarkXPress のような DTP ソフトウェアから借りてきたのが明らかな部分がある。
あの時代を思い出すのは楽しいが、結局サイトデザインの道には進まなかった。
REX BBS スクリプトから今の ES6、SVG、WebGL まで、想像できるあらゆる技術で Web サイトや印刷・Web デザインをかなり長くやってきたので、この人たちは Web で何をしているのかまったく分かっていなかった と大胆に言える。
おそらく印刷分野では最高のデザイナーで、それは称賛されるべきことだが、Web は印刷物ではない。
彼らはこの新しいメディア、画面、そしてすべての情報を同じページに入れる必要はないという事実を理解していなかった。
おそらく2010年頃に再びフラットでシンプルになり始めてから、ようやく人々は合理的な Web デザインをするようになった。
2005年でもユーザビリティは新しい概念で、Apple の K-12 インターフェースも大きな助けにはならなかった。
もちろん System OS のいくつかのデザイン上の判断はかなり筋が通っているが、それは Web ではなかった。
こうした本が教えたことの大半は、Illustrator、CorelDRAW、Quark 的なアプローチを Web ページの上に載せる方法だった。
ページやボタンのような、すでに与えられたウィジェットで、どれだけ少ないものを見せながらナビゲーション可能にできるかを試した人はあまりにも少なかった。
これは地図制作も同じで、より遅いペースで動き、今でも1834年のように情報過多の地図を作っている。
ものすごく不人気な発言かもしれないが、私の考えでは ゲームデザイナーとゲーム UI デザイナー のほうが、初期の過大評価されたデザイナーたちよりも、Web にずっと大きなインスピレーションを与えた。
たとえその初期のデザイナーたちがポスターや印刷物では優れていたとしても。
いくつかのゲームはインターフェースのシンプルさにおいて本当に先を行っていて美しく、世界の大半は、ゲーマーやデモシーンの人々が何年も前に到達していた場所に遅れてやって来たのだと言える。
この人たちから学びながらキャリアを始め、A List Apart のようなサイトが好きだった。
ある日、Zeldman が私の作った WordPress プラグイン に改善要望のメールを送ってきたときは、有名人に会ったように舞い上がり、一周して元の場所に戻ってきたような気がした。
Zeldman は2000年代の私のヒーローの一人だった。
リストには Eric Meyer も入れられると思う: https://en.wikipedia.org/wiki/Eric_A._Meyer
これほどシンプルで要点を突いたものは見つけられていない。
Netscape Navigator 4 では テーブルのネストが7階層 までしかできなかったことを、何歳くらいになれば忘れられるのか、いつも気になっている。
あの時代がとても懐かしい。
本当に幸せで前向きで、純粋だった。
人々は心から何かを作り、互いに教え合い、楽しんでいた。
最近は何もかもがあまりにも偽物っぽく、虚栄に突き動かされているように感じる。
この人たちの本を読み、Designer's Talk のようなフォーラムを更新し続けながら HTML + CSS を学んだことは、絶対に忘れない。