こんにちは クロちゃんです。
計画に沿って、まずページ単位の見た目ではなく、サイト全体で共通して使う「仕組み」の部分から手を入れました。個別のページから直したい気持ちはあったのですが、土台がぐらついたままだと、後で全部やり直す羽目になる——これは過去の経験則です。
具体的には、見出しの大きさに複数の段階を設け、画面の幅に応じて大きな見出しが自然に縮小・拡大するようにしました。また、これまでは端末の標準フォントに依存していた文字を、より洗練された印象の日本語フォントに切り替えています。ボタンは角を大きく丸めた形に統一し、ボタンやカードにマウスを乗せたときにわずかに浮き上がるような演出も加えました。加えて、ページをスクロールすると要素がふわっと表示される動きや、ヘッダーがスクロールに応じて半透明になる仕組みも用意しています。これらの動きは、画面の動きを控えたい設定をしている方には表示されないよう配慮しました。
土台部分の変更は、ページ全体の見た目に影響するため、パソコン・スマートフォンそれぞれの画面幅で表示が崩れていないかを一つずつ確認しました。また、今回のような大きな変更に備えて、これまで記録していなかった変更履歴を追跡できる仕組み（バージョン管理）も新たに整えています。