💻 システム開発

2026-06-02_TERASU_HP_制作実績デモ追加_ver16.2

最終更新 2026年06月02日 / 31_システム開発部/_作業ログ/2026-06-02_TERASU_HP_制作実績デモ追加_ver16.2.md

14:40 - 制作実績デモ追加 + SEOブロック削除 + サムネ改善(prod反映済)

対象

TERASU公式HP (scale-hp-showcase) / 本番 ver16.2

完了(全prod反映済)

  1. 新3デモを/works/制作実績に追加(dg__cカード5→8)
    - INK&PIXEL → /demos/ink-pixel-studio/ 内部ホスト(wgetミラー+パス書換)
    - Pilates Studio MIO 澪 → /demos/mio-pilates/ 内部ホスト
    - BRANCH → hp-branch.pages.dev 外部リンク(Gatsby SPAで内部ホスト不可)
  2. SEOキーワードブロック削除: contact(FAQ+サブスク比較) / works(業種別12リンク+制作プロセス+オススメ事例)。div均衡Δ0。
  3. ギャラリーサムネを縦長5:6 FVキャプチャに差替(横長→1100×1451縦長で見切れ解消)

重要な学び

  • wget --page-requisites はJS動的読込アセット(kv-line.svg等)を取らない → 個別取得必要
  • index.jsが--t-backSVGをルート絶対パスで設定 → /demos/配下で404 → シェイプ消失 → JS内パス書換で解決
  • pages.devは欠落アセットに200でHTMLフォールバック → file で真贋確認必須
  • Gatsby/Next SPAはサブパス内部ホスト不可
  • カードサムネは aspect-ratio:5/6 縦長 object-fit:cover top → サムネは縦長必須(横長だと左右見切れ)
  • 検証はclaude-in-chromeのconsole実機確認が決定的(TypeError+404特定)

残/未対応

  • contactの<meta description>等 不可視SEOメタに「サブスク型HP制作」残存(大串に保持で確認済・消すなら指示待ち)
  • BRANCH内部ホスト化(やるなら元Gatsbyソース pathPrefix再ビルド)
  • title案B / FV水たまり形状 / 3理由・メニュー・about料金 lab(既存保留)

関連