ウェブページの作り方について、作成から公開までの全体像をざっくりと説明します。その前に、前提と準備のお話があります。前提では、ウェブページ、ウェブサイト、ホームページの違いを説明し、準備ではブラウザとエディタについて説明します。前提と準備の後に、ウェブページの作り方が始まります。
前提
ウェブページ、ウェブサイト、ホームページの違い
- ウェブページ
- インターネット上に存在し、ブラウザによって表示される個々のページを指す
- 例:今表示しているこの記事
- ウェブサイト
- 複数のウェブページが集まった特定のサイト全体を指す
- ホームページ
- 現在では、ウェブサイトと同じように使われている
- 本来は、ブラウザを立ち上げたときに最初に表示されるページを指す
- いつからかホームページは、サイトのトップページを指すようになり、現在では、ウェブサイトを指すことが一般的
ホームページ=ウェブサイトは誤用です。
準備
ブラウザとエディタ
- ブラウザ
- ウェブページを表示するためのソフトウェア
- 例:Google Chrome、Mozilla Firefox、Microsoft Edge、Safari、Operaなど
- エディタ
- プログラムやテキストを作成・編集するためのソフトウェア
- 例:Notepad(メモ帳)、Visual Studio Code、Sublime Textなど
エディタでウェブページのファイルを作成・編集し、その内容をブラウザで表示させます。ウェブページを作成するには、ブラウザとエディタを用意してください。
ウェブページの作り方
ウェブページの作成
HTML/CSS/JavaScriptでのコーディング
ウェブページを作るには、HTML、CSS、JavaScriptのコードを記述したファイルを作成します。それぞれの役割は以下の通りです。
- HTML
- ウェブページの構造と内容(コンテンツ)を定義する
- CSS
- ウェブページの見た目やレイアウトを装飾する
- JavaScript
- ウェブページに動きを持たせる
HTMLで構造とコンテンツを作り、CSSでスタイルを設定し、JavaScriptで動的な機能を追加することで、インタラクティブなウェブページが作成できます。
ウェブページの公開準備
レンタルサーバの契約
レンタルサーバとは、作成したウェブページのファイルを保管し、インターネット上で公開するために必要なサーバを借りることができるサービスです。レンタルサーバにファイルを置くことで、ウェブページが全世界に公開されます。
ウェブサイトに訪れた人は、レンタルサーバにアップロードされたファイルの内容を閲覧します。
ドメインの取得
自分のウェブサイトに独自のURL(例:www.example.com/のexample.comに当たる部分)を付けたい場合は、ドメインを取得します。ドメインとは簡単に言えば、ウェブサイトの住所です。
ドメインは、ドメイン登録サービス(例:お名前.com、バリュードメイン、ムームードメインなど)から取得できます。
※ドメイン取得は必須ではなく、レンタルサーバ側で用意されたURLも利用可能です。
レンタルサーバとドメインの連携
ドメインを取得した場合は、レンタルサーバとドメインを連携させます。具体的な方法については、各レンタルサーバやドメイン登録サービスのガイドをご確認ください。
SSL証明書の設定
セキュリティ向上とSEO対策のためにSSL証明書を設定し、サイトをHTTPS化します。これにより、URLが「https://」で始まるようになります。
ウェブページの公開
FTPソフトでファイルのアップロード
作成したウェブページのファイルをレンタルサーバに配置します。FTPソフトかレンタルサーバのFTP機能を使ってファイルをアップロードします。
公開後の確認と設定
表示・動作確認
各ブラウザやデバイスでウェブページが正しく表示されるか確認します。自分のウェブサイトのURLをブラウザのアドレスバーに入力してアクセスしてください。
SEOと解析ツールの設定
Google Search ConsoleやGoogle Analyticsなどの分析ツールを設定し、サイトパフォーマンスを可視化します。必要なければ設定しなくても問題ありません。
まとめ
以上がウェブページの作り方の全体像です。この手順に沿って進めることで、自分自身でウェブページを作成し公開することができます。具体的な作業内容については、当ブログや他のリソース(書籍や動画など)も参考にしてください。
