テンプレート変更

テンプレート選択

テンプレートを選択して「変更」ボタンをクリックしてください。

Loading...

初心者でもできる!Webサイトを公開してみよう

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週間の無料サポート

   

関連記事