ホームページ冒頭デザイン1案 / 納品形式の見本
最初に：ZIPファイルを展開してから、index.htmlを開いてください。
パソコンのブラウザーで確認できます。インターネット接続や、専用アプリの
インストールは必要ありません。開くだけで一般公開されることはありません。
4つのファイルは、同じフォルダーに置いたまま使います。
これは架空のサービスを題材にした見本です。顧客への納品実績ではありません。
この見本だけで、実際の注文・制作条件が確定するものではありません。
1. 入っているもの
index.html : ダブルクリックしてブラウザーで見る、冒頭1画面のデザイン
style.css : 配色、文字の大きさ、余白、図形、スマホ向け表示
content.txt: 文章だけを読み、検討・修正するための控え
README.txt : この説明
2. 画面を開いて確認する
・パソコンでindex.htmlをダブルクリックし、冒頭の見せ方を確認します。
・ブラウザーの横幅を狭くすると、小さな画面での並びを確認できます。
・「片付けの相談をする」ボタンは、同じ画面の説明欄へ移動します。
注文、問い合わせ、メールの送信は行いません。
・見出しと説明を読み、誰に向けた何のサービスと伝わるか確認します。
・画像や配色が事業の印象と合うか、この方向で次の制作を進めたいかを
社内で確認するために使えます。
・社内に見せるときは、4つのファイルが入ったフォルダーごと共有します。
index.htmlだけを送ると、配色や配置が表示されません。
3. 修正したい内容をまとめる
・「どの箇所を」「何に変えたいか」を、1つの文書やメールにまとめます。
例：「机が整うと、の見出しを○○へ」「画像を添付の写真へ」。
・文章はcontent.txtをコピーして検討できます。
content.txtを変更しても、画面には自動反映されません。
・実際のご依頼では、合意した修正範囲・回数・確認期限をご確認ください。
この見本のボタンやファイルから、修正依頼は送信されません。
4. 次の制作へ引き継ぐ
・この見せ方をもとに本制作を検討するときは、4つのファイルと、
残したい部分・変更したい部分・追加で伝えたい内容を制作者へ渡せます。
・本制作は別の依頼です。自動契約や、依頼を続ける義務はありません。
・サイト全体、一般公開、フォーム、サーバーやドメインの契約は
この見本に含まれていません。必要な作業と費用は、別に確認します。
・実案件の納品物・第三者素材を再利用できる範囲は、注文時の条件に従います。
5. 自分でファイルを編集する場合（任意）
・元のフォルダーをコピーし、コピー側で編集すると戻しやすくなります。
・画面の文章は、index.htmlをメモ帳などのテキスト編集アプリで開き、
「見出し」「補足文」の案内の近くの文言を編集します。
や
などの記号は残し、UTF-8で保存します。
・配色はstyle.cssの冒頭の5色を変更します。
--paperは背景、--inkは本文、--sageは図形背景、--accentはボタンです。
・保存したらブラウザーを再読み込みし、PCと小さな画面の両方で確認します。
・画像への置換や本番公開は、このサンプルの説明範囲を超えます。
本制作で依頼する場合は、内容と費用を別に確認します。
6. 素材と権利
・文具と余白は架空のサービスです。実在事業や顧客への納品実績ではありません。
・HTML/CSS、文章、CSSの図形は、この制作見本用に作成したものです。
・第三者の写真、有料素材、Webフォント、外部プログラムは同梱していません。
・文字は端末にあるフォントで表示されるため、端末により見え方が変わります。
フォントファイルそのものを配布しているわけではありません。
・本番で使用する原稿・画像は、掲載する事実と利用権を別途確認します。
実案件の納品データや第三者素材の権利は、その注文書等の条件を確認します。
7. 困ったとき
・装飾が出ない：ZIPの中ではなく、展開後のindex.htmlを開いているか、
同じフォルダーにstyle.cssがあるか確認してください。
・変更が出ない：編集したファイルを保存し、ブラウザーを再読み込みします。
・サンプルのボタンを押しても申込みは届きません。
実際のご相談は、AIつくるスタジオの案内ページからお進みください。