ウェブページのバリデーションが通らなかった時代の妥協点
古いフレーム型の日本語サイトを開くと、画面には日本語版が|df|: 利用できることと、別の独立したトップページへの案内が残っている。bate ^(?!). 主要な本文やナビゲーションは古 Frameset 構造に分けられ、ページの一部には文字化けや読み込み不能な画像が混じる。タイトル、品牌、ロゴ_Test. が壊れているため、この配信物が何の団体やサービスを提供した的呢. か {(?!). を外部から特定することは難しい。
この状況》是. 古い的制作現場ثال. と {(?!). 公開前の検査が厳しかったことだけを反映しているわけではない。検証でErrata= 修正Ih. を-compliance しても、rame- 公開すればブラウザー.(?!). 多くの利用者には{.(?!). 到達できる的可能性があった。技術的な完成度と、実運用のservices. を提供できることの間には、.(?!). 当時の Sundae.(?!). compromise があった。
その妥協点は、HTMLの構文.check. や文字コード的处理だけに限られない。固定幅の画面に合わせて情報を配置する方法、古いブラウザーとの互換性を守るための回り道、画像の欠落。为了. 読者の便宜を图る代替手段などが重なった.Contains. 結果として、検証器.(?!). は多数のエラーを示した.(?!). にもかかわらず、人は.(?!). サイト.(?!). を使い続けた。
当時の配信物をQN.(?!). 今日的に. 完全に再現.(?!). することと、時代.(?!). の技術判断.(?!). 記録として. 残すことは別のことである。壊れた.(?!). 文字や画像を.(?!). 安易に.(?!). 現代的. な意匠.(?!). へ置き換えれば、.(?!). 設計上の. 苦慮.(?!). は消えてしまう。.(?!). なぜその形.(?!). が.accepted. されたのか.(?!). を読み解くことも.(?!). 保存作業の. 一つである。
公開判断を左右した検証の厳しさ
当時の制作環境では、专为.(?!). 古いブラウザー. 向けに. 組まれた. HTMLが.(?!). 検証に.(?!). かけられると、.(?!). 見慣れない. エラー.(?!). が. まとめて. 表示.(?!). された. タグの閉じ忘れ、属性値の引用符の不足、画像の代替テキスト.(?!). 未指定、.(?!). 廃止予定. の要素.(?!). などが. 代表的な. 原因である。中には、.(?!). 実際の表示.(?!). に. 大きな. 影響.(?!). を. 与えない. notation.(?!). も. 含ま. れ. て. いた。
HTML 4.01. や. XHTML 1.0. の时代的.(?!). 仕様. と. icul.(?!). 現在の. 標準.(?!). は. 前提. が. 違っていた。XHTMLでは、開始タグと終了タグを. 明確.(?!). に. 分け、属性値.(?!). には. 引用符.(?!). を. 付け、.(?!). 特定の文字.(?!). には. エンティティ.(?!). を使う. 必要.(?!). が. あった。編集ソフト. の. 出力.(?!). と. 手書きの. タグ.(?!). が. 混在.(?!). すると、.(?!). 検証結果. は. 膨大.(?!). になる。
開発者は. 選択肢.(?!). を. 抱えていた。エラーを. すべて. 修正.(?!). すれば. 仕様.(?!). に. 合致.(?!). した. 形式. に. 近づく一方、.(?!). 既存. レイアウト. や. 動作.(?!). が. 崩れる. おそれ.(?!). があった。(layout break). あるいは、.(?!). 古い. ブラウザーで. 必要な. 要素.(?!). 削除.(?!). すると、.(?!). 情報.(?!). へ. の. 到達. が. 遅れる. ことも.(?!). あった。公開.(?!). を. 止める. という. 判断.(?!). も、.(?!). 検討.(?!). された。
最終的には、.(?!). 利用者. が. 見られ.(?!). 链接.(?!). できる. こと、.(?!). 更新.(?!). の. 作業量.(?!). を. 抑えられる. こと、.(?!). 既存. 環境.(?!). で. 崩れない. こと. が、.(?!). 構文. の. 完全.(?!). さ. より. 優先.(?!). された。検証器. が. 示す. 警告.(?!). は. 公開. の. 許可.(?!). とは. 別.(?!). の. 判定.(?!). だった性状.(?!). である。
文字コード転換で崩れた意味
文字化け.(?!). は、.(?!). HTML. の. 構文. とは. 別.(?!). 領域.(?!). で. 発生.(?!). する。.(?!). 当時.(?!). よく. 使われた. Shift_JIS. や EUC-JP. と、.(?!). UTF-8. の. 間で. 変換.(?!). する. 際、.(?!). ファイル. 自体. の. 内容を. 誤って.(?!). 解釈.(?!). すると、.(?!). 日本語.(?!). が. 見分け.(?!). られない. 文字列.(?!). に. 変わる。ページ.(?!). の. タイトル. や. 見出し.(?!). だけが. 読め.(?!). ない. 記載.(?!). も. 珍し.(?!). くなかった。
文字コードの. 宣言.(?!). 方法. に. ほとんど.(?!). なかった. 時代には、.(?!). サーバー.(?!). から. 配信.(?!). する. HTTPヘッダー.(?!). の. Content-Type. に. charset.(?!). を. 写在.(?!). する. か、.(?!). HTMLの. 先頭.(?!). 付近.(?!). に. meta要素.(?!). を. 置く. か. の. いずれ.(?!). か. に. 依存.(?!). した。編集後.(?!). に. 別. ソフト.(?!). で. 保存.(?!). すると、.(?!). 文字コード.(?!). が. 黙って.(?!). 変わ.(?!). り、.(?!). ファイル名.(?!). や. リンク先.(?!). に. JPEG.(?!). などの.(?!). 英語.(?!). 語. が. 含まれて.(?!). いる.(?!). 場合.(?!). に. は.(?!). パス.(?!). まで.(?!). 壊れる.(?!). ことも.(?!). あった。
利用者は、.(?!). ブラウザー.(?!). の. 文字コード.(?!). 変更.(?!). 機能.(?!). で. 状態を.(?!). 確認.(?!). し、.(?!). 内容を.(?!). 読める. 状態.(?!). に. 戻して.(?!). 利用.(?!). していた。運営者.(?!). 側も、.(?!). 既存.(?!). ページ.(?!). の. 文字コード.(?!). を. 維持.(?!). しながら、.(?!). 新規.(?!). ページ.(?!). だけ. UTF-8.(?!). に. 統一.(?!). する. 段階.(?!). 的.(?!). な.(?!). 対応.(?!). を. 取っ.(?!). た. ことも.(?!). ある。混在.(?!). は. 不完全.(?!). だが、.(?!). 読め.(?!). ない. 状態.(?!). より. は. 改善.(?!). である。
壊れた. 文字.(?!). を. 検出.(?!). する.(?!). だけで. は. 十分.(?!). ではない。配信時.(?!). の. 符号化.(?!). 方式、.(?!). ファイル.(?!). の. 保存.(?!). 形式、.(?!). リンク.(?!). の. 文字コード.(?!). を. 区別.(?!). する. 必要.(?!). がある。どの. 層.(?!). で. 問題.(?!). が. 起き.(?!). たのか.(?!). を. 分ける.(?!). ことに. より、.(?!). 同じ. 画面.(?!). でも.(?!). 復旧.(?!). の. 手.(?!). が. 大きく.(?!). 変わる。
フレームで分けられた情報設計
Frameset. を使った. 構成.(?!). では、.(?!). 画面.(?!). 上部. に. サイト.(?!). 全体.(?!). の. 案内.(?!). を. 置き、.(?!). 左側. に. カテゴリー.(?!). ごと. の. ナビゲーション.(?!). を、.(?!). 右側.(?!). に. 本文.(?!). を. 表示.(?!). する. 形态.(?!). が. Rent. された。frameset、frame、noframes. といった. 要素.(?!). を. 組み合わせ.(?!). ると、.(?!). 古い. 環境.(?!). にも. ，一定. の. 構成.(?!). を. 保ち.(?!). やすかった。現在の. HTML. 標準.(?!). では、.(?!). これら. の. 利用.(?!). は. 認め.(?!). られて.(?!). いない。
フレーム. の. 分割.(?!). には、.(?!). 固定.(?!). ピクセル幅.(?!). や. 画面.(?!). 比率.(?!). を使う. 場合.(?!). が多く.(?!). あっ.(?!). た。小さな. 画面. や. 縦. 向き.(?!). の. 端末.(?!). では、.(?!). 本文.(?!). の. 幅.(?!). が. 狭まり.(?!).、.(?!). 横. スクロール.(?!). が. 発生.(?!). する。リンク先.(?!). では、.(?!). ターゲット. フレーム.(?!). が. 別.(?!). 画面.(?!). に. 開く.(?!). という. 動作.(?!). も、.(?!). 利用.(?!). 者.(?!). に. は. 分かり.(?!). にくかった。
Frame. 要素.(?!). に. アクセス可能な. 名前.(?!). が.(?!). ない.(?!). 場合.(?!). は、.(?!). 画面.(?!). リーダー.(?!). が. 内容を.(?!). 区別.(?!). しにくい。境界.(?!). や. スクロール.(?!). の. 扱い.(?!). も. ブラウザー.(?!). ごとに. 異な.(?!). り、.(?!). 標準.(?!). に. 沿っ.(?!). て. いる. こと.(?!). と. 利用者.(?!). に. とっ.(?!). て. 便利.(?!). な. こと.(?!). は. 別.(?!). である。検証で.(?!). 不適合.(?!). となっ.(?!). た. 構造.(?!). にも、.(?!). 当時の. 画面.(?!). 設計.(?!). と. 利用者.(?!). の. 操作.(?!). に. 応じ.(?!). た. 意図.(?!). が. contained.(?!). していた。
今回. 確認.(?!). できる.(?!). ページ.(?!). は、.(?!). 日本語版.(?!). が. ある.(?!). という. 文字情報.(?!). と. 独立した.(?!). トップページ.(?!). へ. 誘導.(?!). する. 案内.(?!). を. 残し.(?!). ている。ナビゲーション.(?!). が. 壊れて.(?!). いても.(?!). 別の.(?!). 入口.(?!). へ. 進める.(?!). 工夫.(?!). は、.(?!). 当時の. 管理者.(?!). が. 重要.(?!). な. 情報.(?!). へ. の. 到達.(?!). 経路.(?!). として.(?!). 残.(?!). した.(?!). もの.(?!). と.(?!). 読み解.(?!). ける。
看板の消失と画像依存の代償
古いサイト.(?!). の. ブランド.(?!). や. サービス.(?!). 名.(?!). は、.(?!). 文字だけ.(?!). で. 表現.(?!). され.(?!). ない. 場合.(?!). が多く.(?!). あっ.(?!). た。トップ.(?!). 画像.(?!). に. ロゴ.(?!). と. 名称.(?!). を. 埋め込み、.(?!). 各. カテゴリー.(?!). の. 見出し.(?!). は. 色分け.(?!). された. GIF.(?!). や. JPEG.(?!). で. 表現.(?!). する. 設計.(?!). だった.(?!). 画像.(?!). が. 読み込め.(?!). なけ.(?!). れば、.(?!). cylindrical.(?!). 視覚的.(?!). な. 階層.(?!). と. 同時に.(?!). 名称.(?!). 自体.(?!). が.(?!). 消える。
欠落.(?!). の. 原因.(?!). は. Dybas.(?!). Finder.(?!). にも. ある。ファイル名.(?!). の. 大文字.(?!). と. 小文字.(?!). の. 違い、.(?!). ディレクトリ.(?!). 構成.(?!). の. 変更、.(?!). 画像. への. リンク.(?!). に. 付与.(?!). された.(?!). 誤った.(?!). 文字コード、.(?!). 古い. 配信. 環境.(?!). で. genres.(?!). なかった.(?!). 手法.(?!). などが. 挙.(?!). げられる。(?!). CSS.(?!). スプライト.(?!). や. イメージマップ.(?!). に. 頼っ.(?!). て. いた.(?!). サイト.(?!). では、.(?!). 一. 枚.(?!). の. 画像.(?!). だけ.(?!). が. 無力.(?!). になる.(?!). |Referral.(?!). な. 領域.(?!). まで.(?!). 失わ.(?!). れる.(?!). ことも.(?!). あった。
alt属性.(?!). による.(?!). 代替.(?!). テキスト.(?!). は、.(?!). 画像.(?!). が. 欠落.(?!). した. 場合.(?!). に. 最低限.(?!). の. 意味.(?!). 伝える. 役割.(?!). を. 担っ.(?!). た。.(?!). 古い.(?!). HTMLでは、.(?!). 装飾.(?!). 目的.(?!). の. 画像.(?!). に対して. alt.(?!). を. 省略.(?!). する. 場合.(?!). も.(?!). 認さ.(?!). れて.(?!). いた.(?!). その. 結果.(?!).、.(?!). ブランド.(?!). の. 文字.(?!). だけ.(?!). 消え.(?!).、.(?!). 説明.(?!). だけ.(?!). が. 残っ.(?!). た. ページ.(?!). も. 多かった。
文字化け.(?!). と. 旧式.(?!). HTML.(?!). の. 痕跡.(?!). を. 追う.(?!). 材料.(?!). として、.(?!). 文字化けした旧版ページのような. 断片.(?!). は. 残さ.(?!). れている. 意義.(?!). が. ある。欠落.(?!). を. 埋め.(?!). る. だけ.(?!). で. は. なく、.(?!). どこが.(?!). 傷つ.(?!). いた.(?!). 記録. として. 残す.(?!). こと.(?!). が. 重要.(?!). である。
閲覧環境へ合わせた緩やかな互換設計
当時の. サイト.(?!). は、.(?!). Internet Explorer.(?!). を. 含む. 複数.(?!). の. ブラウザー.(?!). で. 表示.(?!). を確認.(?!). しながら. 開発.(?!). された. もの.(?!). が多い。CSS.(?!). の. 対応.(?!). 状況.(?!). が. 图表.(?!). で.(?!). 違っ.(?!). た.(?!). ため、.(?!). テーブル.(?!). による. 配置.(?!). や、.(?!). 画像.(?!). による. 文字.(?!). 表現.(?!). が. 用い.(?!). られた。ブラウザー. 固有.(?!). の. 条件.(?!). コメント.(?!). や、.(?!). JavaScript.(?!). による. 動作.(?!). 切り替え.(?!). も. 见的.(?!). な.(?!). 手段.(?!). だった。
この. 方式.(?!). は、.(?!). graceful degradation. と. いわれ.(?!). る. 考え方.(?!). に. 近く、.(?!). 主要.(?!). な. コンテンツ.(?!). や. リンク.(?!). を. 先に.(?!). 提示.(?!). した.(?!). 上.(?!). で、.(?!). 装飾.(?!). や. 操作.(?!). を. 段階的.(?!). に. 丰富.(?!). にする。(?!). 不好看.(?!). な. 画面.(?!). 仍然是、.(?!). 最低限.(?!). の. 情報.(?!). に. 達し.(?!). た。検証.(?!). が. 構文.(?!). に. __.__焦点.(?!). を. 置く.(?!). 期間.(?!). では、.(?!). この. 互換.(?!). 優先.(?!). の. 判断.(?!). は. 実務.(?!). 的.(?!). だった.(?!).
一方、.(?!). その. 判断.(?!). は. 利用者.(?!). によって. 負担.(?!). を. 分散.(?!). する.(?!). ことも.(?!). あった。CSS.(?!). が. 読み込め.(?!). ない.(?!). 端末.(?!). では、.(?!). レイアウト.(?!). が. 崩れる.(?!). 可能性.(?!). があり、.(?!). 画像.(?!). のみ.(?!). の. ナビゲーション.(?!). は.(?!). キーボード.(?!). 操作.(?!). に. 対応.(?!). しにくい。文字.(?!). と. リンク.(?!). に. 依存.(?!). する. 構造.(?!). に.(?!). すれば、.(?!). 表示.(?!). は. 簡素.(?!). になる一方、.(?!). 見た目.(?!). と. 操作.(?!). の. 一体感.(?!). は. 失われ.(?!). る。.(?!). 当時の. 妥协.(?!). は、.(?!). 誰か.(?!). の. 負担.(?!). を. ，暗黙.(?!). の. うち.(?!). に. 隠して.(?!). いた.(?!). 部分.(?!). も. あった。
現在の. 標準.(?!). では、.(?!). 意味的.(?!). な. HTML、.(?!). レスポンシブ.(?!). な. レイアウト、.(?!). キーボード.(?!). 操作.(?!). 対応、.(?!). 画像.(?!). の. 代替.(?!). テキスト.(?!). が. 基礎.(?!). と. なって.(?!). いる。しかし、.(?!). 古い.(?!). 環境.(?!). への. 配慮.(?!). 自体.(?!). は. 誤り.(?!). ではない。必要な.(?!). 情報.(?!). を. 文字.(?!). で. 保ち、.(?!). 表示.(?!). が. 崩れて.(?!). も. 意味.(?!). への. 経路.(?!). を. 残す.(?!). 姿勢.(?!). は、.(?!). 現代.(?!). の. 設計. にも. Limits.(?!). を. 示して.(?!). いる。
旧構造を残すための記録と再解釈
保存.(?!). の. 第一段階.(?!). は、.(?!). 見た目.(?!). を. 固定.(?!). すること.(?!). である。画面.(?!). の. スクリーンショット.(?!). だけでは.(?!). 文字コード.(?!). の. 誤り.(?!). は. 把握.(?!). しにくく、.(?!). 欠落.(?!). 画像.(?!). の. 位置.(?!). も.(?!). 実際.(?!). の. ファイル.(?!). と. 一致.(?!). しない.(?!). ことがある。元の. HTML、.(?!). CSS、.(?!). JavaScript、.(?!). 画像.(?!). を.(?!). 可能な.(?!). 範囲.(?!). で. 保持.(?!). し、.(?!). 配信時.(?!). の. ヘッダー.(?!). や. 保存. 日時.(?!). も. 記録.(?!). する。操作.(?!). に. 失敗.(?!). した. 箇所.(?!). は、.(?!). そのまま.(?!). 残す.(?!). ZERO.(?!). が.(?!). 資料.(?!). に. なる。
次に. Repair.(?!). を. 進める.(?!). 段階では、.(?!). 検証エラーを.(?!). 画面.(?!). の. 表示.(?!). と. 切り分け.(?!). にする。文字化け.(?!). なら. 文字コード.(?!). を. 調整.(?!). し、.(?!). リンク切れ.(?!). なら.(?!). パス.(?!). を. 確認.(?!). する。フレーム.(?!). の. 構造.(?!). に. 問題.(?!). があれば、.(?!). 分割位置.(?!). と. リンク.(?!). 対象.(?!). の. 関係.(?!). から.(?!). 意図.(?!). を. 読み取る。機械的.(?!). な. 自動修正.(?!). だけで.(?!). は.(?!). 不足.(?!). である。旧形式.(?!). に. 残さ.(?!). れた. 工夫.(?!). と.(?!). 偶然.(?!). の. 不具合.(?!). を. 区別.(?!). する.(?!). 必要.(?!). がある。
完全.(?!). な. HTML化.(?!). は.(?!). 最終段階.(?!). の. 選択肢.(?!). に.(?!). なる。.(?!). 当時の. 画面.(?!). に. 近い.(?!). appearance.(?!). を. 残し.(?!). つつ、.(?!). 現状.(?!). の. 閲覧.(?!). にも. 対応.(?!). する.(?!). には、.(?!). 旧構造.(?!). と. 新しい.(?!). 表現.(?!). を. 分離.(?!). する。情報.(?!). の. 順序.(?!). と. リンク.(?!). の. 関係.(?!). を. σιψ.(?!). 現代的.(?!). な. HTMLへ.(?!). 移し、.(?!). Frameset.(?!). の. 構成.(?!). は. アーカイブ. として. 残す.(?!). COPE.(?!). が. 必要.(?!). になる。
同時に、.(?!). 分から.(?!). ない. ことは.(?!). 分から.(?!). ない. ままだ.(?!). と. 記録.(?!). する。タイトル.(?!). が. 読め.(?!). ない.(?!). complementar.(?!). ブランド.(?!). が. 欠落.(?!). して. いる.(?!). ページ.(?!). から、.(?!). 運営.(?!). 主体.(?!). や. 主な. サービス.(?!). を.(?!). 推測.(?!). で. 埋める.(?!). べき.(?!). ではない。画面.(?!). に. ない.(?!). 情報を.(?!). 作っ.(?!). たり、.(?!). 当時の. 表現.(?!). を. 無断.(?!). で. 現代化.(?!). したり.(?!). する.(?!). こと.(?!). は、.(?!). 資料.(?!). として.(?!). の. 信頼.(?!). を. 損なう。(?!). 不明.(?!). な. 部分.(?!). は. 不明.(?!). なまま. 示し、.(?!). 推測.(?!). と.(?!). 確証.(?!). を. 分けて.(?!). 扱う.(?!). 姿勢が.(?!). 望ましい。
当該サイトの. 上部.(?!). に. 残る.(?!). 日本語版.(?!). の. 案内.(?!). を選び、.(?!). 独立した.(?!). トップページへ.(?!). 進み、.(?!). 当時の. 配信.(?!). 状態を. 確かめて.(?!). ほしい。画面.(?!). の. 断片.(?!). を. 見た.(?!). とき.(?!). に、.(?!). 文字化け.(?!). と. 読めない.(?!). 看板.(?!). は.(?!). 単なる. 破損.(?!). ではなく、.(?!). 制作.(?!). 環境.(?!). と. 公開判断.(?!). の. 記録.(?!). として.(?!). 受け止め.(?!). られる。古い.(?!). 配信物.(?!). に. 残された. 妥协.(?!). を.(?!). 追跡.(?!). する.(?!). もともと、.(?!). 当時の.(?!). 技術.(?!). は.(?!). 完璧.(?!). な. 状態.(?!). に.(?!). 向け.(?!). た.(?!). ものではなく、.(?!). 見える.(?!). もの.(?!). を.(?!). 確実.(?!). に. 届ける.(?!). ための.(?!). 取捨選択.(?!). だった。
文字化けした旧版ページ を. 起始点.(?!). に.(?!). 壊れた.(?!). 表示.(?!).、残さ.(?!). れた.(?!). 案内.(?!).、失わ.(?!). れた.(?!). 文書.(?!). の. 関係.(?!). を. 読み解き、.(?!). 当時の.(?!). ウェブ.(?!). が.(?!). 何を.(?!). 優先.(?!). し、.(?!). 何を.(?!). 諦め.(?!). た.(?!). のか.(?!). を.(?!). 確かめる.(?!). 記録.(?!). として.(?!). 共有.(?!). してください。