Skip to content
イノーバマーケティングチーム2024/02/05 13:31:431 min read

ホームページの作り方にはどんな方法がある?HTMLの役割と選定ポイント

ホームページを作るには、専門知識がないと難しいと思っていませんか?
ホームページの作り方には、いくつかの方法があります。ホームページは選択する方法により、初心者の必要最低限の知識で作ることができます。この記事では、いくつかのホームページの作成方法と、どの方法を選択しても必要になるホームページの基礎用語をまとめました。
さらに今回は、それぞれの方法のメリット・デメリットを理解した上で、ホームページはどう作るべきかを考えます。

基礎用語

ホームページを制作するなら、知っておきたい基礎用語です。

HTML (Hyper Text Markup Language)

13図1.png

ホームページに文章・画像・動画を表示させるためのマークアップ言語です。
<開始タグ></終了タグ>で、内容を囲んで記述します。内容に対応したタグで囲うことで、その意味や役割を正確にブラウザやコンピュータに伝え、表示させることができます。いつ見ても同じように表示される静的なコンテンツをつくります。

CSS (Cascading Style Sheets)

13図2.png

ホームページのレイアウトやデザインを定義するスタイルシート言語です。HTMLで定義した文書構造に、CSSでデザインを追加することで、ホームページの見栄えをよりよくすることができます。

JavaScript

13図3.png

HTMLやCSSにできない動きや機能をホームページに追加するプログラミング言語です。ホームページが表示されるブラウザ側で、言語が処理されて実行されます。

PHP (Hypertext Preprocessor)

動的なコンテンツをつくれるプログラミング言語です。動的コンテンツはアクセスしたタイミングや状況で表示が変わります。表示されるホームページのサーバー側で、言語が処理されて実行されます。

サーバー

ホームページを保管する場所です。ネットワーク上でデータを提供する側がサーバー、データーを利用する側がクライアントです。サーバーは、クライアントからの要求に応じて保管してある情報から、必要なサービスを提供します。

ドメイン

ドメインは数字だけのIPアドレスを、人間に分かりやすい形に置き換えた、インターネット上の住所です。
ホームページURL「https://〇〇.com」では「〇〇.com」の部分がドメインに該当します。ドメインには独自ドメインとサブドメインがあります。独自ドメインは自分で好きな文字でつくる世界に一つしかないドメインです。サブドメインは、ドメインを分割する時に使われる文字列です。「https://×××.〇〇.com」では「×××」の部分がサブドメインに該当します

DNS (Domain Name System)

数字を組み合わせたコンピュターの住所「IPアドレス」を人に理解しやすい「https://〇〇.com」のような文字列に変換するしくみです。

ホームページが表示される仕組み

13図4.png

HTML、CSS、JavaScriptなどのファイルで構成されたホームページのデータは、サーバーに格納されます。サーバーにはたくさんのホームページが置かれるため、区別するためにインターネット上の住所になるドメインをつけます。ユーザーは、ドメインを使いホームページにアクセスすることで、たくさんあるホームページの中から、希望するサイトを閲覧します。

ホームページの作り方

それでは、ホームページの作り方にはどのようなものがあるのかみていきましょう。

HTMLで0から作る

HTMLとCSSなどのコードを手打ちして、ホームページを作る方法です。この制作方法では、HTMLとCSSの知識は必須になります。手打ちしたホームページファイルは、画像データなどと共にフォルダに格納し、サーバーにアップロードして公開します。

【メリット】
知識があればWindowsやMacに搭載されているメモ帳でもつくれ、制作コストが抑えられます。自分で自由に編集や更新ができ、制作過程でHTMLやCSSなどの言語知識がみにつきます。

【デメリット】
サーバーやドメインを別に用意する必要があります。HTMLやCSSは新しい表現方法も生まれる上に、ノンコードも今のトレンドのため、スキルが陳列化しやすくなります。

CMS (Contents Management System)

13図5.png

CMSは専門知識がなくても、ホームページのコンテンツ構築・管理・更新が簡単にできるコンテンツマネジメントシステムです。テンプレートをカスタマイズしたり、プラグインで必要な機能などを追加して、ホームページをサーバー上で制作します。

CMSには、大きく分けてオープンソース型と独自開発型があります。
オープンソースは、Wordpressに代表される、ソースコード公開の誰でも利用・改変・再配布できるソフトです。独自開発型は、ベンダー企業が独自に開発したCMSで、さらに、オンプレミス型とクラウド型に分けられます。オンプレミス型では、サーバーやネットワークを自社が管理し、クラウド型では、ベンダー企業が管理します。

【メリット】
種類が多く、用途と費用にみあったものが選べます。専門知識がなくても、簡単にデザインや編集、更新ができます。

【デメリット】
テンプレートから制作するものが多く、見た目が他社と似通いやすくなります。本格的なカスタマイズやトラブルには、専門知識が求められます。

ホームページ制作ソフト

ソフトを、パソコンにインストールしてホームページを作成します。
【メリット】
初心者~プロ向けまであるので、スキルにあったソフトが選べます。初心者向けのものは、専門知識がなくても、ホームページが制作できます。買い切り版では、購入後に費用が発生しません。

【デメリット】
サーバーやドメインを別に自分で用意する必要があります。ソフトやOSのアップデートにともない制作環境を見直さなくてはいけなくなります。

ホームページはどう作るべき?

ホームページの制作方法は複数あり、どの制作方法にも、メリットとデメリットがあることがわかりました。
どれか一つを選ぶとなると悩んでしまいますが、ホームページは一体どのように作ればよいのでしょうか?

ホームページを作成するには、まず初めに何のために制作するかという目的を明確にすることが大切です。目的を決めずに制作してしまうと、ユーザーに適切な情報を提供できず成果につながりません。目的設定では、ホームページのユーザーにどんな行動をおこしてもらいたいかを具体的にイメージしてみましょう。そして、目的にそって求められるものは何かを考えてみます。

旧来、ホームページは企業情報や代表プロフィール、商品カタログなどを掲載する役割が求められていましたが、昨今は「オンライン上で購買が完結する」「Webサイトで個人情報を獲得する」といった発展的な使い方をされるようになってきています。実際、企業が運営するホームページで、個人情報を扱わないサイトはないといってもいいように思います。

ホームページ作成ツールを使えば、専門知識がなくても簡単に問い合わせフォームや決算システムの導入ができます。しかし、そこにあるのは「お客様の大切な個人情報がWebサイトに格納される」という現実です。個人情報が、制作ツールの脆弱性により流出すれば、企業への信頼は大きく失われてしまいます。

このことからも、ホームページ制作でより強く求められるのは「ホームページを通して、お客様の大切な個人情報を扱うという意識」ではないでしょうか。

企業のホームページ担当者は、「安さや制作のしやすさ」ばかりに目を向けるのではなく、「お客様の大切な個人情報を守れるか」「サイトを中長期的に運用できるか」という観点から、制作方法を選定することが大切です。

avatar

イノーバマーケティングチーム

株式会社イノーバの「イノーバマーケティングチーム」は、多様なバックグラウンドを持つメンバーにより編成されています。マーケティングの最前線で蓄積された知識と経験を生かし、読者に価値ある洞察と具体的な戦略を提供します。

関連記事

人気記事

2024/02/04 15:35:03

5W1Hとは?今すぐビジネスに活かせる3つの応用パターンを事例含めて徹底解説!

5W1Hの基礎知識と正しい使い方
Start Reading
2024/02/05 10:34:24

【コンテンツマーケティングの第一人者が解説】ブランディング完全ガイド - 基礎知識から事例、戦略立案まで徹底解説

ブランディングの基礎知識から事例、プロセス、マーケティング戦略までを網羅的に解説。企業やスタートアップのブランディング実践に役立つポイントが満載。SNSやYouTube、コンテンツマーケティングを活用したブランディング手法も紹介。ブランド構築に取り組む全ての方必見の完全ガイドです。
Start Reading
2024/02/05 10:37:34

ファイブフォース分析とは?具体例を挙げながらわかりやすく解説

ファイブフォース分析とは?具体例を挙げながらわかりやすく解説
Start Reading
2024/03/16 20:13:36

【2024年最新】オウンドメディアとは?企業の成長戦略を加速させる最強のコンテンツマーケティング手法

オウンドメディアとは自社で所有・運営するWebメディアのこと。メリットや始め方、運用のコツ、成功事例などを徹底解説。広告に頼らず自社の情報発信力を高め、見込み客を増やしブランド力向上を目指す方必見。
Start Reading
2024/02/05 8:54:38

マーケティング戦略で使える5W1Hとは?基本知識とケーススタディ7選

マーケティング戦略で使える5W1Hとは?基本知識とケーススタディ7選
Start Reading
2024/02/02 21:14:35

URLの基礎知識:構成要素の意味からSEO対策まで分かりやすく解説!

URLとは何か、基本的な構成要素から分かりやすく説明。独自ドメインやHTTPSなどのSEO対策も解説。Webサイトを制作・運営する上で知っておくべきURL の基礎知識をまとめました。
Start Reading