自分でホームページを 作りたい人のための Webの基本と ホームページの作り方

ホームページの作り方 レンタルサーバー

【2019年度ホームページの作り方総まとめ】ホームページの自作方法を徹底解説

更新日:

これからあなたが初めて自分でホームページを作ろうかと考えた時に、何から手をつけたら良いかわからないという方が多いのではないでしょうか。
 

ここでは自分でホームページを作りたい初心者の方向けに「独自ドメイン+レンタルサーバー上にホームページを作る方法」を紹介していきます。
 

「ドメイン? サーバー?」
「無料と有料何が違うのか?」
「調べたらいろいろ出てきて、結局何が良いのかわからないわ」

ホームページを作ろうと思ったら、身近に使わない専門用語がたくさんでてきて、いまいちイメージがしにくいですよね。
ここでは、初めてでも分かるように、ホームページの作り方や各用語の意味や違いをじっくり説明していきますね!

 

『自分で作る選択を』
自分でホームページ作成・Web集客したいホームページ作成スクール・教室

自分でホームページ作成・Web集客したいホームページ作成スクール・教室 WEBST8


 


 

自分でホームページを作成するために知っておきたいこと

プロセス1 ホームページの仕組みを知る
 

まずは、ホームページの仕組みや、ホームページを作るために用意しなければならないものを説明していきます。
 

ホームページを閲覧するための仕組み

Webの仕組み概要

Webの仕組み概要

まずホームページの仕組みについて簡単に説明します。通常、ユーザーはホームページを下記のような流れで閲覧しています。

ホームページ閲覧の流れ

  1. パソコンがChromeなどのWebブラウザで指定のURLにアクセスする
  2. インターネット上のサーバー及びWebサイトが特定される
  3. Webサイトがパソコンに向かってHTMLや画像などを応答(送信)する
  4. Webブラウザが送られてきたHTML等を解釈して画面を表示する

 

ここで、「URLを入力」して「サーバーが特定」されて、「該当のホームページ」が表示されたことを理解しておきましょう。

 

ホームページを開設するために必要なもの

ホームページを開設するために必要な要素
 

さきほど「URLを入力」することで「サーバーが特定」されて「該当のホームページ」が表示される流れを説明しました。すなわち、ホームページを開設するためには「URL(ドメイン)」と「サーバー」と「ホームページ(中身)」が必要になります。

ホームページ開設に必要なもの

  • サーバー:インターネット上の建物・部屋のようなもの
  • ドメイン:インターネット上の住所のようなもの
  • ホームページ(中身):建物・部屋の中にあるコンテンツ・サービスのようなもの(文章や画像などで構成されるファイル類)

 

指定の住所(ドメイン)に行ったら建物(サーバー)があって、その中に入ったら中身がある(例. 飲食店なら飲食のサービスなど)」というようなイメージをするとわかりやすいと思います。
なるほど!インターネットの世界と用語はよくわからなくても、実際のモノに例えると分かりやすいですね!

ホームページを作るためには、まず「サーバー」「ドメイン」「ホームページ(中身)」が必要であることを押さえておきましょう。

 

▲▲目次に戻る▲▲


 

自分でホームページの作るための具体的な手順

Webサイトを構築する方法にはいくつか形態がありますが、ここでは一番スタンダードな方法である「独自ドメイン+レンタルサーバー」上にホームページを作成していく手順で説明していきます。
 

ホームページの作成手順

  1. レンタルサーバー会社からサーバーを借りる
  2. ドメインサービス会社からドメインを取得する
  3. サーバーに中身(ホームページ)を構築する

 
※JimdoやWixなどのクラウド型のホームページ作成サービスを利用する場合は、ドメイン取得、サーバー契約などをそれぞれ意識せずに全てWeb上からまとめてホームページを作ることも可能ですが、ここでは割愛します。
(補足)無料ホームページと有料ホームページの違い」に補足として掲載していますのでご参考ください。
 
 

レンタルサーバー会社でサーバーを契約する

プロセス2 レンタルサーバーでサーバーを契約する
 

レンタルサーバーとはインターネット上の建物

Webの仕組み サーバー
 
まずはWebサイトの入れ物となる建物「サーバー」を準備する必要があります。
 

現実世界で、「一戸建て」、「ワンルームマンション」、「寮・シェアハウス」といったタイプがあり、広さや設備によって価格がピンキリであるのと同様に、サーバーもいくつかのタイプがあり価格もピンキリです。
 

いくつかのタイプがありますが、個人が初めてホームページを持つ場合は「レンタルサーバー会社」で「レンタルサーバー」を契約するのが一般的です。
 

レンタルサーバーは、自分用の部屋がある一方トイレ・風呂などの共用部分もあるシェアハウス・寮くらいのイメージが比較的あっているかもしれません。

 

レンタルサーバーも複数のプランがあり価格もピンからキリですが、個人向けだとおおよそ月額500〜1,000円くらいが一般的です。
 
 

レンタルサーバーを提供している有名な会社

レンタルサーバーを提供している会社として、エックスサーバー、さくらインターネット、ロリポップなどが有名でよく利用されています。
 

項目エックスサーバーロリポップさくらレンタルサーバー
おすすめプランX10スタンダードプランスタンダードプラン
公式はこちら エックスサーバー
ロリポップ!
さくらのレンタルサーバ
おすすめ度
■総合4.25
  • 機能:5
  • 性能:5
  • 簡単さ:4
  • 価格:3
■総合:4.25
  • 機能4
  • 性能4
  • 簡単さ:5
  • 価格:4
■総合4
  • 機能:3
  • 性能:4
  • 簡単さ:4
  • 価格:5
こんな人におすすめ
  • スペックが高いのを選びたい人
  • 目安10万PV以上のアクセスの多いサイトを作る予定の人(※)
  • コストパフォーマンス重視・初心者向きが良い人
  • 目安5万PV以下の小〜中規模サイトを作る予定の人(※)
  • 運営会社の実績重視・安いのが良い人
  • 目安5万PV以下の小〜中規模サイトを作る予定の人(※)
初期費用
(初回のみ必要な費用)
3,240円1,620円1,029円
月額費用1,080円540円515円
※年間一括払いで5142円(月額428.5円相当)
こんな点がメリット
  • サーバーのスペックが高いので比較的大量アクセスに強い
  • 安い
  • 管理画面がわかりやすい
  • 安い
  • 有名なWordPressの書籍の題材で手順が紹介されている
こんな点がデメリット
  • 他社2社に比べて500円高い
  • ムームードメインと2つアカウント管理必要
  • WAFの誤検知が多い
  • 独自ドメインでのWordPressインストール手順が少し煩雑
  • サーバープラン変更ができない
管理画面が使いやすいか普通簡単普通
運営会社エックスサーバー株式会社GMOペパボ株式会社さくらインターネット株式会社
公式はこちら エックスサーバー
ロリポップ!
さくらのレンタルサーバ

(※)2019年6月時点で公式サイトなどから調べた情報です。最新の正確な情報は各公式サイトよりご確認ください。
(※)比較するにあたって、エックスサーバーはX10プラン、ロリポップサーバー・さくらレンタルサーバー共にスタンダードプラン、かつ一年契約の場合での比較しました。
(※)PV数に関してはサイトの内容に大きく依存するためあくまで目安です。ネット上の評判などを参考にし、比較的安全めと思われる値で記載しました。
 

合わせて読みたい記事

スペックも含めたレンタルサーバー詳しい比較は「【徹底比較】WordPressにおすすめのレンタルサーバー有名3社比較」に掲載していますので、レンタルサーバー契約の前にぜひご覧ください。

【初心者向け】WordPressにおすすめのレンタルサーバー有名3社比較

 

結局どれが一番良いんでしょうか??

 

多少の差はあれ、上記の3つであれば基本的に大きな違いはないと思います。携帯会社に例えると「docomo」と「au」と「ソフトバンク」のどれがオススメ?くらいの感じでしょうか。

 

通常の用途においては、それほど大きな差はないということですね。

 

そうですね。あえて強引な例えをするなら、iphoneで128GBプランを選びたい人はエックスサーバー
、iphoneで64GBプランを選びたい人はロリポップ!さくらのレンタルサーバといった感じででしょうか。

 

なるほどちなみに、このサイトはどのサーバーを利用しているんですか??

 

本サイトはエックスサーバーを利用しています。オリジナル会員サイトを導入したりしていますがそれでも現状まだスペックの半分も使っていない状態です。初めての場合はロリポップも管理画面もわかりやすくおすすめですよ。

 

ロリポップの契約方法からドメインの取得方法、ワードプレスのインストールまでは「【ロリポップでレンタルサーバー開設!】WordPressインストールまで徹底開設」の記事で紹介しています。

【徹底解説】レンタルサーバー ロリポップでWordPressをインストールする

 

▲▲目次に戻る▲▲


 

独自ドメインを取得する

プロセス3 独自ドメインを取得する
 

ドメインとはインターネット上の住所

Webの仕組み ドメインを取得する

サーバーを用意すると同時に、インターネット上の住所に当たるドメインも取得する必要があります。
 

レンタルサーバーを契約した直後は、初期ドメインというレンタルサーバーのサブドメイン(xxxx.xsrv.jpや、xxxx.sakura.ne.jp、xxxx.lolipop.jpなど)が利用できます。
 

このサブドメインは実際のビジネス・ブログには不向きです。将来的にそのままビジネスで長く使う可能性がある場合は、自分専用のドメイン(独自ドメイン)も準備する必要があります。/b>ドメイン名は後から変更できず、訪問者に直接見える内容でSEOにも影響しますのでとても重要です。
 

本サイトの場合は「webst8.com」が独自ドメインです。
 

自分の欲しいドメインを取得するんですね。「.com」っていうのはよく見かけるんですけど、なんなんでしょうか??

 

「.com」の部分をトップレベルドメインといいます。「.com」の他にも「.net」や「.info」など数多くの種類があります。
独自ドメインは、
「xxxx(自分の欲しい名前)」×「トップレベルドメイン」
の組み合わせからどれにするかを選ぶ形になります。

 
 

今はその意味が薄くなりましたが元々は「.com」は商用、「.net」はネットワーク関係を意味しています。法人の場合は「co.jp」を取得することもできます。
 

■代表的なトップレベルドメインと、語源

ドメイン名主な意味備考
.com商業・商用用途で世界的に広く使用されています。語源はcommercial(商業・商用)
.netオンラインビジネスや起業によく利用されます。元々はネットワーク関係を意味しています。
.org非営利団体でよく使用されます。organization(組織)
.info情報提供のホームページでしばしば使用されます。2001年10月1日運用開始
.biz商用のドメインで企業に使用されることがあります。2001年5月21日受付開始
.jp日本国内にいる人間しか取得できないるドメイン
.co.jp法人用ドメイン法人登記資料などの提出が必要

 

どれにするべきか悩んでいる場合は、とりあえず「.com」を選んでおくと無難でしょう。
 

また、ドメイン名はSEO的にはホームページのコンセプトに近い名前をドメイン名に含めるのが良いとされています。たとえば、健康関係のホームページなら「health」という単語、色関係なら「color」、カフェ関係なら「cafe」などの単語をドメイン名に含めると良いです。
 

他には、ブロガーさんで自分の名前をブランディングしていきたい場合は自分の名前をドメイン名にする場合もありますし、コーポレートサイトであれば会社名をドメイン名にするのが一般的です。
 

■以下はGoogleが出す推奨のドメイン名のケーススタディですので参考にしてみてください。

Google Webマスターアカデミー クイズ抜粋

Google Webマスターアカデミー クイズ抜粋

Google ウェブマスターアカデミーより引用
 

上記の通り、意味を持たないドメイン名よりも意味を持つドメイン名が良いと言われています。目的に合わせてドメイン名を選んであげましょう。

 

▲▲目次に戻る▲▲


 

独自ドメインの取得方法

トップレベルドメインが「.com」や「.net」の独自ドメインを取得する場合、おおよそ年額1,000〜2,000円程度の取得・更新費用がかかります。
 

レンタルサーバー会社がエックスサーバーであれば、そのままエックスサーバーで独自ドメインを契約することができます。
ロリポップであれば同じ会社のドメイン専用サービス「ムームードメイン」から、さくらインターネットであればそのままさくらインターネットで独自ドメインを契約することができます。
 

年間920円(税抜)からの格安ドメイン取得サービス─ムームードメイン─

 

以下は、ムームードメインで独自ドメインを取得する場合の画面です。
ムームードメイン 取得したいドメインを入力して検索実施。すでに誰かが取得済みのドメインは取得できません。
 

上記のように、取得したいドメインを入力して検索→カートに追加をして取得手続きを進めていきます。すでに誰かが取得済みのドメインは取得できません。
 

(※)ムームードメインの取得は下記より行えます。
格安ドメイン取得サービス─ムームードメイン─

 

会社によりキャンペーンなどで数百円〜千円程度の取得費用の違いはありますが、初めてホームページを自分で作る場合は、契約した会社でドメインを取得したほうが設定が簡単でおすすめです。
 

独自ドメインを提供している会社・サービス

項目エックスサーバームームードメインさくらレンタルサーバー
特徴 業界トップクラスの高コストパフォーマンスを
誇るレンタルサーバー。
独自ドメインはインフォパネルの
「追加のお申し込み」より取得できます。
.com .net .jp .co.jpなど多種多様なドメインを
取得・登録できる国内最大級の
ドメイン総合サービスです。
独自ドメインを使ったブログの開設や
WordPressを使ったサイトの運営には
必須のドメインを簡単に取得可能です。
運営会社エックスサーバー株式会社GMOペパボ株式会社さくらインターネット株式会社
公式サイト https://www.xserver.ne.jp/
年間920円(税抜)からの
格安ドメイン取得サービス
─ムームードメイン─

さくらのレンタルサーバ
スタンダードのお申込みはこちら
(公式ページ)

 

また、エックスサーバーなどは契約時に独自ドメイン1個プレゼントキャンペーンを実施している場合もあります(キャンペーン実施時のみ)。詳しくは各公式サイトより情報を確認してみてください。
 

ほかにも、ドメインの取得はGoogleで「ドメイン 取得」などで検索するとたくさんの会社が出てきます。「お名前.com」も有名なドメインサービス会社です。
 

たとえば、他社のお名前.comで取得したドメインやムームードメインで取得したドメインを、エックスサーバーやさくらインターネットで利用することも可能なんでしょうか??

 

はい、もちろん可能ですよ。
ただし、ドメインを取得したところの管理画面からネームサーバー設定というドメイン名をどのレンタルサーバーで利用するかを関連づける設定が必要になります。
詳しい設定はドメイン取得したところの各ヘルプなどに従ってネームサーバーの設定をしてみてくださいね。

 


今回は独自ドメインの取得前提でお話ししましたが、たとえば以下のような場合は無料ドメインでも良いと思いますよ。
・検証や勉強目的、ビジネス目的ではない(趣味)場合でホームページを立ち上げたい。
・期間限定の告知やサンプルページなどの特定用途で立ち上げたい。

 

【PR】ロリポップと一緒にムームードメインでドメインを取ろう

ロリポップでサーバーを契約したら、ムームードメインで独自ドメインを取りましょう。どちらも同じ運営会社「DMOペパポ」が運営しているので設定も楽でオススメです。



 

なるほど!今回は仕事でちゃんと使いたいので、独自ドメインを取得してみたいと思います。

 

▲▲目次に戻る▲▲


 

中身(ホームページ)を作成する

プロセス4 中身(ホームページ)を作成する
 

さて、これでレンタルサーバーの契約とドメインの登録が完了してWebサイトを構築する準備が整いました。家に例えると今はマンションを契約直後の状態で家具も何もない状態です。
 

ここからはサーバー(建物)の中にホームページ(中身)を作成していきます。
 

ホームページは大きくHTMLファイル等を自分で作成して構築する場合WordPressのようなソフトウェアをつかって制作する場合の2パターンがあります。
 

パターン1:HTML・CSSファイル等を自分で作成して構築する。パターン2:Wordpressのようなソフトウェアをつかって制作する
 
 

HTML・CSSでホームページを作成する

一つ目はHTML・CSSといわれる言語を記述してホームページを作成する方法です。 
 

HTMLとはHyper Text Markup Languageの略です。Webページの構造を定義する言語です。CSSとは、Cascading Style Sheetsの略で、Webページのスタイル(見た目)を指定する言語です。先ほどのHTMLと一緒に使います。
 

<html>のような『タグ』と言われるかたまりを使って文章や画像を加えたり、リンクを貼ることができます。
 

Atomエディタで開いたHTMLソースコード
 

ここでは、下記のようなシンプルなHTMLを作成してWebページを作成してみます。

 

上記のHTMLファイルを契約したサーバーにファイル転送ソフトなどを使ってアップロードします。

FTPでhelloworld.htmlをアップロード

FTPでhelloworld.htmlをアップロード


 

Webブラウザで指定のURLでアクセスすると作成した内容をホームページとして閲覧することができます。

Webサイト html helloworld

僕の(私の)ホームページ!!


 

このようにHTMLファイルなどを自分で作成してサーバーにアップロードすることでホームページを作ることができます。
 

なお、HTMLについて学習したい方はこちら「【HTMLの基本を徹底解説!】初心者向けHTMLの基本とよく使うタグ一覧」をご参照ください。

 

ただし、この方法の場合は、HTMLやCSSなどの専門知識がないとホームページを持つことができません。そこで、最近ではワードプレスなどのホームページ作成ソフトもよく使われます。
 

ワードプレスなどのソフトウェア(CMS)を利用してホームページを作成する

二つ目は、ワードプレスなどのソフトウェア(CMS)を利用してホームページを作成する方法です。
 

最近では、HTMLやCSSを知らなくてもある程度自由にホームページを作れるソフトウェアがよく利用されています。このソフトウェアのことをCMS(コンテンツマネジメントシステム)といい、今現在、WordPressというオープンソース(無料)のCMSが世界第一位で一番有名です。
 

【圧倒的なWordPressシェア】世界と日本で有名なCMSシェアを徹底比較!
 

■2分でわかるWordPressでホームページ作成動画


 

最近では多くのレンタルサーバー会社でWordPressの自動インストール機能などが用意されていて、設定方法などもたくさんインターネットで説明されています。
 

エックスサーバー 管理画面 CMS自動インストール

エックスサーバー管理画面 CMS自動インストール


 

(補足)HTML・CSSなどの静的サイトとWordPressなどのCMSの違い

これからホームページを開設するなら、HTML・CSSで制作するのと、WordPressなどのCMSを利用するのとどちらが良いんでしょうか??

 

オススメはワードプレスなどのソフトウェアを利用する方法です。豊富なデザインテンプレートや便利なプラグイン(スマートフォンのアプリのようなもの)がたくさんあり、ウェブの知識がなくてもすぐにスタートすることができます。
ただ、ワードプレスなどのソフトを利用していても、細かいレイアウト調整にはHTML・CSSの知識が必要になってくるので、やりながら覚えていくのがよいのではないでしょうか。

 

一つ目にご紹介したHTML・CSSでサイトを構築するサイトを静的サイトと言います。一方、WordPressをはじめとしたCMSは、今日主流となりつつあるWebサイトの構築手法です。
 

パターン1:HTML・CSSファイル等を自分で作成して構築する。パターン2:Wordpressのようなソフトウェアをつかって制作する
 

静的サイトはページ数の少ないサイトやランディングページなどに向いています。一方、WordPressなどのCMSを利用したサイトはコンテンツ量が多いコーポレートサイトやメディアサイト、ブログなど日々、更新作業が発生するサイトに向いています。
 

CMSを利用したホームページは、基本的に更新作業は管理画面から行いますので、専門知識がなくてもある程度は日々の更新が可能です。
 

ただし、自由自在にカスタマイズしようと思うと、HTML・CSSの知識に加えてPHPなどのプログラミング言語や独自の記述方法を理解する必要がある点は注意です。

 

HTML・CSSなどの静的サイトWordPressなどのCMS
用途少ないページ数のサイトやLPに適している中規模以上、更新の多いのサイトに適している
作成・更新方法HTML・CSSで作成・更新する管理者用のページから作成・更新する
注意点-ソフトウェアのバージョンアップなどの管理が必要
自在にカスタマイズしようと思うとプログラミングやソフトウェア仕様の知識が必要

本サイトでは、総合的に鑑みて、世界シェアNO1のWordPressを利用してホームページを作成する方法をお勧めしています。
 

無料ホームページと有料ホームページの違い

補足)無料と有料ホームページとWordPressの違い
 

補足として、無料ホームページと有料ホームページの違いを説明しておきます。

無料ホームページのよくある特徴

世の中には無料で作れるホームページサービスもたくさんあります。有料ホームページとの主な違いとして下記のような点があります。

無料ホームページのよくある特徴

  • ドメインは基本的に無料ドメインになります。(例. 「xxxx.wixsite.com」や「xxxx.jimdo.com」のように運営会社の配下となるドメイン名)
  • 機能やカスタマイズ性に制限があります。FTPが利用できないことが多い。
  • 運営元を始めとした各種広告が表示されることがあります。
  • 商用目的・アフィリエイト目的に制限があることがあります

 

無料ホームページのタイプによっては有料プランが用意されていて、独自ドメインに切り替えたり、広告を非表示にしたりできる場合もあります。詳しくは運営サービスのプランや利用規約を確認してください。

■有名な無料ホームページ

ホームページ名主な特徴サイト
jimdo(ジンドゥー)ドラッグ&ドロップで簡単にホームページが作れる有名なサービスです。有料プランに切り替えることで独自ドメインにしたり機能追加することができます。Jimdo
wix(ウィックス)Jimdoと同様に簡単にホームページが作れる有名なサービスです。有料プランに切り替えることで独自ドメインや機能拡張することができますWix
amebaownd(アメーバオウンド)サイバーエージェントが運営する無料ホームページサービスです。アメブロユーザーがよく利用しています。amebaownd

 

オープンソースのワードプレスと運営会社があるホームページサービスのどちらが良いのか

オープンソース(特定の運営会社がいない)ワードプレスと、運営会社があるホームページサービスのどちらが良いのか迷っている人も多いのではないでしょうか。
 

本ブログでは本格的にホームページを作ることを想定しているので、自由度が大きいレンタルサーバー+ワードプレスをオススメしています。しかし、自由度が多い分、バージョンアップや不具合対応なども自分で実施しないといけないことをあらかじめ理解しておきましょう。
 

逆に、Jimdoなどのサービスでは機能に一定の制限がありますが、その機能の範囲内ではサポートをしてくれるという点はメリットです。
 

ワードプレスを利用する場合と上記に挙げたホームページサービスとの大きな違いとして、以下のような点があります。

タイプメリットデメリット
ワードプレス ・自由度が大きく色々なカスタマイズや機能拡張ができる ・サポートしてくれる問い合わせ先がない(不具合やわからないことは自分で調べて解決する必要がある)
・バージョンアップやセキュリティ対策を自分でやる必要がある
運営元があるホームページサービス ・問い合わせ先となるヘルプデスクがある(サポート条件は運営元やプランによるので要確認)
・バージョンアップや基本的なセキュリティ対策は運営会社がある程度行なっている
・機能制限があり、ワードプレスほど自由度が大きくない

 

ここではあまり難しく考えなくても良いとは思いますが、今後の運営に関する心構えとして上記のことを理解して自分に合ったものを取捨選択していきましょう。
 

【WordPress対応】自分でホームページ・ブログを作成したいWebスクールWEBST8
WordPress 自分でホームページ・ブログを作成したい個人事業主のためのWebスクール・教室 ウェブストエイト


 

具体的なホームページを作る今後の操作

補足)具体的なホームページ(中身)の 作り方
 

具体的なホームページを作る今後の操作手順を下記にまとめました。
 

レンタルサーバー・独自ドメインでWordPressをインストールしよう

繰り返しになりますが、ホームページを作成する際は、レンタルサーバー・独自ドメインの契約しましょう。
 

契約後は、WordPressをインストールしましょう。
 

下記は、レンタルサーバー「ロリポップ」で「ムームードメイン」を利用してレンタルサーバーを契約・独自ドメインを取得してから、WordPressをインストールする方法を説明していきます。

【徹底解説】レンタルサーバー ロリポップでWordPressをインストールする


 
 

WordPressでホームページを作成しよう

WordPressをインストールしたら早速ホームページを作成していきましょう。
 

下記に初心者でもわかる!ワードプレスの使い方を紹介しています。

【2019年度版 WordPress使い方総まとめ】ワードプレスの使い方を徹底解説


 

便利なサイト)フリーで使える画像素材サイトまとめ

実際にホームページを作って行く際に、良い画像がなくて素材不足になることがよくあります。また、ネットで検索して出てきたものは著作権で保護されているものもたくさんあるので安易に使ってはいけません。
 

ネットには、自由に使えて商用利用可能な画像素材サイトもたくさんあります。下記にホームページ作成に使えるおすすめ画像素材サイトを一挙紹介していきますので、是非ご参考ください。

【おすすめ素材サイト】ホームページ作成で使えるフリー素材サイトを紹介


 
 

(補足)独自SSLを設定しよう

最近では、SSLという技術でセキュリティ的に保護された通信が主流になってきています。
 

SSL化の説明図2
 

2017年7月から全プランで無料の独自SSLが利用できるようになりました。初心者には少しわかりにくい操作かもしれませんが、下記にレンタルサーバーロリポップで常時SSLを設定する方法をご説明しますので、余力のある人はぜひ設定しておきましょう。
 

ロリポップでWordPressに常時SSLを設定する方法


 
 

(補足)独自ドメインのメールアドレスを作成しよう

独自ドメインを取得してレンタルサーバーを契約したら、メールアドレスも作っておくことをお勧めします。
 

下記は、ロリポップで独自ドメインのメールアドレスを作成して、送受信する方法を説明しています。

ロリポップでメールアドレスを作成・送受信するやり方


 
 

(補足)HTML・CSSを覚えよう

WordPressやその他のソフトウェアを利用しないでHTML・CSSでホームページを作りたい人・WordPressをカスタマイズしたい人は、HTML・CSSを覚えると良いでしょう。
 

【HTMLの基本を徹底解説!】初心者向けHTMLの基本とよく使うタグ一覧

【CSSの基本】CSSの基本とプロパティ一覧


 

▲▲目次に戻る▲▲


 

(補足)ホームページのコンセプト作り

本記事ではホームページの具体的な作り方を中心で説明していますが、本来は具体的にホームページを作り出す前に下記のようなホームページのコンセプト作りが必要です。
 

ホームページのコンセプト作り

  • ホームページの目的を明確化する
  • ホームページのターゲット(ペルソナ)を決める
  • ホームページのターゲットに向けたコンテンツを決める
  • ホームページの重点キーワードを決める
  • 競合サイトを調査する

 

具体的なコンセプト決めのやり方については、下記の記事をご参考ください。

【ホームページで成果を出すために】ホームページのコンセプトの作り方!


 

ホームページの作り方が今まで全然イメージできなかったけれど、だいぶ作り方のイメージができるようになりました!
でも自分一人だとちょっと不安かもです。。

ここでは、基本的なことを説明していきましたが、自分でやってみないとなかなかわからない部分もあると覆います。ぜひ実践してみてください。また、当サイトでは、自分でホームページを作りたい人向けに個別指導のWebスクールもしておりますので、お気軽にお問い合わせくださいね!

 
 

(補足)ホームページを作るにあたって独学・スクール・外注を比較しました

この記事をご覧のあなたは、「自分でホームページの作り方を覚えて自作したい」という希望を少なからずお持ちではないでしょうか。
 

そこで、ホームページを独学で作るか、スクールで教えてもらいながら作るか、外注するか、そのメリットとデメリットについて、当方の視点で説明しておきたいと思います。
 

■外注・独学・スクールの比較表

比較表外部委託独学スクール
費用約30〜100万円(ページ数・デザイン・サービス内容によって変動)約2,3万(本や学習サイト代)20〜40万円
かかる時間について数時間
(サイトの文言や写真準備などは必要)
数百時間数十時間
追加更新について独力で困難可能可能
注意点業者によっては大きなハズレあり途中で諦める・挫折することも多い目的に合わせたスクール選びが必要

 

ホームページを外注する場合の注意点

外注する場合は、時間の節約ができるでしょう。ただし、サイトの構成や文言・写真などは自分で用意しないとオリジナルのサイトができませんから結局中身については自分で考える必要があります

格安ホームページ制作会社が最初から用意している共通テンプレートに文言と写真を埋めていくだけのスタイルなのに対して、どうやったら魅力的なサイトになるか、サイト設計まで提案やサポートをしっかりしてくれる制作会社は必然的に高価になります。
 

また、サイトの更新を自分でやるのか、業者に依頼するのか明確にしておく必要があります。ですので、外注の場合は、適切な業者選びが重要なキーとなります。
 

残念ながら、業者任せにしていて費用だけ取られてほとんど何もしてくれない・レスポンスが遅い、認識違いでやってくれると思っていたことがやってくれなかった。など多々あるのが実情です。
 

ですので、外注でホームページを作る場合にしても、業者をリーディングできるように、自分でもある程度勉強しておくことをお勧めしています。
 

合わせて読みたい記事

ホームページ作成で失敗しないために知っておくべき事を下記記事に紹介していますので、外注を検討されている場合はぜひご一読ください。

【個人事業主必見!】ホームページ作成で失敗しないために知っておくべき事

 
 

ホームページを完全独学する場合の注意点

完全独学の場合、費用は本代だけなど高くても2,3万円くらいで、非常に安価で済みます。しかし、圧倒的に時間がかかる点が大きなデメリットです。他にしなければならないことがある場合は、忙しくて時間が取れないなど途中でやめてしまう人も多いです。
 

また、間違った学習(自分の実現したいことと学習内容がマッチしていない)をすると、時間の無駄になってしまうというリスクもあります。
 

反面独学は、「お金はないけど時間がたくさんある」、「Webの学習自体が好きだ」という人には独学はもってこいでしょう。
 
 

スクールは外注と独学のバランス型

更新も自分でやりたいけれど、他にやることもあり、本を読んで一から覚える余裕もない。効率よく覚えて自分でホームページを作っていきたい場合には、スクールがおすすめです。
 

ただし、自分の目的にあったスクール選びが非常に大事です。
 

たとえば、「自社ホームページを作りたい」「自社ホームページを更新できるようになりたいのに、Webデザイナーとして転職するためスクールに通っても、カリキュラムと目的がミスマッチで、最悪スクールに通い損」になってしまいます。
 

自分がホームページを作りたい目的が何なのかを明確化して、それに応じてくれるWebスクールを探しましょう。
 

ただし専門職を目指す場合は独学も必須

Webデザイナーやコーダー、プログラマーなどの専門職を目指す場合は、全くの未経験の場合最初のとっかかり部分をスクールで覚えるのには、良いと思います。
 
スキル的なことについては、昨今動画学習サイトも充実しており、基礎はスクールや学習サイトで体系的に学ぶことができます。
 
しかし、Webの技術は日進月歩で進化しており基礎はスクールで学べても、最新技術については自分一人で勉強してなんとかしなければならない場面が必ず訪れます。
 
専門職を目指す人がスクールに通う場合は、受け身で課題をこなすだけではなく、自分で色々調べて試行錯誤しつつ、わからないところをスクールで聞くというアクティブ型の受講スタイルをお勧めします(そういった人は転職もしやすいと思います)

 

専門職ではなくビジネスのツールとしてホームページを使うならスクールがおすすめ!
なお、当スクール「WEBST8」では、自分の事業用のホームページ(または、事業を始めるため)を作るためにホームページの作り方を覚えたいという方むけに個別指導型のWebスクールを開講しています。
「業者に任せたけど、更新ができない」「本で独学は時間がかかりすぎる・・」そんなお悩みの方も多いのではないでしょうか。
個別指導形式のスクールでは、自分の知りたいことをピンポイントで学習・達成でき、自分で更新もできるというメリットもあります。
無料事前相談もしておりますので、まずはお気軽にご登録ください。
詳細はこちらをご覧ください

 
 

まとめ

まとめです。今回はホームページを自分で作りたい初心者の方向けにホームページの作り方について説明しました。
 

ホームページを作成するために必要なもの

  • サーバー:インターネット上の建物・部屋のようなもの
  • ドメイン:インターネット上の住所のようなもの
  • ホームページ(中身):建物・部屋の中にあるコンテンツ・サービスのようなもの(文章や画像などで構成されるファイル類)

 

具体的な手続きとしては、下記に代表されるレンタルサーバーからサーバーやドメインを取得することができます。

項目エックスサーバーロリポップさくらレンタルサーバー
オススメプラン名X1(スタンダードプラン)スタンダードプランスタンダードプラン
費用
(1年間契約の場合の
月額あたり費用)
¥1,000¥500¥500
公式サイト https://www.xserver.ne.jp/
WordPressを使うならロリポップ!
簡単インストール完備で楽々スタート!

さくらのレンタルサーバ スタンダード

(※)ブログ執筆時(2018年1月時点)の情報です。
 

サーバーとドメインを取得したのち、中身となるホームページを制作していきます。最近では、個人でもホームページやブログが手軽に作成できるように環境が整ってきていますので、ぜひ自分でホームページ作成にチャレンジして見てください。
 

次回の記事では、「【ロリポップでレンタルサーバー開設!】WordPressインストールまで徹底開設」ということで、ロリポップの契約方法からドメインの取得方法、ワードプレスのインストールまでの詳細な手順を説明していますのでぜひ参考にして見てください。
 

ホームページの作り方に関する記事一覧はこちらをご参照ください。
【ここだけ見れば作れちゃう!】初心者向けホームページの作り方まとめ

 

『自分で作る選択を!』

弊社は、自分でホームページを作ることを推奨しています。「業者に任せたけど、更新ができない」「本で独学は時間がかかりすぎる・・」そんなお悩みの方も多いのではないでしょうか。

個別指導形式のスクールでは、自分の知りたいことをピンポイントで学習・達成でき、自分で更新もできるというメリットもあります。
無料事前相談もしておりますので、まずはお気軽にご登録ください。

詳細はこちら


 

今回は以上になります。最後までご覧いただきありがとうございました。
 


 

-ホームページの作り方, レンタルサーバー
-, , , , , ,

Copyright© WEBST8 , 2019 All Rights Reserved Powered by AFFINGER5.