※当ページのリンクには広告が含まれています
現代では何か行動をする前にはほぼ100%の人が「調べる」という行為をする事が主流になっています。
特に会社を運営していたり、フリーランスであったりする場合には、サービスの紹介のためにホームページやサイトを運営している事は必須級になってきます。大体サービス内容などをネットで調べますよね。
会社の場合には登記の時点で電子公告を選んでいる場合には制作していないとダメなので、そういった意味でも必須です。ただ、WEB制作会社やデザイン会社にサイト制作を依頼するとコストがかかります。
ホームページ・サイト制作の単価相場:200,000円~2,000,000円程度
専門業者に依頼すると、SEO的に有利だったり、ブランドイメージが表現できるように作り込んであって集客に繋がったり色々いい事もありますが、ロゴを作ったり他にもお金をかけたい部分は色々あります。
そこで今回は、WEBの専門家でなくても自分でサーバーを借りて、独自ドメインを取得して、ワードプレスを使ってサイトとかブログを作るための方法と全体的な制作の流れをご紹介していこうと思います。
Contents
メインに使う専門用語の解説
自分でサイトやブログを作ろうと思った時に、まず1つ目のハードルなのが色々な専門用語になります。
ただ、1回理解さえしてしまえば別に難しい話ではないので、サイト制作の方法や全体的な流れを解説する前に、ココでメインに使う専門用語の意味を解説してしまって、後からサクッと読めるようにします。
- サーバー
- ドメイン
- HTML / CSS
- ワードプレス
- SEO
今回の記事中で分かっていて欲しいのは5つのワードなので、この5つについて解説をしていきます。
▸サーバー
サーバーというのはめちゃくちゃ簡単に言えば、電源つけっぱなしの超高性能パソコンの事を言います。
その超高性能パソコンをベースにして、自由に使える土地を借りておくという感覚が近いと思いますね。
なので「レンタルサーバー」というのは、サーバー会社から超高性能なパソコンの機能を借りるという事になります。サーバーにも色んな種類がありますが、サイトを公開するのには共有サーバーで充分です。
例えばですが、自宅パソコンをサーバーにしてそのサーバー上でサイト運営する事もできますが、電源を切ったらサイトも非公開になってしまうので、24時間・365日電源切れない状態になってしまいます。
それに、電気代もかかってしまうのと、高性能なパソコンを用意する必要もあって全体的なコストもかさみますし、定期的なメンテナンス等も考えると、特別な事情が無ければサーバー会社から借りましょう。
▸ドメイン
ドメインというのは、ネット上の住所と例えられることが多いです。サイトURLの最後の部分の事です。
先ほど紹介したサーバー上にこのドメインを置いて、そこに企業や個人のサイトを建てるイメージです。
このサイトで言えば「mono-journal.com」というのがドメインで、ドメイン会社と契約してその期間中は「mono-journal.com」ドメインを独占的に弊社が使える様な形で所持しているという感じです。
なので、他の方はめちゃくちゃ使いたくても「mono-journal.com」というドメインは使う事はできません。会社名や屋号をつける時にこのドメインが使えるかという点も気にしておくと後々悩まないです。
ちなみに「.com」「.net」等の分野別ドメインに関する部分が違えば別のドメインとして認識されるので「mono-journal.com」は使えませんが「mono-journal.net」が空いてれば使う事は可能です。
コレらの自分で取得するドメインのことを「独自ドメイン」と呼んでいて「note(note.com)」や「アメブロ(ameblo.jp)」等他サイトのサービスを使ってサイトを運営する事とは別で扱われます。
独自ドメインの場合には管理者が自分になるので、契約し続ければ自分や会社の資産として持ち続けられますが、サービスで提供されてるURLだとサービスが終了した時点で内容が全て無くなってしまいます。
独自ドメインではないとサイト移行も難しいため、独自ドメインでサイトを始めるのはかなり大切です。
ドメイン自体も育てると価値がありますが、ブログやサイトの記事・内容にも価値があるので、何か特別な方略が無い限り、しっかり資産として自分で管理できる様に独自ドメインで運用する様にしましょう。
▸HTML / CSS
HTMLとCSSはプログラミング言語の中の1つで、ホームページを作る時の基礎となるプログラムです。
HTMLがWEBサイトの構造を全て作っていて「配置・色・線・影・大きさ」みたいな見た目に関する部分をCSSで作っているという感じです。自分でサイトを作る時に今では1からHTMLやCSSを打ち込んだりする必要は無いですが、サイトの見た目をある程度整えたりする部分で知識があるとやりやすいです。
サイトをカスタマイズする際にはほとんど指示通りにCSSのコードなどをコピペすれば問題ないです。
▸ワードプレス
ワードプレスとは主に「PHP」というプログラミング言語で構成されているCMSのシステムの事です。
CMSというのは「Contents Management System」の略称で、先ほど紹介したHTMLやCSSを使わずにコンテンツを管理できます。そのCMSの中の1つに「ワードプレス」というモノがある感じです。
ページ数も少なく、更新自体もほぼない場合はCMSを使わなくても管理が必要ないので問題ないのですが、どんどん更新していこうと思うと、ウェブの知識が少なくても更新できるCMSが必須になります。
そのCMSの中でも特に有名なのが「ワードプレス」で、他にもWIX・Jimdoなど色んな種類がありますが圧倒的なシェアを誇っています。無料のCMSなので誰でも手軽に使えて情報も多いのも良い所です。
▸SEO
SEOとは「Search Engine Optimization」の略称で「検索エンジン最適化」の事を指しています。
例えば「会社の決算の電子公告を載せるためだけにサイトが必要」というのであればSEO対策は必要ないですが、何かしらのワードで検索してもらいたいと思ったらサイト作りの中で意識する必要があります。
ただ、SEOに関して詳しくお話するとそれだけでこの記事が終わってしまいますし、SEOの専門家の方が多く記事を書いているので、記事中ではあくまで1つのキーワードとして使うまでに抑えておきます。
ホームページ・サイトの作り方と流れ
重要なワードの解説が終わった所で、ホームページ・サイトの作り方と全体の流れを解説します。
サーバー契約→独自ドメイン取得→サーバーとドメインの紐づけ→ワードプレスの導入→サイト設定
全体の大きな流れを示すと上記の様な流れになっていて、時間がかかっても全部で1時間位で済みます。
1. サーバーを契約(おすすめのサーバー解説)
まずはサイトを運営する事になるレンタルサーバーを契約する必要があります。
サーバー会社は何社もありますが「プラン料金・安定感・サーバー性能(速度)」で選ぶのがいいと思います。個人的には色々な点から比較して「Xserver」か「ConoHa WING」の2択と思っています。
・XSERVER:業界大手で長年サーバーを安定して供給していて速度や料金含めて信頼感がある
・ConoHa WING:とにかくサーバー性能(速度)が高くてサービスの面でも充実している
料金に関してはどちらともほぼ同じ程度で「月額:1,000円~2,000円」のプランがあります。最近は速度重視で「ConoHa WING」を選ぶ方も多いですが、安定・信頼重視の「Xserver」も良いです。
特に何十サイトも運営するのでなければ容量等も充分なので、料金プランはどちらも最も月額料金の安いConoHa WINGであれば「ベーシックプラン」、XSERVERであれば「X10プラン」で問題ないです。
契約に関して特に難しい部分はなく、サイトの手順通りに進めれば問題ないです。初期ドメインなど名前を付ける必要がある部分がありますが、特に外に出る様な情報ではないですし適当につければOKです。
お願いだからどちらか選んでくれと言われたら、今から始めるなら「ConoHa WING」を選びますね。
2. 独自ドメインを取得
続いて独自ドメインを取得していきますが、コチラもサーバー会社同様にたくさんの会社があります。
ただし、どの会社でも取得可能なドメインの種類は基本的に一緒なので「価格・サービス内容・サーバーとの連携のしやすさ」で選ぶといいと思います。ちなみに、先ほどの2社でもドメインを取得可能です。
サーバーと連携しやすいので、自分が契約したサーバー会社でドメイン取得してしまうのもアリです。
サーバー会社と別で取得したいと思っている方は「google domain」がおすすめです。シンプル表示で分かりやすいですし、自分のgoogleアカウントと結びついてるので管理しやすいのがポイントです。
ドメインはサーバーよりも単価が安くて、年間で1,000円~2,000円程度になります。ただ、ドメイン名によって高いモノもあって「.jp」や「.co」辺りは4,000円~5,000円程度する場合もありますね。
非常に人気なドメインは常に取得競争になっていて、例えば「apple.com」とか「movie.com」辺りのメジャーワードドメインは数千万円・数億円でも中古ドメインとして取引されるレベルだと思います。
ドメインを取得時には個人情報を公開する必要があるのですが、ドメイン会社はWhois代行で自分に変わって守ってくれます。google domainだと「プライバシー保護を有効にする」でOKです。
とにかく独自ドメインを取得するまでは特に難しい事なく、説明通りに購入を進めてしまいましょう。
3. サーバーとドメインの紐づけ
サーバーとドメインを手に入れても紐づけをしないと使えないので、まずはその作業が必要になります。
サーバーのサイトとドメインのサイトを行ったり来たりして少し面倒ですが、手順通りに進めれば問題なくできるので大丈夫です。「DNS」や「ネームサーバー」などのワードはあまり気にしなくてOKです。
サーバー側の作業(ドメイン追加)→ドメイン側の作業(ネームサーバー変更・DNS関連設定)
流れとしてはこんな感じです。基本的にはお互いの情報を記入し合う様な感じの流れになっていますね。
① まずはサーバーの管理画面を開いて購入したドメインを追加しましょう。
ConoHa WINGでもXSERVERでも「新規ドメインの追加」の項目がありますので、そこに購入したドメインを入力してください。SSLの設定(セキュリティ関連)については「利用する」を選びましょう。
② 続いてドメインの管理画面を開いて「DNS」関連の項目を選択し「カスタムネームサーバーを使用する」をチェックしてConoHa WINGとXSERVERそれぞれのネームサーバーを入力していきましょう。
ConoHa WINGの場合
・ns-a1.conoha.io
・ns-a2conoha.io
・ns-a3.conoha.io
XSERVERの場合
・ ns1.xserver.jp
・ ns2.xserver.jp
・ ns3.xserver.jp
・ ns4.xserver.jp
・ ns5.xserver.jp
それぞれ3つと5つになりますので記入してください。警告等が出てもOKなので進めてしまいましょう。
例えば、XSERVER等で同時に独自ドメインを取得した場合はこのステップで紐づけが完了になります。
③ Google domainなどの場合には紐づけ認証の為に下記の様な追加手順が必要になります。
まず、サーバー側でドメインのIPアドレスを確認します。IPアドレスの情報はサーバーの管理画面のDNSの項目の部分に載っているので、それをコピー・メモなどで記録します。続いて、ドメイン側でDNS設定の部分に「カスタムリソースレコード」という部分があるので下記の様に入力してください。
名前 | タイプ | TTL | データ |
---|---|---|---|
@ | A | 1h | IPアドレス(111.11.111.11など) |
www | CNAME | 1h | ドメイン名(mono-journal.comなど) |
A認証・CNAME認証という方法ですが、他サービスでは他の認証方法で進められる場合も多いですね。
4. ワードプレスをインストールする
それぞれのサーバー側の管理画面で紐づけしたドメインにワードプレスをインストールしていきます。
・XSERVER:自動インストール→ドメイン選択→プログラムのインストール→インストール設定
・ConoHa WING:サイト設定→アプリケーションインストール→アプリケーション
上記の様な流れで進めてもらえば、様々な項目の入力画面になります。基本的には自由に入力して問題ないですが、ユーザー名やパスワードなどはセキュリティ的に推測しにくい様なモノにした方がいいです。
入力が完了したらインストールされますので、ログイン画面の方に移ってサイト内の設定をしましょう。
ただし、サイトを編集したりテーマを導入する前に、サイトのSSL化のための処理をしておきましょう。
5. SSLの設定
SSLは暗号通信の事で、サイトの場合「https」と表示されているサイトはSSL化ができてる状態です。
セキュリティー面でもSEO的な面でもサイトはSSL化していた方がいいですし、ご紹介したサーバーであれば無料でできるので、最初からSSL化した状態でサイトを始められるように設定をしていきましょう。
・XSERVER:SSL設定にてドメインを選択し「独自SSL設定の追加」をクリックして確定
・ConoHa WING:サイトセキュリティの無料独自SSLを「ON」して「SSL有効化」をクリック
どちらのサーバー会社でもやり方自体は難しくないので、サクッとSSL化は済ませてしまいましょう。
ちなみに「https」ではなく「http」の方にアクセスしてしまった方の為にリダイレクトといって、正しいURLに転送する設定が本来はこの後必要なのですが「ConoHa WING」の方は自動で処理してくれるので必要ないです。「XSERVER」の方はサーバーとワードプレスの中でいくつか操作をしていきます。
ワードプレス側の設定(XSERVERのみ)
設定を開き「WordPressアドレス(URL)」と「サイトアドレス(URL)」部分を「https」に変更。
サーバー側の変更(XSERVERのみ)
サーバー管理画面の「.htaccess編集」を開いて独自ドメインを選択して「.htaccess編集」に表示されている枠内の先頭部分に下記リダイレクト用コードを追加記入して「確認→確定」を押して確定する。
<IfModule mod_rewrite.c> RewriteEngine on RewriteCond %{HTTPS} !=on [NC] RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L] </IfModule>
これでSSLの設定も終了してサイトの見た目変更や内容の記述など編集ができる状態になりました。
6. サイトを編集する
この辺りからは自分の好きな様に色々と編集してもらえば良いのですが、何点かポイントがあります。
・目的に合ったテーマを導入する
ワードプレスには「テーマ」というモノを導入する事が可能です。サイトの見た目や使い勝手など様々な部分をこのテーマを導入するだけで変更する事が可能なので、自分の目的に合わせて導入をしましょう。
コーポレートサイト向きのテーマ・ポートフォリオ向きのテーマ・ブログメディア向きのテーマなど様々で、無料のテーマの他にも有料で購入する事ができる高品質なテーマやSEOに強いテーマもあります。
・プラグインは慎重に選ぶ
ワードプレスには「プラグイン」という、便利な機能を個別に追加する事ができるシステムがあります。
プラグインは非常に便利なモノが多いのですが、プラグインとテーマの相性・ワードプレスとのバージョンの兼ね合いなど様々な場所でトラブルの原因になるケースがあるので、慎重に選んで導入しましょう。
特にキャッシュ(一時的にデータを保存する機能)周りのプラグインはサイトの表示速度を速くしたり役立ちますが、サイトが表示できなくなったりという重大な問題が起こる可能性が高いので特に注意です。
何かサイトに問題が発生したら大抵はこのプラグインのどれかが悪さしているので、1つずつ有効化を解除してみて原因を探るのがいい対応策になります。焦らずに1つ1つ対処して原因を探ってみましょう。
まとめ:レンタルサーバーとドメインでホームページ・サイトを作る方法
今回は更新が簡単にできるホームページ・サイトをある程度自分で作る方法をご紹介しました。
更新も必要のない非常に簡素なHTMLのホームページを作るのにもサーバーを借りたりドメインを取得したりという作業は必要なので、この部分を理解できているとWEB制作に少し詳しくなる事ができます。
もちろんWEB制作の専門業者に頼んでもいいのですが、急遽サイトが必要になったりすると間に合いませんし、この方法なら1日で自分でサイト制作ができるので必要な方はぜひチャレンジしてみて下さい。
関連記事「デザイナーがブログを書くことのメリットと多くの方に読んでもらうサイトの作り方」