【初心者におすすめ】ホームページ作成の基礎

Facebookシェア LINEシェア はてなブックマークシェア

ブログの圧倒的な人気に対して、ホームページはなかなか注目される機会がありませんが、多機能な分、動作が重いブログに対して、ホームページはシンプルかつ軽量で、自由度が高いという優位性があります。
今回はホームページの作成方法、ツール、費用などを解説しましょう。

ホームページとブログの違いとは?

ホームページについて、ブログとどこが違うのか、あまりよく分かっていない人も少なくないのではないでしょうか。

「ホームページ」は、もともとはブラウザで最初に表示されるページ(現在のスタートページ)を意味する言葉でしたが、後にウェブサイト全般を指す言葉として使われるようになりました。

さらに、90年代後半になると、インターネットで公開されているサイト=ホームページと広く認知されるようになりました。

しかし、2000年代中盤以降、スマホの登場やSNSの普及によってインターネットの環境が大きく変化していく中で、個人が記事を書くサイトを指す「ブログ」という呼称が定着しました。

また、ビジネス向けのサイトではコーポレートサイト、プロモーションサイト、ティザーサイトといった、用途ごとに細分化された呼称が次々と現れたことで、ホームページという言葉が使われる局面は次第に限定的になります。

現在、使われている「ホームページ」という言葉には、「ブログ以外のウェブサイト」という含意があり、コメントやトラックバック、テーマやプラグインといった機能を備えているブログとは異なる、古典的なスタイルのサイトを指すことが多くなっています。

ホームページとブログ、どちらのサイトを作るべきかについては、その目的や用途によります。

ホームページはこれといった定形の型がないため、デザインやコンテンツの配置の自由度が高く、用途に応じて豊富な情報を掲載できますが、開発には高度な技量が求められ、費用も高く付く傾向があります。

ホームページの特徴をまとめると、以下のようになります。

  • デザインの自由度が高い
  • 記事の追加や更新が難しい
  • 開発コストは高め

一方、ブログは、コメント・トラックバック機能を備えた記事が中央カラムにスクロール表示されるという決まった型があり、テーマを利用してデザインの変更は行えるものの、形式自体はほぼ決まっています。

また、記事の更新作業は簡単で、SNSなどとの連携も容易、さらにシステムのベースとなるCMSがあるため、開発にかかるコストが安く済む点も魅力です。

ブログの特徴は次の通りです。

  • インタフェースは固定で自由度は低い
  • SNSや検索エンジンからの集客が容易
  • 開発コストは比較的安価

最近のホームページの活用例としては、以下のようなサイトが挙げられます。

名刺代わりの自己紹介サイト

営業担当や個人事業主が顧客へのアピールの一環として開設するサイトです。

ブログやSNSは頻繁な投稿が前提のメディアなので、記事の更新が止まっていると印象が悪くなりますが、ホームページなら記事の投稿機能がないため、維持の労力がかかりません。

また機能が少ない分、情報量が限定されるので、プロフィール、アピールポイント、連絡先といった重要度の高い情報が注目されやすくなります。

クリエイターのポートフォリオサイト

デザイナー、フォトグラファー、イラストレーターといったクリエイター職が、自身の過去の作品の実績を掲載するサイトです。

ブログは縦方向に記事が並ぶ形式のため、大量の写真や画像を一覧で見せる用途には向きませんが、ホームページであれば、文字情報を最小限にして、ビジュアル要素を印象的に提示する、スタイリッシュなメディアを作ることができます。

サークルの情報共有サイト

複数人が参加するサークルでは、情報共有のためにブログやSNSが使われることがあります。

しかし、新着記事が上位に表示される仕組みでは、活動予定やメンバー募集などの重要な情報が、他の投稿に紛れて分かりにくくなりがちです。

特に、大会に出場したり展覧会に出展したりするなどの公的な活動を行っているサークルは、SNSやブログよりも、公式ホームページを開設した方が、外部からの信頼感を得やすいでしょう。

ブログは本来、ニュースや日記といった情報の流動性が高い表現に適性があり、同じ情報を掲載し続ける用途には向いていません。

静的な情報を長期間掲示しておくメディアとして、ホームページが選ばれる余地はまだまだあると言えるでしょう。

ホームページで知っておくべき知識と仕組み

ドメインを表すイメージ

ホームページは、現在のブログの利用者にとっては、管理システムが洗練されていないと感じられることが多いかもしれません。

ブログの場合はCMSの使い方、WordPressであれば管理画面の操作方法をマスターすれば、おおむね使いこなせるようになりますが、ホームページではサーバーのファイルを直接操作しなければならないので、作業の難易度はより高くなります。

ホームページを利用する上で、次の2つの要素は、前提知識として抑えておきましょう。

HTMLとCSS

ホームページでは、サイトを構成するHTMLファイルとCSSファイルを直接編集しなければなりません。

HTMLはウェブページの内容を記述したファイル、CSSはウェブページを装飾する要素を記述したファイルで、HTMLとCSSの両方が揃うことで、ウェブページは内容と装飾が合致した、完全なものとなります。

HTMLはマークアップ言語、CSSはスタイルシート言語と呼ばれ、プログラミング言語ほどには習得の難易度は高くありませんが、複雑な表現を実現するためには、ときに高度な技術が求められることもあります。

HTMLとCSSのファイルの拡張子は、それぞれ「.html」と「.css」が使われています。

FTPとファイル転送ツール

ホームページではパソコンで作成したHTMLファイルとCSSファイルを、サーバーにアップロードすることで公開しますが、その際に必要になるのがファイル転送ツールです。

最もスタンダードなのはFTPソフトを利用する方法ですが、近年では多くのレンタルサーバーが、ブラウザからファイルを直接アップロードする機能に対応しているため、FTPソフトを使う機会は減っています。

「お名前.com」のレンタルサーバーでも、コントロールパネル内の「ファイルマネージャー」から、FTPソフトを使わずにファイルのサーバーへの転送が可能です。

ホームページは、ブログのようなCMSを基盤とするサイトとは、ウェブページを表示する仕組み自体が異なっています。

ブログの代表的なCMSのひとつであるWordPressでは、管理画面で記事の内容を作成すると、その情報がデータベースに格納されます。

ブログを訪れた訪問者からのリクエストがCMSに届くと、データベースの内容を元にHTMLファイルが出力され、訪問者のブラウザにウェブページの内容が表示される仕組みです。

一方、ホームページでは、運営者がHTMLファイルを作成してサーバー上に設置し、訪問者はサーバーにアクセスすることで、そのHTMLファイルを直接ブラウザで開いて見ることになります。

運営者がサーバーに設置したウェブページをそのまま訪問者が開いて閲覧するというシンプルな構造ですが、その分動作は軽く、トラブルが発生しても原因を突き止めるのは容易です。

なお、以降で紹介するWixなどのホームページ作成サービスは、高度なHTMLの編集システムを導入しているため、必ずしも上述のホームページの特徴は当てはまりません。

ここで紹介したホームページの仕組みは、あらゆるウェブサイトの根塊の構造に繋がっているので、ウェブの理解を深める上で覚えておくといいでしょう。

ホームページを作成する3つの方法

ここからは、実際にホームページを作成する方法について解説しましょう。

ホームページの制作方法は、制作会社に外注する方法と、自分で作る方法がありますが、前者は数十万円〜数百万円の予算となるので、個人のホームページであれば、自分で作るのが一般的です。

さらに自分で作るやり方としては、ホームページ作成サービスを利用する方法と、自力で一から作る方法があり、前者は制作コストを抑えつつ短期間で作りたい場合、後者は技術力に自信があり細部までこだわったサイトを作りたい場合に向いています。

それぞれの方法のメリットとデメリットについて解説していきましょう。

ホームページ作成サービスを利用する

ホームページ作成サービスでホームページを作って公開する方法です。

特に最近注目を集めているのが、WixやJimdoといったブログブーム以降に登場した新しい世代のホームページ作成サービスです。

ホームページをHTMLやCSSの知識なしで構築できるのが特徴で、サーバーへのアップロード作業も不要、追加できる機能も豊富で、スマホやタブレットなどのマルチデバイスにも対応しています。

中には条件を指定するとAIによってホームページを自動生成する機能もあり、見栄えのいいサイトをとにかく早く簡単に作りたいというニーズに応えてくれるサービスです。

ただし、作成したホームページの運営や管理は完全にサービスに依存することになり、サービスが提供する機能以上のものを付け加えることはできません。

WixとJimdoでは無料プランも提供されていますが、独自ドメインが使えず、広告が強制表示されるため有料プランがオススメです。

独自ドメインと広告を非表示にするプランの費用は、Wixでは月額900円、Jimdoでは月額965円となっています。

ウェブ制作業者に外注する

ウェブ制作を専門に行っている業者に、ホームページの制作を発注する方法です。

今日のウェブ制作は、WordPressをベースにしたサイト構築が主流ですが、ホームページ形式のサイトの制作に対応してくれる業者もあります。

ただし、ウェブ制作は全般的に制作費が高めで、最小限の規模(5ページ程度)でも30万円が最低ライン、そこからページ数が増えるごとに費用は増え、20〜30ページのサイトなら100万円以上はかかると見ておくべきです。

外注するメリットとしては、品質面の信頼性が高いことで、細部にまで神経の行き届いた、完成度の高いホームページを期待できます。

その一方で、完全に思い通りのホームページができるかどうかは未知数で、通常は制作に入る前に、見本と仕様書の確認を行いますが、それでも完成後に改修したい箇所が見つかることは多く追加の作業を依頼すると、その都度費用がかかることになります。

レンタルサーバーに自分で作成する

レンタルサーバーを契約して、そこに自作のホームページを公開する方法です。

自分でホームページを制作することになるため、HTMLとCSSの知識は必須ですが、自分の技術力の範囲内で、思い通りのホームページを作ることができます。

上述のホームページ作成サービスでは、細部の表現に融通がきかないことが多々あるので、ソースコードの一行に至るまで徹底的にこだわりたいという人や、余計な装飾や処理を排したミニマムなホームページを作りたい場合におすすめです。

難点は制作にかかる労力と時間で、ホームページを構成する全ての要素を一から作るとなると、作業量と作業時間はかなりのものになります。

また、比較的簡単と言われるHTMLやCSSですが、洗練された表現を実現するには高度な技術力が求められるため、ウェブで配布されているホームページ用のテンプレートやCSSフレームワークを利用するといった工夫が必要になるでしょう。

ホームページの維持にはレンタルサーバーの費用がかかり、月額1500円前後が相場となっています。

なお、ホームページをレンタルサーバーで運用する場合、「お名前.com」を利用すると、コスト面で大きな利点があります。

「お名前.com」のレンタルサーバーは初期費用がゼロ円で、月額料金も最大で2ヶ月間ゼロ円、さらに独自ドメインとレンタルサーバーの同時取得で、独自ドメインの取得費用と更新費用がゼロ円になります。

ホームページの立ち上げの際の費用を大幅に削減できるのでおすすめです。

おすすめのホームページ作成サービス5選

ホームページの作成方法の中でも、初心者におすすめなのがホームページ作成サービスを利用する方法です。

ホームページ作成サービスは独自の特徴を備えたサービスが国内外にたくさんあり、選択肢は豊富です。

どのサービスもサーバーとセットで提供されているため、レンタルサーバーの登録は不要で、作成手順もテンプレートの選択とドラック&ドロップによるカスタマイズが中心で、HTMLやCSSの知識は不要です。

費用は月額1000円〜2000円程度で、30分程度の初期設定でホームページを立ち上げることができます。

ホームページ作成サービスのおすすめを紹介していきましょう。

Wix

Wixはイスラエル発のホームページ作成サービスで、全世界で1億人以上のユーザーを擁する人気のサービスです。

800種類以上のテンプレートからデザインを選択可能で、プラグインによりチャットや掲示板などの機能追加に対応するほか、フリーの画像素材も利用できます。

スマホから記事の更新やアクセス解析、ネットショップやコミュニティの管理が行なえるアプリ「Wix Owner」や、ユーザーが質問に答えるだけでAIがデザインを決定してサイトを構築する機能「Wix ADI」も提供しています。

無料プランもありますが、強制的に広告が表示される上に独自ドメインも利用できないので、制限が解除される月額900円のベーシックプランを選択すべきでしょう。

Jimdo

グローバルなホームページ作成サービスでWixと双璧を成しているのが、ドイツ発のJimdoです。

40種類以上のテンプレートを元にホームページの構築が可能で、アプリ版Jimdoを利用すればスマホからの記事の更新やホームページの管理も可能です。

テンプレート数やプラグインの有無といった機能面ではWixに劣るものの、帯域幅やデータ容量の点ではJimdoの方に優位性があります。

Jimdoでは、AIによるサイトの自動構築が可能な「AIビルダー」と、テンプレートを元に作成する「クリエイター」の2種類のコースがあります。

どちらのコースにも無料プランがありますが、独自ドメインを利用できない制限があるので、月額900円のSTART(AIビルダー)か月額965円のPRO(クリエイター)のプランを選択しましょう。

ペライチ

ペライチはその名の通り、ペラ1枚のホームページを作るのに向いたサービスです。

ホームページにはネットショップやオンライン予約の機能も追加可能で、高度なサイト運営にも対応できるシステムを備えています。

無料で利用できるSTARTプランでは独自ドメインは利用不可で、広告が強制的に表示されます。

ライトプラン(月額1628円)ではこれらの規制が解除された上で、作成できるページ数の上限は3ページまでとなり、レギュラープラン(月額3278円)では上限は5ページまでとなっています。

STUDIO

ホームページのデザインを自分で行いたいという人に最適なのがSTUDIOです。

ソースコードの編集なしでサイト構築を行なう、いわゆるノーコードに対応したサービスで、ドラック&ドロップの操作だけでホームページを作ることができます。

テンプレートも用意されているので、カスタマイズしてオリジナルのデザインに作り変えるといいでしょう。

複数人による共同作業に対応しているほか、国産のサービスなので日本人向けのインタフェースとなっている点もメリットです。

無料のFREEプランもありますが、独自ドメインとアクセス解析ツールが利用不可となっており、これらの制限を解除したBASICプランは月額1280円となっています。

Goope

CoopeはGMOペパボが提供する国産のホームページ作成サービスです。

Coopeの魅力は、ホームページ開設作業の簡単さで、必要項目を入力していくだけでサイトが立ち上がるため、ウェブデザインの知識が一切ない状態でも、確実にホームページを構築できます。

またサポート体制が手厚いのも特徴で、電話サポートに対応しているので(ビジネスプランのみ)、ホームページの運用で困ったことがあればオペレーターに質問や相談が行なえます。

飲食店や美容院などの中小規模の店舗の公式ホームページにも適性があり、オンラインショップやオンライン予約などのビジネス向けの機能を簡単に組み込めるのも便利です。

Coopeでは15日間の試用期間が設けられていますが、無料プランは提供しておらず、利用は月額1100円のエコノミープランからとなっています。

まとめ

今回は、ホームページの特徴と、その作り方について解説しました。

猫も杓子もブログでサイトを作るようになった現在、ホームページは一周回って、新鮮な印象を与えるメディアになっています。

WordPressをベースにしたブログでは、どのサイトも似たようなインタフェースになってしまいがちです。

しかし、ホームページでは既存のフレームワークを使わない分、大胆な画像の見せ方やメニューの並べ方が可能なので、利用者の体験(UX:ユーザーエクスペリエンス)を重視する昨今のウェブの潮流においては、その価値が見直されつつあります。

頻繁に記事を更新するブログ的な運用には向きませんが、厳選したページで訪問者にインパクトを与えるサイトを作るなら、ホームページはアリな選択です。

ホームページの特徴を理解して、それをフルに活かせるメディアを目指しましょう。

誰でも10分!WordPressブログの始め方

ブログを始めるには、ライブドアブログやはてなブログといった無料ブログを使う方法、
あるいはWordPressなどを使用する方法があります。

まだWordPressを持っていない人でも、簡単に準備できる方法を以下の記事で解説してます。
初心者でもわずか10分で始められるので、参考にしてみてください。

合わせて読みたい

【完全ガイド】誰でも10分!WordPressブログの始め方

アフィリエイトブログを始めるなら「お名前.com」

「お名前.com」は、国内No.1のドメイン登録サービス。独自ドメインと合わせて、WordPressの自動インストールに対応したレンタルサーバーも利用できます。WordPressや独自ドメインを一度も使ったことのない人でも、スムーズに始められるはず。

アフィリエイトに挑戦してみようと考えている方は、以下のリンクから、ぜひご利用ください!

お名前.comで
アフィリエイトブログを
はじめる

Facebookシェア LINEシェア はてなブックマークシェア
逢坂秀範の似顔絵イラスト

このサイトのライター
逢坂 秀範

ウェブメディアやメールマガジンのコンテンツ制作のプロ。
豊富な経験と知識でwebの作成や運用、用語などを分かりやすく解説します!

 
一覧を見る

お気に入り機能を
活用してより便利に!

お名前ID(会員ID)・パスワードでログインするとお気に入り機能をご利用できます。
お名前ID(会員ID)
パスワード

アカウント登録がまだの方

アカウント登録 (無料)