GitHub Pages で簡単にホームページを作る方法（公開までの完全ガイド）

GitHub Pages を使うと、無料で静的なホームページを公開できます。

HTMLファイルをアップロードするだけ なので、初心者でも簡単!

手順内容
①GitHub アカウント作成
②新しいリポジトリを作成
③index.html を作成
④GitHub にアップロード
⑤GitHub Pages を有効化
⑥公開URLを確認

📌 ① GitHub にアカウントを作る（すでに持っていればスキップ）

  1. GitHub にアクセス
  2. 「Sign up」 をクリックしてアカウントを作成
  3. メール認証を完了し、ログイン

📌 ② 新しいリポジトリを作成する

  1. GitHub にログイン
  2. 画面右上の 「＋」 をクリック → 「New repository」 を選択
  3. 以下の情報を入力
    • Repository name: my-homepage（好きな名前でOK）
    • Public（公開） を選択
    • 「Add a README file」にはチェックを入れない
  4. 「Create repository」 をクリック

📌 ③ HTML ファイルを作成する

方法1：ローカルで作成

  1. デスクトップに「my-homepage」フォルダを作る
  2. メモ帳や VS Code で index.html を作成
  3. 以下のコードをコピー＆ペースト

<!DOCTYPE html>

<html lang=”ja”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>My Homepage</title>

    <style>

        body { font-family: Arial, sans-serif; text-align: center; padding: 20px; }

        header { background-color: #4CAF50; padding: 10px; color: white; }

        section { margin: 20px; }

    </style>

</head>

<body>

    <header>

        <h1>ようこそ！</h1>

    </header>

    <section>

        <p>これは GitHub Pages で公開したホームページです。</p>

    </section>

</body>

</html>

_____________________________

  1. index.html として保存

📌 ④ GitHub にアップロード

方法1：GitHub で直接アップロード

  1. 作成したリポジトリ（my-homepage）にアクセス
  2. 「Uploading an existing file」をクリック
  1. index.html をドラッグ＆ドロップ
  2. 「Commit changes」をクリック

📌 ⑤ GitHub Pages を有効にする

  1. リポジトリの「Settings（設定）」を開く
  1. 左のメニューから「Pages」をクリック
  1. 「Branch」の項目で main を選択し、「Save」

確認方法

  1. 「Your site is live at https://ユーザー名.github.io/my-homepage/」 と表示される

📌 ⑥ 公開URLを確認

  1. 数分待つ（反映されるまで時間がかかることがある）
  2. https://ユーザー名.github.io/my-homepage/ にアクセス
  3. ホームページが表示されれば成功！ 🎉

私の場合は１０分たっても公開が反映されていない！！！！いつになったら。。。。

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です