学習ゴール
- 文言修正・リンク差し替え・テンプレコピーによる記事追加など、非エンジニアでも安全にできる作業の範囲を説明できる。
- 目的・範囲・差分・ロールバックの4ステップを自分の作業に埋め込める。
前提知識
- ブラウザでHTMLプレビューできる環境、またはステージングURLがあると安心。
- Gitがわからなくても、バックアップコピーを取る習慣は必須です。
キーコンセプトと用語
- スコープ:触ってよいファイルと触らないファイルの境界。
- DOMの親子:HTMLの構造。親タグを壊すとレイアウトが崩れる。
- 相対パス:
./や../でリンク先を指す表現。切れやすい。 - ロールバック:変更前の状態に戻すこと。Undoまたはファイルコピーでも可。
手順(ステップバイステップ)
- バックアップ:対象ファイルを別名コピー。
- 目的1行:例)「料金ページのCTAボタン文言を更新」。
- 範囲指定:ファイル名と、変える見出しまたは行番号をチャットに書く。
- AIに依頼:変えていい要素/触れ禁止のブロックを明記。
- 差分確認:意図しない箇所の自動整形が混ざっていないか見る。
- 表示確認:ローカルまたはステージングでリンククリックまで実施。
- 記録:変更理由を1行残し、関係者に共有。
実践ミニ演習
- 演習1:
h2テキスト1か所だけ変え、他の見出しが変わっていないか確認。 - 演習2:外部リンクを1つ更新し、新規タブ属性や
rel属性が意図通りか確認。 - 演習3:既存記事を複製し、メタ情報だけ差し替える練習(画像パスに注意)。
セルフチェックリスト
- [ ] バックアップを取った
- [ ] 触ってよい範囲を文章化した
- [ ] 差分に余計な変更がない
- [ ] 主要導線のリンクをクリックした
- [ ] 関係者へ通知した
つまずきポイントと対処
- レイアウト崩れ → 閉じタグやクラス名を変えていないかdiffで確認。
- リンク切れ → 相対パス計算を人が追う。ルート相対なら
/始まりを確認。 - 変更が広がる → チャットを分け、ファイルを分け、1依頼1目的に戻す。
深掘り:デザインを壊さないコツ
既存のクラス名・構造を維持し、テキストノードだけを変えるのが最も安全です。色や余白を変えたい場合はデザイン担当とルールを決めると衝突が減ります。
次の伸ばし方
慣れたら 実践Tips でレビュー観点を増やし、Gitが使えるなら Git連携 で履歴管理に進みます。
運用ノート:社内CMSとの役割分担
CursorでHTMLを直す場合でも、本番反映はCMS経由かGit経由かを必ず手順書で固定します。権限の弱い職種ほど、ステージングURLでの確認とダブルチェック人員をセットに。写真差し替えは容量と著作権確認が絡むため、冒頭でスコープ外に切り出すと安全です。「とりあえずAIに投げる」ではなく、変更管理番号やチケット番号をチャット先頭に置くと後追いが楽になります。
(学習の定着)
組織学習の観点では、週次15分の振り返りをカレンダーに固定し、うまくいった依頼文や依頼テンプレは共有ドライブへコピーして資産化します。四半期ごとに公式の利用規約と社内ポリシーを突き合わせ、差分があれば短いチケットで追記してください。個人メモでも「日付・用途・入力の要点・出力の使い道」を1セットで残すと検索性が上がり、異動時の引き継ぎもスムーズです。ステークホルダー別の典型的な懸念(経営はROI、情シスは漏洩、現場は手間と心理的負担)を箇条書きで持っておくと、同じ学びを説明する場面でも言い換え疲れが減ります。公開可否が曖昧な資料はそもそもAIに入力しない、と自分で宣言しておく線引きメモがあると、日々の判断が速くなります。
なお学習効率を上げるには、「読む→15分で演習→翌週に同じ手順でもう一度」をカレンダーに3連続で置き、忘却曲線を意識するのがコツです。複数人で進めるときは教え合うペアと日時を先に仮押さえし、片方が欠席しても演習PDFだけで進められるようにリンク集を1枚添えておくと属人化が進みにくくなります。最後に、成果が出た週は短いログ(良かった依頼1行)を残し、出なかった週は「阻害要因」を1語だけメモして次週の設計に回すと改善が続きます。
まとめ:次に何をするか
今週中に「文言またはリンク」のどちらか1件だけをフロー通りに完了し、つまずきがあればチェックリストに追記してください。
ツール情報(公式リンク)
権利表記・引用について
Cursorは各社の商標または登録商標です。本記事は各社の公式提供ではありません。機能や提供条件は変更される場合があるため、最新情報は公式ページをご確認ください。
画像クレジット
サムネイル/本文画像はUnsplashの写真を使用しています(ライセンス:Unsplash License)。
お問い合わせ
Web更新の内製化・記事量産・運用設計のご相談はお気軽にどうぞ
📞 090-6262-3842