AI時代のWeb運用で役立つのは、AIへの伝え方と、変更を確認・記録・公開するための基礎知識です。まずは「VS Code＝編集する道具」「マークダウン＝文章の書き方」「Git＝変更履歴を残す仕組み」「GitHub＝ファイルと履歴を共有するサービス」と押さえましょう。
AI時代になぜ基本用語が必要なのか
AIに「お店の紹介ページを作って」「この文章を読みやすくして」と頼むと、原稿やプログラムの案を得られます。一方で、自然な文章でも営業時間が違ったり、見た目が整っていても予約ボタンが動かなかったりすることがあります。案を作ることと、仕事で使える状態にすることには、別の確認が必要です。
基本用語を知っていると、「どのファイルを編集したか」「何を変えたか」「まだ手元の案なのか、公開されたのか」を把握しやすくなります。制作会社への相談や担当者の引き継ぎにも役立ちます。
VS Code・マークダウン・Git・GitHubの違い
| 用語 | 役割 | 使う場面の例 |
|---|---|---|
| VS Code | ファイルを開いて編集する道具 | 記事の原稿やHTMLを修正する |
| マークダウン | 記号で文章の構造を表す書式 | 見出しや箇条書きで依頼を整理する |
| Git | 変更履歴を記録する仕組み | 料金表の変更前後を比較する |
| GitHub | ファイルや履歴をオンラインで共有するサービス | 担当者同士で修正案を確認する |
VS Codeとは？ 編集するための道具
正式名称はVisual Studio Code（ビジュアル・スタジオ・コード）。Microsoftが提供するコードエディターです。「VSCode」と続けて書かれることもあります。HTMLだけでなく文章ファイルも編集でき、Markdownのプレビュー機能もあります。Visual Studioという別の製品とは区別します。
AIを使う機能や拡張機能もありますが、エディターと、利用するAIサービスの契約・料金は分けて確認しましょう。基本操作はVS Code公式の入門ガイド（英語）を参照できます。
マークダウンとは？ 文章の構造を伝える書き方
Markdown（マークダウン）は、見出しや箇条書きを簡単な記号で表す書式です。ファイル名の末尾には.mdがよく使われます。専用のAI機能ではなく、人が読む原稿や手順書にも使える書き方です。
Gitとは？ 変更を記録して比べる仕組み
Git（ギット）は、ファイルの変更履歴を管理する仕組みです。ひと区切りの変更を説明とともに記録する操作を「コミット」といいます。AIに修正を頼んだあとも、前の状態との違いである「差分」を確認できます。Gitは手元のパソコンだけでも使えます。
ただし、保存しただけですべての状態がGitに記録されるわけではありません。残したい変更を意識して記録する必要があります。データベースやアップロード画像など、Gitで管理していないデータのバックアップも別に必要です。詳しくはGit公式の解説をご覧ください。
GitHubとは？ ファイル・履歴・修正案を共有するサービス
GitHub（ギットハブ）は、Gitで管理するプロジェクトをオンラインに置き、共同作業をするためのサービスです。GitとGitHubは同じものではありません。保管場所を「リポジトリ」、変更を取り込んでもらうための提案を「プルリクエスト」と呼びます。
リポジトリには公開・非公開の設定があります。非公開でも、閲覧権限のある人や連携サービスのアクセス範囲は確認が必要です。パスワード・APIキー・お客様の個人情報を、通常の原稿やコードと一緒に保存しない運用にしましょう。役割の違いはGitHub公式の解説にもまとまっています。
マークダウンでAIへの依頼文・記事を整理する
「いい感じに書いて」だけでは、誰に何を伝える記事なのかが曖昧です。目的・読者・確認済みの事実・仕上がりの条件を分けると、人にもAIにも意図を伝えやすくなります。たとえば次のように書けます。
# 依頼：カフェの駐車場案内の記事を作る
## 読者
車で初めて来店するお客様
## 確認済みの事実
- 駐車場は店舗の裏に3台分
- 満車時は近隣の有料駐車場を利用
- 提携駐車場はない
## 条件
- 最初に駐車場の場所と台数を伝える
- 不明な料金や距離は推測で補わない
- 確認が必要な点は、本文と分けて列挙する
- まず原稿案を作り、公開はしない#は見出し、##はその下の見出し、-は箇条書きです。これらの記号の後に半角スペースを入れます。**重要**のように囲むと太字になります。詳しくはGitHub公式のMarkdownガイドをご覧ください。
AIへの依頼から公開までの流れ
ファイルを直接編集するサイトなら、次の流れが一例です。CMSを使う場合は、下書き・プレビュー・公開機能に置き換えて考えてください。
- 目的と素材を用意する。
誰の疑問に答えるページかを決め、営業時間・価格・写真などの確認済み情報を揃えます。切り口はサジェストキーワードの調べ方も参考になります。 - AIに原稿や変更案を作ってもらう。
目的と条件を整理し、変更してよい範囲を伝えます。「まず案だけ」「このページだけ」と区切る方法もあります。 - VS Codeなどでファイルと差分を確認する。
依頼した文章以外に、料金・リンク・予約機能が変わっていないかも確認します。わからない変更は、目的と影響を説明してもらいましょう。 - プレビューで読み、操作して確かめる。
スマホ幅の表示、写真、リンク、問い合わせ先を確認します。文章の正しさは公式資料や社内の確定情報と照合します。 - Gitに記録し、必要に応じてGitHubで共有する。
「駐車場案内を追加」など、何をしたかがわかる説明でコミットします。共同作業では、ブランチという別の作業の流れやプルリクエストを使い、確認してから取り込む方法もあります。 - 公開し、公開URLでも確認する。
サーバーなどへ変更を反映することを「デプロイ」と呼びます。新しいページはXMLサイトマップにも追加し、必要に応じてSearch Consoleで確認します。
AIで書いた記事とSEOの関係
Googleは、生成AIを調査などに役立てられる一方、利用者に価値を加えず大量のページを生成することはスパムに関するポリシーに違反する可能性があると説明しています。AIを使ったかどうかだけでなく、読む人の役に立つ内容かを確認することが大切です。詳しくはGoogle公式の生成AIコンテンツに関する案内をご覧ください。
お店の記事なら、実際の駐車場の写真、入口の目印、予約時によく聞かれる質問など、そのお店で確認した情報を加えられます。「便利です」「おすすめです」といった一般論だけで終わらせず、お客様が来店や問い合わせを判断できる内容にしましょう。
AIが存在しない出典や誤った事実をもっともらしく書くことは「ハルシネーション」と呼ばれます。価格・日付・仕様・引用先を確かめ、タイトルと本文が一致しているかも確認します。AIを使うだけで、上位表示やAIの回答への掲載が保証されるわけではありません。
公開前に確認したいチェックリスト
- 読者と、答える疑問がはっきりしている
- 店名・営業時間・料金・住所・日付を確認した
- 引用先を実際に開き、出典と本文の内容が合っている
- 自店の経験や確認済み情報が入り、一般論だけになっていない
- 画像・文章の利用条件を確認し、個人情報や秘密情報が入っていない
- 差分を確認し、変更履歴や必要なバックアップを残した
- スマホで読めて、リンクや問い合わせの操作ができる
- タイトル・説明文・内部リンク・サイトマップを整えた
- 公開URLで内容と動作を確認する担当者が決まっている
公開後も、問い合わせの内容やSearch Consoleの表示・クリックを見ながら改善します。検索への登録や順位の上昇には、保証された日数はありません。
よくある疑問
プログラミングができないとAIは使えませんか？
文章の下書きや構成の相談なら、プログラミングは不要です。サイトのコードを変更する場合は、内容を確認できる担当者と、元に戻す方法を用意して進めましょう。
GitとGitHubは両方必要ですか？
Gitだけで手元の変更履歴を管理できます。共有やオンラインでの確認が必要になったら、GitHubなどを組み合わせます。CMSや制作体制によっては、担当者が直接操作しない運用もできます。
マークダウンで書かないとAIに伝わりませんか？
普通の文章でも伝えられます。見出しや箇条書きで目的と条件を分けると、依頼の抜けを人も見つけやすくなります。
何から始めればよいですか？
まずは既存記事1本の改善案をAIに作ってもらい、事実と出典を確認してみましょう。ファイルを編集する必要が出てきた段階で、VS CodeやGitを学ぶ進め方でも構いません。関連する言葉は用語集「AI・制作の道具」でも確認できます。
参考にした公式資料
- Visual Studio Code：入門ガイド（英語）
- Visual Studio Code：Markdownの編集とプレビュー（英語）
- Git公式：Gitの基本
- GitHub Docs：GitHubとは・Gitとの関係
- GitHub Docs：Markdownの基本構文
- Google検索セントラル：生成AIコンテンツのガイダンス
AIを取り入れた記事の更新やホームページの運用方法に迷ったら、ＹＫプランニングへご相談ください。更新する人や内容に合わせて、続けやすい方法をご提案します。