このサイトは文字サイズ切替と背景色 4 スキーム切替をヘッダーに常設し、それが成立するように組版そのものを設計している。文字サイズはラッパー <div style="font-size:100%"> の 1 箇所を JS が書き換え（拡大 で 17px）、背景色は <body> のクラスを差し替える。
ハイコントラストの3スキームでは background: none; border: 1px solid/dotted; color: inherit; に置き換える。面色が消えるので、影で階層を作る設計にはできない（実サイトの影はサイト全体で内側影が 1 要素だけ）。
青だけスウォッチと配色が一致していない。ボタンの面は #06438c、適用される背景は #0000bb。実装の実態なので両方記録するが、新規実装では揃える。
CSS 全文で font-size: % が 226 箇所、px は 87 箇所。1px 刻みを % に換算した梯子が並ぶ。子をすべて % / em で書いてあるから、ラッパー 1 箇所を書き換えるだけでページ全体が連動して拡大する。実測サイズに 14.08px 21.3328px 29.8656px といった端数が並ぶのはこの入れ子の掛け算の結果。
| 66.66% | 10px 相当 | 106.66% | 16px 相当 |
|---|---|---|---|
| 73.33% | 11px 相当 | 113.33% | 17px 相当 |
| 80% | 12px 相当 | 120% | 18px 相当 |
| 86.66% | 13px 相当 | 126.66% | 19px 相当 |
| 93.33% | 14px 相当 | 133.33% | 20px 相当 |
| 100% | 15px 相当（基準） | 140% | 21px 相当 |
font-size を px で書かない。px で書くと文字サイズ切替が効かなくなり、このサイトの設計そのものが壊れる。同じ理由で line-height も比率（無単位）で書く。
博物館と美術館が同居する施設なので、色が機能ラベルになっている。装飾として使わない。地の砂色は琉球の土の色。
フォント要求は 3 件で、内訳は Open Sans の 2 サブセットと slick.woff（カルーセルのアイコン）だけ。和文は OS ローカルの游ゴシック。font-family はサイト全体でただ 1 本のスタック（実測 170/170 要素・113/113 要素）。letter-spacing は全要素 normal、palt も 0 件。
font-weight: 500 は Open Sans には存在しない。読み込んでいるのは :400,600 の 2 本だけなので、CSS フォントマッチングにより欧文は 400 で描画される。和文側は OS の游ゴシックに渡り、macOS では Medium、Windows では Regular が当たって環境差が出る。
実サイトのスタックは 游ゴシック Medium を含んでいない。新規実装では "游ゴシック Medium", "Yu Gothic Medium" を 游ゴシック の前に足す。
縦組みは 3 要素だけ、すべて本物のテキスト（画像でもウィジェットでもない）。トップページの「お知らせ」で、39px 幅の左カラムに見出しと 一覧を見る を縦に積んで立てている。下層ページには無い。
実サイトは 39px 幅の左カラムに見出しと 一覧を見る を縦に積み、その右に一覧本体を置く（実測: 見出し left=120 / top=939、リンク left=126 / top=1091）。
縦組みを「横に並べる」ときだけ flex-direction: row-reverse が要る。素の display: flex だと DOM 順に左→右へ置かれ、日本語の縦組みとして読む向き（右→左）と逆になる。ここは縦に積んでいるので素の flex でよい。
角丸は 4px（切替）/ 3px（タグ）/ 10px（イベント CTA）/ 0px（タブ・記号・メニューカード）。タッチターゲットは切替ボタンが約 18px 角と小さい。新規実装では 44px 角を確保する。
メニューカードの 1px solid #cccccc と切替ボタンの角丸 4px から構成した参考実装。フォーカスリングは博物館ブルー、エラーは美術館レッド。
html も body も 6 幅すべてで固定（1440 / 1200 / 834 / 768 / 767 / 375px で 10px / 16px / 25.6px）。画面幅では文字サイズが一切変わらない。サイズを動かすのは画面幅ではなく、利用者が押す「文字サイズ」ボタン。ブレークポイントは min-width: 1280px（18 ルール）/ 1500px（12 ルール）のモバイルファースト。