初心者も安心！webサイト編集の基礎知識と実践ポイント

編集の始め方（実際の流れ）

1. バックアップを取る（ファイルをコピー、またはCMSのエクスポート）。
2. 開発環境で編集する（ローカルPCやステージングサイト）。
3. ブラウザの開発者ツールで見た目を確認し、問題なければ本番へ反映します。

具体的な作業例

• FTP/SFTPでファイルをアップロード：サーバーのpublic_htmlにindex.htmlを置く。
• WordPressではダッシュボード→投稿／外観→カスタマイズで編集します。

初めて編集する際の注意点

• 変更前に必ずバックアップを取ること。プラグインやテーマの更新は別途確認してください。
• 小さな変更を段階的に行い、ブラウザキャッシュをクリアして動作確認してください。

これらを押さえておくと、編集作業がぐっと安全で効率的になります。

HTML・CSSファイルの編集方法

準備（バックアップとツール）

編集前に必ず元のファイルをバックアップします。サーバーからコピーを取るか、ローカルに別名で保存しておきます。FTPソフト（例：FileZilla）、テキストエディタ（例：VS Code、Sublime）を用意します。

サーバーからファイルをダウンロード（FTP）

FTPでサーバーに接続し、編集対象のHTML/CSSファイルをダウンロードします。接続情報はホスティング会社から確認します。ファイルのパスを間違えないように注意してください。

ローカルでの編集（テキストエディタ）

テキストエディタでHTMLやCSSを開き、変更を加えます。色や余白の調整はCSS、文言や構造はHTMLを編集します。小さな変更ごとに保存し、差分を残すと戻しやすくなります。

ローカルでの動作確認（仮想サーバーの利用）

PHPやDBが必要なサイトはXAMPPやLocalなどでローカル環境を作り、表示やリンクを確認します。静的ページならブラウザでファイルを開くだけで確認できます。

修正ファイルのアップロードと本番確認

編集済みファイルをFTPでサーバーにアップロードします。上書き前にバックアップがあることを再確認してください。アップ後は本番サイトで表示、リンク切れ、レイアウトをチェックします。キャッシュが残る場合はブラウザのキャッシュをクリアしてください。

よくあるトラブルと対処

・文字化け：文字コード（UTF-8）を確認します。
・反映されない：キャッシュやファイル名の誤りを確認します。
・パーミッションエラー：FTPでファイル権限を確認し、必要なら変更します。

CMS（WordPress）の編集方法

概要

WordPressなどのCMSは管理画面から直接ページや投稿を編集できます。HTMLやCSSを知らなくても、ビジュアルエディタやブロック（Gutenberg）で直感的に作業できるのが特徴です。テーマやプラグインで編集できる範囲が変わるため、作業前にバックアップを取ると安心です。

管理画面にログインして編集する基本手順

1. サイトの管理画面（例: yoursite.com/wp-admin）にログインします。
2. 「固定ページ」や「投稿」から編集したい項目を選んで「編集」をクリックします。
3. 文章や画像を変更し、「プレビュー」で確認したら「更新」を押します。

編集の種類と具体例

• ビジュアル（ブロック）エディタ：見出しや段落、画像ブロックをドラッグして配置します。初心者向けです。
• ページビルダー（例: Elementor）：レイアウトを細かく調整できます。操作は直感的ですが、テーマとの相性に注意してください。
• プラグイン設定：お問い合わせフォームやSEOはプラグインの設定画面から編集します（例: Contact Form 7、Yoast）。

テーマやコードを編集する場合の注意

テーマ編集やCSS追加は「外観」→「カスタマイズ」や「追加CSS」から行います。テーマのファイルを直接編集する場合は子テーマを使って変更を残すことをおすすめします。

バックアップと復元

更新前にバックアップを取りましょう。ホスティングの自動バックアップやプラグイン（例: UpdraftPlus）を利用すると簡単です。

トラブル時の基本対処

編集後に表示がおかしいときは、キャッシュをクリアしてプラグインを一時停止して原因を切り分けます。権限で編集できない場合は管理者に問い合わせてください。

これらの流れを押さえておくと、WordPressでの編集がスムーズになります。

Webサイトのキーワード（SEO対策）の編集方法

なぜキーワードを編集するか

検索される言葉（キーワード）は、サイトを見つけてもらうための案内表示です。適切な言葉を使うと、検索結果で目立ちやすくなり、訪問者の目的と合った人を集められます。

WordPressでの編集方法

• サイトタイトル・キャッチフレーズ：管理画面→設定→一般で変更します。短くて分かりやすい表現を心がけてください。例：「横浜のパン屋｜天然酵母パン」
• 投稿・固定ページのタイトルと見出し：編集画面でタイトル（H1）とH2を調整します。タイトルは検索キーワードを前に置くと効果的です。
• metaディスクリプション：SEOプラグイン（例：Yoast）やテーマの設定から入力します。120〜160文字を目安に、ページ内容を簡潔に伝えてください。

FTPで直接HTMLを編集する場合

• titleタグ：