WordPress インターネット ホームページ

【超初心者向け】WordPressで自分のホームページを作る方法 第1章 ホームページの仕組み解説からWordPressインストールまで・WEBエンジニア入門

このシリーズでは、「中学生でも分かる」をモットーに初心者の方向けに

WordPressを使った自分のホームページを制作する方法を完全解説していきます。

avatar
全章まとめると、有料教材並みのクオリティと胸を張って言えます
このシリーズはこんな人におすすめです

・全くの初心者で、WEBエンジニアを目指している
・SEOについて学びたい(後半解説)
・ホームページで稼いてみたいけど、やり方が分からない
・アフィリエイトに興味があるけど、ホームページの作り方が分からない
・自分の体験談や考えを発信するために、ホームページを用意したい

目次

解説環境

  • Windows10 PC
  • お名前.comのレンタルサーバー
  • WordPress バージョン5.6.2

初心者向けに徹底的に解説します

初心者の疑問

  • ドメインって何?
  • SSLって何?
  • レンタルサーバーって何?

全てわからなくても大丈夫!

わかりやすさ重視でこれから解説してゆきます!

最終的には、WEB検索した際に自分のサイトが上位の結果に出てくるよう調整する技術(SEOと呼びます)も解説します。

最後まで読み切って、あなただけのホームページを公開してみましょう!

インターネットに自分のホームページが公開されたときの嬉しさは、一生忘れませんよ!

ホームページの仕組み

まず、ホームページがどんな仕組みでインターネットに公開されるかを簡単に解説します。

ホームページ立ち上げに必要なもの、手続きは、以下の通りです。

1
独自ドメインを取得する

2
サーバー(WEBサーバー)を契約する

3
ホームページのサイトデータ(ページのデータ)を設置する

数字の順番で用意してゆきます。

では、独自ドメインとレンタルサーバーとは何でしょうか?

簡単に解説します。

独自ドメインとは

独自ドメインのイメージ画像

WEBサイトURLの「https://」より後ろの部分を指します。

このサイトのURLは

https://samurai-computer.comですので、

「samurai-computer.com」が独自ドメインとなります。

Yahoo JapanのURLは

「https://yahoo.co.jp」ですので、

「yahoo.co.jp」が独自ドメインです。

ホームページを公開するには、必ずこの独自ドメインを取得する必要があります。

独自ドメインは、自分で好きな文字列を決めることが可能です。

ちなみに、.(ドット)で始まる部分には、意味があります。

ドメイン単語の意味

  • com (Commercial:コマーシャル)の略
  • co.jp(コーポレーション.ジェーピー:日本の会社)
  • org(Organization:組織)
  • biz(Business:ビジネス)

他にも様々ありますが、種類が多いため割愛します。

自分のサイトに適したドメインを選択しましょう。

ブログサイトにorg(組織)ドメインは使うべきではありません。

独自ドメインは、レンタルサーバー(後述)を契約するタイミングで取得できます。

お名前.comなら、サーバー契約とセットで最安1円/年で取得可能です。

この記事では、お名前.comを契約する流れで解説をしていきます。

WEBサーバーとは

レンタルサーバーのイメージ画像

インターネットに公開するファイルを保存する場所です。

WordPress(ホームページ)のデータは、このレンタルサーバーに保存されます。

ホームページを更新する時は、レンタルサーバー上のファイルを更新することになります。

サーバーは自前で用意することも可能ですが、技術と設備が必要となりますので、レンタルサーバーを契約するのが一般的です。

レンタルサーバー会社には、様々あります

代表的なレンタルサーバー会社

代表的なレンタルサーバー会社

・お名前.com
・さくらインターネット
・ロリポップ
・エックスサーバー

各社特徴があります。

このシリーズではお名前.comを利用します。

なぜかというと、初期費用が安いのとサーバーにSSDが使われているためです。

SSDはファイルの転送が速いので、ホームページ表示が高速になります。

WordPressとは

wordpressロゴ

ワードプレスと読みます。

世界中のホームページ制作で使用されている、無料のシステムです。

市場シェアは39.5%。

2021年1月時点では、利用率トップを誇ります。

https://w3techs.com/technologies/history_overview/content_management/allより引用

皆さんが普段閲覧しているサイト、実はWordPressで制作されているものも多いのです。

“WordPress(ワードプレス)は、オープンソースのブログソフトウェアである。PHPで開発されており、データベース管理システムとしてMySQLを利用している。“

https://ja.wikipedia.org/wiki/WordPressより引用

WordPressの良さ

私は、「ホームページを作りたい」と言っている友人には まずWordPressをおすすめしています。

なぜかというと、初心者でも本当に簡単に整ったホームページを作れるからです。

WordPressの良さ

  • HTMLやCSSといった、言語の知識がなくても制作・編集が可能
  • 維持費用が安い
  • 無料のテーマ(着せ替え)が多数あり、オシャレなサイトを簡単に作れる
  • 拡張機能(プラグイン)を使用して、あとから様々な機能を追加できる
  • 利用者が多く、ネット検索すればトラブル解決できることが多い

それに対して、ホームページを自分でイチから制作するとなると多くの勉強が必要になります。

オリジナル制作の場合

  • HTML学習
  • CSS学習
  • SSL手動インストール
  • FTP操作

場合によっては

  • PHP学習
  • JavaScript学習
  • JQuery学習
  • Adobe Dreamweaverの契約と使い方(人による)

大変。最低でも上4項目の学習は必須になるため、挫折してしまう可能性が高いのです

ホームページ学習・制作するならまずはWordPressから初めるのがおすすめです。

独自ドメインを取得する

はじめに

ホームページの運営には、レンタルサーバー維持費が発生します。

この記事では、お名前.comでドメイン取得とレンタルサーバー契約をします。

お名前.comは、GMOインターネット株式会社が運営しています。

お名前.comを選ぶ理由

お名前.comのロゴ

お名前.comの良さ

・独自ドメイン実質無料
・初期費用無料
・独自ドメイン更新費無料
・独自SSL無料
・高速250GB SSD

SSDのおかげでサイト表示が高速になるのは、大きなメリットです。

希望の独自ドメインを探してみる

まずは、お名前.comのページにアクセスしてみましょう。

お名前.comにアクセス

取得希望のドメインを入力する画面が表示されます。

お名前.comトップページの画像

今回は、「i-love-japan」の文字列を取得してみます。

入力して検索してみます。

お名前.comドメイン検索画面
お名前.comドメイン料金一覧画面
  • i-love-japan.com
  • i-love-japan.net
  • i-love-japan.info

はすでに使用されているようです。(2021年2月1日時点)

お名前.comドメイン料金一覧画面

よく見ると、価格が違うのがお分かりでしょうか?

i-love-japan.incドメインは97,000円に対して、i-love-japan.workドメインはなんと1円!

今回は、i-love-japan.tokyoを購入します。

.tokyoにチェックを入れて、「料金確認へ進む」をクリックします。

お名前.comドメイン料金確認画面

ドメイン取得手続きとレンタルサーバーの申し込み

「スタンダードなレンタルサーバー」を選択しましょう。

お名前.comプラン選択画面

お申込内容の確認画面が表示されます。

レンタルサーバーの初期費用は無料なので、請求は0円です。

お名前.comお申し込み内容確認画面

「Who is 情報公開代行メール転送オプション」

「ドメインプロテクション」

のチェックは不要です。

お名前.comのアカウントを作成する必要がありますので、メールアドレスとパスワードを設定して「次へ」をクリックします。

名前・住所・連絡先を入力して、「次へ進む」をクリックします。

入力が終わったら、「次へ進む」をクリック。

お支払い方法選択の画面が表示されます。

お名前.comお支払い方法選択画面

クレジットカードが最も速く手続き完了するのでおすすめです。

今回は、クレジットカードで進めてゆきます。

お名前.com登録進行画面

私の環境では10秒ほどで終わりました。

完了すると、「お申し込みを受付けました」というページに遷移します。
verification-noreply@onamae.comから送信されたメールを確認し、ドメイン認証をします。

完了すると、登録したメールアドレス宛に色々メールが届きます。

※届いていない場合は、迷惑メールフォルダに入っていないか確認しましょう。

お名前.com登録完了メール

「ドメイン情報認証のお願い」という件名のメール記載のURLをクリックして、認証手続きを完了させます。

お名前.comドメイン情報認証のお願いメール

リンクをクリックし、正常に確認が完了すればOKです。

メールアドレスの有効性認証フォームの画面

インターネットに慣れていない方は、なかなか疲れる作業だと思います。

お名前.comの管理画面に入ってみる

先ほど届いた複数のメールに、会員IDが記載されています。

お名前.com会員ID記載のメール

この会員IDと、先ほど設定したパスワードを入力してお名前.com Naviにログインします。

お名前.com Naviログイン画面

ログインすると、ドメイン契約更新のページが表示されました。

こちらが、お名前.comの管理画面となります。

お名前.com Naviドメイン管理画面

これで、独自ドメインの取得とレンタルサーバーの契約が完了しました。

それでは、いよいよサーバーにWordPressをインストールしてみましょう!

WordPressのインストール

レンタルサーバーの設定画面へ移動します。

メニューバーの「利用レンタルサーバー 一覧」をクリック。

お名前.com Navi メニューバー

警告画面が表示されますが、関係ありませんので「更新画面から移動する」をクリックします。

お名前.com警告画面

レンタルサーバーの画面へ移動します。

サーバーのコントロールパネルに入るため、取得したドメインが表示されていることを確認して「ログイン」をクリックします。

お名前.comレンタルサーバー管理画面

コントロールパネルにログインすると、まず最初に初期パスワードの変更を要求されます。

第三者からの不正アクセスの危険性を減らすためです。

半角英数記号8文字以上70文字以内で、なるべく複雑なパスワードを設定します。

お名前.com コントロールパネル初期パスワード変更画面

このとき設定したパスワードは、忘れないようにメモをしましょう。

「お名前.comレンタルサーバーへようこそ」の画面が表示されます。

「作成する」をクリックします。

お名前.comレンタルサーバーへようこその画面

WordPressの作成方法を選択する画面が表示されます。

左の「新規作成」を選択します。

WordPressの作成方法選択画面

レンタルサーバーのアカウントでログインをします。

※この画面は、出る場合と出ない場合がある(?)ようです。

レンタルサーバーコントロールパネルログイン画面

レンタルサーバーコントロールパネルに入れたら、おすすめメニューの中にあるWordPressをクリックします。

WordPressの管理画面が表示されます。

「はじめる」をクリックします。

お名前.comのWordPress管理画面
お名前.comのWordPress設定画面

WordPressのインストールURLを設定できます。

URLに「www.」追加→「追加しない」を選択します。

「ドメインの後ろに文字列を追加」は、空白でOKです。

「情報入力する」をクリックし、次へ進みます。

WordPressホームページURL設定画面

WordPressのサイト情報を設定します。

WordPressホームページ情報設定画面

これらはあとから変更可能なのでご安心を。

WordPressパスワードは、#や@、&などの記号を使用する必要があります。

忘れぬよう、メモしておきましょう。

・データベースを指定して作成する

・WordPressテーマShopで購入したテーマを使用する

には、チェックを入れる必要はありません。

すべて入力が終わったら、「確認する」をクリックします。

ホームページ情報の最終確認画面が表示されます。

WordPressホームページ情報確認画面

間違いがないことを確認し、「完了する」をクリックします。

完了画面が表示されます。

WordPressインストール完了画面

これで、レンタルサーバーへのWordPressインストールは完了です。

画面に記載されている

  • データベース
  • ユーザー名
  • パスワード

の文字列情報は、コピー&ペーストしてドキュメントに保存しましょう。

お疲れさまでした!

次回の記事では、実際にWordPressの管理画面に入ってみます!

次の記事はこちら

人気記事

1

Apple Siliconへの各社アプリ対応状況まとめです。2021年6月現在、徐々にネイティブ対応完了のアプリが増えてきました。随時更新です。

2

Apple Watchって何ができるの?初代から5年間使用している私が、Apple Watchの機能と魅力をゆっくり解説してゆきます。

3

自分でWindows7からWindows10にアップグレードする方法を、徹底解説します!
2021年1月現在、今でもMedia Creation Toolを使えばWindows10への無料アップグレードは可能です!

4

長い間パソコンを使っていると発生しがちなWindowsの不具合を解消するための、4つの対処法を解説します。
セーフモード起動やDISM.exe、SFCスキャンを使用してメンテナンスをしてあげましょう。

-WordPress, インターネット, ホームページ
-, , ,

© 2021 サムライ コンピューター