本文へ移動
Coffee Break Again AIと育てる、サイト制作の研究室

Articles

ホームページの作り方・修正・運営のガイド。

ホームページの作り方、AIへの指示、サイト修正、サーバーとドメインの選び方から、作品やキャラクターを紹介するサイトの設計まで。目的に合わせて読めるガイドをまとめました。

ブログの記事設計と、ホームページの機能の作り方

Web制作会社に頼む必要はある?AIで自作する費用と外注の判断

ホームページを制作会社へ頼む前に、ChatGPTやClaude Codeで小さく試してみませんか。AIの月額料金、制作会社の公開料金、自分の作業時間を比べ、難しい場合の相談方法まで紹介します。

ガイドを読む

アフィリエイトのPR表記はどこに置く?初心者向けの例文と表示方法

「広告を含みます」はどこに書く?初心者向けにPR表記の文例、タイトル右下へ移した実例、プライバシーポリシーとの役割の違い、HTML・CSSとAIへの指示例を紹介します。

ガイドを読む

AI指示書の書き方|同じサイト修正を繰り返さないための実例

余白や囲みを何度も直したCBAの実例から、AIへの指示書に残す内容を説明します。正しい例、避けたい例、確認方法、古い指示の更新を、使える記入例で紹介します。

ガイドを読む

ブログのキーワード選定とカテゴリー分け|記事の重複・カニバリを防ぐ基本

カテゴリーの分け方、MECEの使い方、記事ごとの役割を決める記事DNAを、サイト制作の具体例で説明します。AIに記事を頼む前の計画から、重複を見つけたときの判断まで。

ガイドを読む

ローカルストレージのメリット・デメリット|ログインなしで保存する仕組み

お気に入りやメモを、会員登録なしで保存したい方へ。ローカルストレージの仕組み、保存期間、消える条件、スマホとPCで共有できない理由を、自サイトの実例とAIへの指示例で説明します。

ガイドを読む

サイト内検索の設置方法|WordPress・静的サイトの選び方と改善例

ホームページに検索窓を付けたい方へ。WordPressと静的サイトの設置方法、検索対象の決め方、表記ゆれや0件の案内を、実際のサイトで試した結果とAIへの指示例で紹介します。

ガイドを読む

ホームページ制作とAI、サーバー・ドメインの基本

ホームページを自分で作るには?初心者が最初に決める5つのこと

ホームページ作りは、誰に何を伝えるかを決めるところから。個人ブログやお店のサイトを例に、必要なページ、作る道具、公開する場所、更新のしかたを順に整理します。

ガイドを読む

ホームページを自分で修正する方法|AIに伝える前の確認と頼み方

スマホで崩れる、文字が読みにくい、案内が分かりづらい。サイトの修正は、困っている場所を一つに絞るところから。バックアップ、AIへの指示、修正後の確認を紹介します。

ガイドを読む

AIでホームページを作る方法|初心者向けの指示・プロンプトの例

AIにサイト制作を頼むときは、目的、見る人、載せる内容、残したい条件を伝えます。構成を考える指示と、見た目や修正を頼む指示を、書き換えて使える形で紹介します。

ガイドを読む

ホームページのサーバー・ドメインの選び方|初心者のための公開準備

サーバーはサイトを置く場所、ドメインはサイトを訪ねるための名前です。WordPressやAstroで作る場合に何を選び、契約前に何を確認するか、最初の判断を整理します。

ガイドを読む

WordPressとAstroの違いは?ホームページを自分で更新する方法から選ぶ

管理画面で記事を書きたいならWordPress、ファイルを編集して見た目を作り込みたいならAstroが候補です。どちらもAIと使えます。更新方法と公開後の管理を比べて選びましょう。

ガイドを読む

ホームページ用レンタルサーバーの選び方|初心者が契約前に比べること

WordPressのブログやお店のホームページに合うレンタルサーバーを、更新料金、バックアップ、サポート、日々の操作から選びます。

ガイドを読む

独自ドメインの選び方と取得前の確認|ホームページの名前を決める

独自ドメインは、サイトを訪ねてもらうための名前です。覚えやすい名前、更新料金、サーバーとの組み合わせ、管理を続けるための注意点を、初心者向けに整理します。

ガイドを読む

Start here

作品・キャラクターを紹介するホームページの作り方

各記事は、一つの迷いや判断に答えるよう役割を分けています。人物、世界観、作品、公開運営のうち、今の目的に近いところから確認できます。

Character

人物像と関係性を、初見の読者が迷わないページへ変える。

キャラクター紹介ページの作り方|初見で人物像が伝わる情報設計

オリジナルキャラクターの紹介ページを、プロフィール項目の羅列ではなく、役割・行動・関係・作品への導線が伝わる順番に組み立てます。

キャラクター紹介ページを設計する

サイトに載せるキャラクター相関図の作り方|人数が多くても迷わせない見せ方

キャラクター相関図をWebサイトへ載せるときの中心人物、関係ラベル、情報量、文章での補足、個別ページへの導線を整理します。

サイト用の相関図を設計する

Worldbuilding

設定資料を読まれる記事へ変え、公開範囲を整理する。

世界観の設定資料を読まれるWeb記事に変える方法|辞典で終わらせない構成

手元の世界観設定をそのまま用語辞典にせず、読者の疑問、物語への影響、読む順番、作品への導線を持つWeb記事へ変換します。

設定資料をWeb記事へ変える

世界観設定はどこまで公開する?ネタバレを防ぐ公開範囲の決め方

世界観・人物・用語の設定を、最初から公開する情報、読後に見せる情報、非公開の正本へ分け、ネタバレを避ける判断基準を作ります。

設定の公開範囲を決める

Works

作品の入口と、実制作から得た情報設計をまとめる。

創作サイトの作品一覧ページの作り方|漫画・小説・投稿先を一つの入口にまとめる

漫画・小説・イラスト・動画が複数の投稿先に分かれていても、初見の読者が迷わない作品一覧ページの分類軸と掲載項目を解説します。

作品一覧ページを作る

作品サイト設計のケーススタディ|小さく公開する情報設計

キャラクターと世界観を扱うサイトを、小さく公開して育てるために、入口・情報のまとまり・更新単位をどう設計したかを実制作の記録から整理します。

情報設計の実例を読む

Publishing

公開判断、URL、検索、運営、読みやすさ、移行を整える。

作品サイトを無理なく更新する方法|止まっても戻れる運営設計

作品・人物・世界観・制作記録の更新単位を分け、更新頻度を約束しすぎず、止まった後も再開できる作品サイトの運営方法を整理します。

止まっても戻れる運営を作る

創作サイトのURL設計|後から変えにくいページ名と階層の決め方

作品・人物・世界観ページのURLを、短く、意味が変わりにくく、将来追加しても衝突しにくい形で決めるための設計手順を解説します。

創作サイトのURLを設計する

作品サイトが検索に出ないときの確認順|創作者向けSEOの基本

作品サイトが検索結果に出ないとき、未登録と順位不足を分け、robots・noindex・サイトマップ・内部リンク・タイトルを順番に確認します。

検索に出ない原因を確認する

創作サイトのアクセシビリティ入門|イラストと長文を読みやすくする最低限

イラスト・相関図・長文作品を扱う創作サイトで、代替テキスト、見出し、リンク、キーボード操作、色と動きの最低限を確認します。

創作サイトの読みやすさを確認する

イラスト中心の作品サイトを軽くする方法|画質を守る画像最適化

原画を保管したまま、表示サイズ、画像形式、レスポンシブ画像、width・height、遅延読み込みを整理し、作品サイトを軽くします。

作品画像を軽くする

SNSだけで十分?創作者が自分のWebサイトを持つ判断基準

XやpixivなどのSNSと自分のWebサイトを、発見、整理、始める負担、維持する責任の軸で比較し、向く人・向かない人を整理します。

SNSとの使い分けを読む

創作サイトの作り方|作品・人物・世界観の入口を小さく作る

小説・漫画・イラストを見せる創作サイトの作り方。手元の作品や設定から公開する内容を選び、代表作、人物、世界観へ進める最小構成を考えます。

創作サイトの最小構成を読む

旧URLを壊さないサイト移行|301・404・410の使い分けと確認手順

既存サイトを別テーマやサブドメインへ移すときのURL台帳、1対1リダイレクト、404・410、canonical、公開後確認を実例に基づいて解説します。

移行とリダイレクトを読む