BUTTON固定ボタンのデザイン比較
画面左下に固定表示される2つのボタンです。
現状は見学・体験予約ボタンの水色(#0ccdff)に白文字のため、
コントラスト比が 1.88:1 と低く読みづらくなっています。
水色の地はそのままに、文字色で解決する案を4つ用意しました。
2つのボタンの統一感もあわせてご覧ください。
現状(2026-08-27 案Cを採用済み。この行は採用後の表示です)
採用前は白文字+金の強調で、水色の地に対してコントラストが足りていなかった。現在は案Cが適用されているため、下の案Cと同じ表示になる。
見学ボタンの文字:白 1.88:1 / 金 1.47:1(目安 4.5:1)
案A:金の枠で統一(見学は濃紺文字)
見学・体験の文字だけを濃紺に。入会案内は現状のまま。枠の金色で2つが揃う、変更量の最も少ない案。
見学ボタンの文字:濃紺 #0e3341 → 7.14:1
案B:白の枠で統一
枠を両方とも白にして、はっきりしたペアに見せる。入会案内の強調文字をキーカラーの水色にして、2つを関連づける。
見学ボタンの文字:濃紺 #0e3341 → 7.14:1
案C:キーカラーをアクセントに統一
見学は濃紺の枠と文字、入会は水色の枠と強調文字。2つのボタンで水色と濃紺が入れ替わる、対になった見せ方。
見学ボタンの文字:濃紺 #0e3341 → 7.14:1
案D:白文字のまま濃い影で持ち上げる
現状の配色(白+金)を変えたくない場合の案。文字に濃紺の影を重ねて輪郭を出す。色のコントラスト自体は改善しないため、可読性の底上げは限定的。
色のコントラスト比は 1.88:1 のまま(影で見かけ上の可読性を補う)
