HP初心者講座
せっかく作ったWebサイトも、自分のパソコンの中にあるだけではまだ誰にも見てもらえません。
今回は、いよいよ インターネット上にWebサイトを公開する方法をわかりやすく説明します。
公開の方法
レンタルサーバーを使えば、難しい設定も不要です。
- レンタルサーバー:Webサイトのデータを置く場所
- ドメイン:サイトの住所
- HTML/CSSファイル:家の中身
サーバーにアップロードすることで、ドメインから誰でも見られるようになります。
公開に必要なもの
| 項目 | 役割 | 例 |
| レンタルサーバー | サイトデータを置く場所 | エックスサーバー、ロリポップ!、さくらのレンタルサーバー |
| ドメイン | サイトの住所 | example.com |
| HTML/CSSファイル | サイトの中身 | index.html、style.css など |
まずは、レンタルサーバー契約とドメイン取得が最初のステップです。
公開手順(基本の流れ)
Step1:サーバー契約とドメイン取得
契約時に簡単にドメインも取得できるプランを選ぶと便利です。
契約情報は後でFTPログインや管理画面で使います。
Step2:ファイルをアップロード
サーバーの管理画面にログインして、「ファイル管理」「アップロード」などの機能で、作ったHTML/CSSファイルをサーバーに置きます。
フォルダ構成はそのままアップロードします。
Step3:ブラウザで確認
取得したドメインにアクセスして、ページが正しく表示されているかチェックします。
ポイント
画像パスやリンク先がズレていないか確認しましょう。
特に「画像が表示されない」「文字化けする」は初心者がよくつまづくポイントです。
公開後のチェックポイント
- スマホでもきれいに見えるか?
- リンク切れはないか?
- 画像は表示されるか?
- 表示速度は遅くないか?
- タイトルや説明文がわかりやすいか?
最初は「見えるかどうか」だけで安心しがちですが、細かいチェックも大事です。
トラブル時の対処法
| よくあるトラブル | 原因 | 対処法 |
| 画像が表示されない | パスの指定ミス、画像がアップロードされていない | /images/◯◯.jpg の場所を確認 |
| 文字色や背景色が表示されない、レイアウトが崩れている | cssファイルのリンクミスや、cssファイルがアップロードされていない | cssファイルの確認、html内のcssファイルに対するリンクを確認 |
| 更新が反映されない | キャッシュが残っている | ブラウザの再読み込み・キャッシュ削除 |
焦らず1つずつ確認すれば必ず直ります
まとめ
Webサイトを公開するには「ドメイン」「サーバー」「ファイル」の3つが必要
ファイルをアップロードすれば誰でもアクセスできるようになる
公開後はスマホ表示やリンクをチェックして完成!
Webサイトを公開すると、一気に「自分の作品」としての実感が湧きます。
この達成感は、次のステップ(SEOやSNS)につながる大切なモチベーションになります。
次のステップ
次回は、「見つけてもらえるサイトを作る」=基本のSEOとタイトル設定について解説します。
「せっかく作ったのに誰も見てくれない…」を防ぐためのポイントを紹介します!
初心者の皆様へ
「CSSファイルが反映されない…」
「画像の位置がずれてしまう…」
そんな方は、私がココナラに出品しているWebサイト制作サービスをご利用ください。
- 高品質テンプレートでデザインも安心
- 自分で更新できるWebサイト(WordPress)
- 実用的な機能多数
- 操作マニュアル付き
- 公開後2週間の無料サポート



