HSL-N06 ·
静的HTMLでアーティストサイトを作る:構成と、原文に書くもの
hatolabor のサイトを、ビルドなしの静的HTMLで作った構成と、検索や生成AIに読まれるための工夫。
構成
- index.html、style.css、script.js の3ファイルが中心。
- 日本語版は「/」、英語版は「/en/」。
- ビルドを行わず、Cloudflare Workers の静的アセットとして配信。
HTMLの原文に書くもの
title、meta description、canonical、hreflang、OGP、JSON-LD(MusicGroup と FAQ)、そして本文を、すべてHTMLの原文に直接書いています。JavaScript が動かなくても、クローラーが原文だけで内容を読める状態です。
検索や生成AI向けのファイル
- sitemap.xml:日本語と英語の2URLを、相互に結びつけて記載。
- robots.txt:検索エンジンと、生成AIのクローラーを許可。
- llms.txt:サイトの要約と、主要なリンク。
JavaScriptの役割
メニューの開閉、グラフのアニメーション、数字のカウントアップ、言語の選択の記憶だけです。ページの内容を、JavaScript で作ることはしていません。