本文へ移動
Coffee Break Again キャラクターと物語のWebサイト設計

Articles

作品世界のWebサイトを、設計して育てる。

キャラクター紹介、作品一覧、世界観の公開、URL・検索・アクセシビリティ・画像など、創作サイトを設計して育てる14本のガイドです。

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との使い分けを読む

創作者向けWebサイトの作り方|最初に決めることと公開までの順番

Web制作未経験の創作者に向けて、作品サイトの目的、読者の入口、最小ページ、URL、公開前確認を順番に解説します。

公開までの手順を読む

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

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

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