編集自由度と表示品質を両立する、企業・採用サイトのCMS設計

企業情報と採用情報で異なる世界観を持たせながら、担当者が一つのWordPress環境で更新できることが求められました。編集の自由度を広げすぎると、HTMLの変更で表示が崩れたり、制作中の修正と顧客側の更新が競合したりします。一方、入力項目を固定しすぎると、新しいソリューションやインタビューの追加に対応できません。項目数が変わる一覧、固定ヘッダー、アンカー位置、アニメーション速度なども、登録内容と端末条件を踏まえて設計し、顧客が実際に触る範囲とFHWが保守する範囲を決める必要がありました。

更新業務をヒアリングし、日常的に変更する項目、追加頻度の低い固定ページ、制作会社へ依頼する領域に分けました。ニュースやインタビュー、ソリューションは専用項目で登録し、件数が増減しても自動で並ぶ構造にしています。自由記述が必要な箇所には利用できる部品と入力例を用意し、サイト全体へ影響するHTMLやCSSは管理対象を分離。二つのサイトはWordPressマルチサイトで共通管理しつつ、デザインと公開状態を個別に制御しました。公開前後の更新を取りこぼさないよう、確認環境、更新停止期間、差分確認の手順も定めています。

企業サイトは事業内容と信頼性、採用サイトは働く人と成長機会が伝わるよう、共通ブランドの中で情報の温度を分けました。キャッチコピー、写真、文字サイズを先に確定し、一覧の件数や本文量が変わっても破綻しにくいカードと見出しを設計。固定ヘッダーは背景の明暗に応じて視認性を保ち、アンカー移動後も見出しが隠れない余白を設定しました。アニメーションは印象を作りながら待ち時間に感じない速度へ調整し、スマートフォンではタップできる要素が直感的に伝わる状態も用意しています。

WordPressマルチサイトで企業・採用の管理領域を分け、共通するユーザー管理と保守手順をそろえました。ニュース、事業、ソリューション、社員記事などは構造化した入力項目から出力し、登録件数が増減してもレイアウトが自動調整される実装です。自由編集が必要な固定ページは利用可能なHTML部品を限定し、共通CSSと分離して表示崩れの影響を抑えました。固定ヘッダー、ページ内リンク、アニメーションは画面幅と状態ごとに検証。公開後もPHP・WordPress更新や採用ページ改修へ継続対応できる構成にしています。