Points
自社サイトの改修を検討されていたWeb制作会社さまへ、対応分野の一覧ページの改修案をご提案し、ご依頼いただいた案件です。
既存ページは対応分野が多い分、縦に長く情報量の多いページになっていました。 この「量」が「実績の多さ」として伝わるように、スクロールなしで1画面に収まるレイアウトへ再設計しています。
具体的には、関連する分野をグループにまとめ、選んだグループだけを表示する構成に再設計。 キーワード検索は入力に合わせて即時に絞り込めるようにし、操作感を大切にしています。
一覧のリンクはHTMLに常時保持してSEOに配慮し、JS無効でも一覧が見える設計です。 項目が増減してもレイアウトが崩れない構造にしています。
納品はHTML/CSS/JSの実装部分で、WordPressへの組み込みは先方のエンジニアさまが担当されました。 先方の環境と干渉しないよう、CSSはラッパークラス配下にスコープし、JSはグローバル汚染なし、差し替え箇所は日本語コメントで明示しています。
※機密保持のため、詳細記載を控えております。
Related Works
まずはお気軽にご相談ください。
ご質問だけでも歓迎／通常 本日中に返信いたします
Points
自社サイトの改修を検討されていたWeb制作会社さまへ、対応分野の一覧ページの改修案をご提案し、ご依頼いただいた案件です。
既存ページは対応分野が多い分、縦に長く情報量の多いページになっていました。
この「量」が「実績の多さ」として伝わるように、スクロールなしで1画面に収まるレイアウトへ再設計しています。
具体的には、関連する分野をグループにまとめ、選んだグループだけを表示する構成に再設計。
キーワード検索は入力に合わせて即時に絞り込めるようにし、操作感を大切にしています。
一覧のリンクはHTMLに常時保持してSEOに配慮し、JS無効でも一覧が見える設計です。
項目が増減してもレイアウトが崩れない構造にしています。
納品はHTML/CSS/JSの実装部分で、WordPressへの組み込みは先方のエンジニアさまが担当されました。
先方の環境と干渉しないよう、CSSはラッパークラス配下にスコープし、JSはグローバル汚染なし、差し替え箇所は日本語コメントで明示しています。
※機密保持のため、詳細記載を控えております。