2024.06.18

素のHTMLで構築されたホームページを無料で編集する方法とホームページいじれるくん®︎

更新日:2024.09.28

  • 機能
  • 解説

素のHTMLで構築されたホームページを無料で編集する方法とホームページいじれるくん®︎

素のHTMLで構築されたホームページを無料で編集する方法を詳しく紹介します。以下は基本的な手順です。

1. 必要なツールの準備

a. FTPクライアントソフトをインストール

ホームページのデータはサーバーに保存されているため、ファイルを取得・更新するにはFTP(File Transfer Protocol)ソフトが必要です。おすすめの無料FTPソフトは「FileZilla」です。

チェックポイントホームページいじれるくん®︎ではここまでの面倒な対応が不要です!この概念が不要です。

b. テキストエディタを用意

HTMLファイルの編集にはテキストエディタが必要です。Windowsのメモ帳でも可能ですが、コードに特化したエディタの方が効率的です。おすすめの無料エディタには以下のものがあります。

チェックポイントホームページいじれるくん®︎ではこの面倒な対応が不要です!この概念が不要です。

2. サーバーに接続する

a. FTP接続情報を準備

サーバーに接続するために、サーバーのFTP情報が必要です。通常、以下の情報を使用します。

  • FTPホスト名(例: ftp.example.com)
  • ユーザー名とパスワード
  • ポート番号(通常21)

b. FTPソフトでサーバーに接続

FileZillaを起動し、上記のFTP情報を入力してサーバーに接続します。成功すると、左側が自分のパソコンのファイル、右側がサーバー上のファイルが表示されます。

チェックポイントホームページいじれるくん®︎ではこの面倒な対応が不要です!この概念が不要です。

3. HTMLファイルをダウンロード

a. 対象ファイルを見つける

ホームページのHTMLファイルは、サーバー上のフォルダに配置されています。通常、index.htmlabout.htmlなど、ページに関連するファイルが格納されています。ファイル名が分からない場合は、サーバー管理者に確認してください。

b. ローカルにダウンロード

編集したいファイルを右クリックし、「ダウンロード」を選択します。これでファイルがパソコンに保存されます。

チェックポイントホームページいじれるくん®︎ではこの面倒な対応が不要です!この概念が不要です。

4. HTMLファイルの編集

a. テキストエディタでファイルを開く

Visual Studio Codeやメモ帳などのテキストエディタで、ダウンロードしたHTMLファイルを開きます。HTMLタグや内容を確認し、修正や追加を行います。

b. HTMLの基本構造を確認する

HTMLファイルは、基本的に次のような構造になっています。

        <!DOCTYPE html>
        <html>
        <head>
            <title>サイトのタイトル</title>
        </head>
        <body>
            <h1>メインの見出し</h1>
            <p>ここに本文が入ります。</p>
        </body>
        </html>
    

<body>タグ内の内容を修正することで、ページに表示されるテキストやリンク、画像を変更できます。

c. 編集例

たとえば、見出しを修正したい場合、次のようにします。

        <h1>メインの見出しを変更しました</h1>
    

また、画像を追加したい場合は次のように記述します。

        <img src="images/photo.jpg" alt="写真の説明">
    
チェックポイントhtmlなどの専門知識がないと、ここまでの対応はハードルが高く、苦手意識を持ってしまうことが多いのですが、ホームページいじれるくん®︎では全くそのような知識が不要で、誰でも楽々簡単に編集ができてしまいます。

下記の短い動画を見てその手軽さを確認してみてください。

ホームページいじれるくん®︎のウェブサイトにある、とある1ページを編集して本番化するまでの一連の手順を紹介しています。(1分50秒)



こちらは、ホームページいじれるくん®︎FREEでページを編集してhtmlデータをゲットするまでの一連の手順を紹介しています。(44秒)

5. 編集したファイルをサーバーにアップロード

a. FTPでアップロード

FileZillaに戻り、編集したファイルを右クリックして「アップロード」を選択します。これにより、編集後のファイルがサーバーに上書き保存されます。

b. ブラウザで確認

アップロードが完了したら、ブラウザでホームページを開き、変更が反映されているか確認します。もしうまく表示されていない場合は、ブラウザのキャッシュをクリアして再度確認することをお勧めします。

チェックポイントホームページいじれるくん®︎ではこの面倒な対応が不要です!ボタンひとつでアップロード(テストアップまたは本番化)

6. バックアップの重要性

ホームページの編集を行う際は、必ず元のファイルのバックアップを取っておくことが重要です。編集によって誤ってデザインを崩してしまったり、内容を削除してしまった場合、バックアップがあればすぐに元に戻せます。編集前に、ファイルを別のフォルダにコピーして保存しておくと安心です。

チェックポイントホームページいじれるくん®︎ではこの面倒な対応が不要です!自動で3世代までバックアップ。いつでも元に戻せます。

まとめ

素のHTMLで構築されたホームページを編集するためには、FTPソフトとテキストエディタを使用して、サーバー上のファイルをダウンロードし、編集後に再アップロードします。これにより、特別なソフトや有料のツールを使わず、無料で簡単にホームページを編集することができます。

おすすめポイント1ホームページいじれるくん®︎ではこのような一連の複合的な面倒な作業が不要です!やりたいことがログインしてポチポチ操作だけで完結してしまう、とっても便利なサービスです。 おすすめポイント2ホームページいじれるくん®︎は、素のHTMLだけではなく、最近当たり前のように使われているphpで構築されたページにも対応しています。

簡単ホームページ編集
ホームページいじれるくん®︎
TOPへ