BLOG

WEB&ITのナレッジキャピタル

自分でホームページ制作をする方法を初心者向けに解説

  • ホームページ制作

最終更新日:2023年06月26日

自分でホームページ制作をする方法

個人・お店・会社のホームページを持っておきたいと思っていても、1からすべて自分で制作するとなると、「いったい何から手をつけていけば良いのか」と戸惑うこともあるでしょう。

いきなりホームページを自分で制作するのではなく、作成にとりかかる前にきちんとした手順を踏んで準備をしておくことも必要になってきます。

そこで、今回の記事では「ホームページを自分で作成するためのおすすめ手順」というテーマに沿って解説していきたいと思います。

ホームページ制作を自分で行うために必要な基礎知識・メリット・注意点・作成手順について、わかりやすくお伝えしますのでご期待下さい。

ホームページの新規制作・リニューアルを検討されていますか?

ホームページ制作大阪ドットコムでは、1998年の創業から培ってきた知見・経験を基に、ホームページ作成・集客のお手伝いなど総合的にWebのお困りごとをサポートしています。
Webに関することならまずは当社にお問い合わせください。

CTAのイメージ画像

CTAのイメージ画像(スマートフォン版)


実績豊富な
ホームページ制作会社なら

こちらをクリック

CONTENTS

自分でホームページ制作をするためにおさえておきたいポイント

メリットや、どのような人に向いているか

自分でホームページ制作をすることには、多くのメリットがあります。まず、自分で制作することでコストを節約することができます。プロに依頼すると高額な費用がかかりますが、自分で制作すれば、基本的なソフトウェアやツールは無料で使用することができます。

さらに、自分で制作することで、自分だけのオリジナルのデザインを作成することができます。プロに依頼すると、彼らのスタイルや経験が反映されたデザインになりますが、自分で制作すれば、自分だけのスタイルやアイデアを反映させることができます。

また、自分で制作することで、スキルアップにもつながります。HTML、CSS、JavaScriptなどのコーディングスキルや、デザインスキルを向上させることができます。

自分でホームページ制作をするのは、WebデザインやWeb開発に興味がある人に向いています。また、自分のブランドやビジネスのためにウェブサイトを持ちたいと考えている人、自分のポートフォリオを作りたいと考えている人にも向いています。

このように、自分でホームページ制作をすることには、多くのメリットがあります。コストを節約し、オリジナルのデザインを作成し、スキルアップすることができます。興味がある人は、是非試してみてください。

ホームページ制作にあたっての計画を立てる方法

ホームページ制作にあたっては、まず計画を立てることが重要です。計画を立てることで、制作にかかる時間やコストを把握し、目的に合ったホームページを作成することができます。

まず、ホームページ制作の目的を明確にすることが大切です。どのような目的でホームページを作成するのかを考え、その目的を達成するための戦略を立てましょう。目的は様々であり、販売促進、ブランディング、情報発信などがあります。目的を明確にすることで、それに合ったコンテンツやデザインを決めることができます。

次に、ターゲットとなる人を決めましょう。ターゲットとなる人を決めることで、コンテンツやデザインを適切に作成することができます。例えば、ビジネス向けのサイトの場合は、顧客や取引先をターゲットに、個人のポートフォリオサイトの場合は、業界の仲間や潜在的な雇用主をターゲットに設定しましょう。ターゲットに合ったコンテンツやデザインを提供することで、ユーザーエクスペリエンスを向上させることができます。

最後に、コンテンツを決めましょう。コンテンツはホームページの基本であり、サイトの成功に大きく関わります。例えば、ビジネス向けのサイトの場合は、会社の概要やサービス、商品の紹介などを、個人のポートフォリオサイトの場合は、自己紹介や作品の紹介などを掲載しましょう。これらのコンテンツは、目的に合った情報を提供することが重要で、また、更新頻度や更新内容も考慮する必要があります。

さらに、コンテンツを見やすく、分かりやすく、アクセスしやすいようにデザインすることも重要です。これには、レイアウトやフォント、画像などを適切に配置し、使用することが重要です。

このように、目的、ターゲット、コンテンツ、デザインなどを決めることで、ホームページ制作にあたっての計画を立てることができ、目的に合ったホームページを作成することができます。

ホームページ制作サービスを利用する選択肢もある

初心者が自分でホームページを作ることはそう簡単なことではありません。

そんなときはホームページ制作サービスを利用することもできます。これらのサービスは、インターネット上にあるテンプレートを使って、自分のホームページを簡単に作成することができます。ただし、機能やデザインに制限があることが多いので、上級者向けのものではないことが多いです。

ホームページ作成サービスで代表的なものは、Jimdo、Wix、ペライチなどがあります。

参考:「ペライチ」の評判と口コミからメリット・デメリット、料金を解説

ホームページ制作会社に依頼する

ホームページ制作を自分で行うのではなく、ホームページ制作会社に依頼することもできます。

これにより、専門的なスキルや知識が必要な作業をプロに任せることができ、高品質なホームページを作成することができます。
ただし、依頼費用や期間がかかることを考慮して、選択肢として検討する必要があります。

ホームページが世界中で見られる仕組み

ホームページを見ることができる根本的な理由は、インターネットというネットワークと、それを利用するためのプロトコルという規約が存在するからです。
以下に、その基本的な仕組みを説明します。

インターネットは、世界中のコンピューターが接続された巨大なネットワークです。これにより、地理的に離れた場所にあるコンピューター同士が通信することが可能になります。

HTTP(HyperText Transfer Protocol)は、インターネット上で情報を送受信するためのプロトコル(規約)です。Webブラウザ(Chrome、Firefox、Safariなど)はHTTPを使用して、ウェブサーバーからウェブページのデータをリクエストします。

Webサーバーは、Webページのデータを保管しているコンピューターです。Webブラウザからのリクエストを受け取ると、Webサーバーは対応するWebページのデータをWebブラウザに送信します。

Webブラウザは、Webサーバーから送信されたデータ(HTML、CSS、JavaScriptなど)を解析し、それをユーザーが読みやすい形(ウェブページ)に表示します。

このように、インターネットとHTTP、Webサーバー、Webブラウザという要素が組み合わさることで、ユーザーはホームページを見ることができます。これらの要素は、ユーザーがウェブページのURLをウェブブラウザに入力した瞬間から働き始めます。

ホームページ制作を自分でするための基礎知識

PCに向き合う男性

デザインについて

ホームページ制作にあたり、デザインについて説明します。ここでは、カラー、フォント、レイアウトなどを決める方法について説明します。

Webサイトをデザインする際には、全体の目的やターゲットに合った選択をすることが重要です。

最初に考慮すべきことの1つは、カラースキームです。選ぶ色はサイトの雰囲気や感じを大きく影響しますので、サイトの全体的なトーンや目的に合った色を選ぶことが重要です。例えば、ビジネスサイトの場合は、よりプロフェッショナルで控えめな色を使用しますが、個人のブログやポートフォリオサイトの場合は、より活気ある色を使用することができます。

また、フォントやレイアウトも重要なデザイン要素です。フォントは、サイトの読みやすさや視認性に影響しますので、適切なフォントを選ぶことが大切です。レイアウトは、コンテンツを見やすく、アクセスしやすいように配置することが重要です。

このように、カラー、フォント、レイアウトなどを適切に選択することで、目的に合ったデザインを作成することができます。

コーディングについて

コーディングは、プログラミング言語を使って、コンピュータに対して命令を出し、プログラムを作成することを指します。
Webページを作成する際には、HTML、CSS、JavaScriptなどの言語を使用します。これらの言語を使用して、Webページのレイアウトやデザイン、動的な機能などを実現します。

HTMLは、Webページの構造を記述するための言語です。HTMLタグを使用して、見出しや段落、リンクや画像などの要素を配置します。

CSSは、Webページのデザインを記述するための言語です。CSSを使用することで、文字の大きさや色、背景色などのスタイルを指定することができます。HTMLとCSSを組み合わせることで、見た目にも洗練されたWebページを作成することができます。

JavaScriptは、Webページに動的な機能を実装するための言語です。JavaScriptを使用することで、ユーザーがWebページ上で操作した際に、画面に反応するような動きを実現することができます。

ホームページ制作にあたっては、まずHTMLで構造を設計し、CSSでデザインを決めます。その後JavaScriptを使用して、動的な要素を追加していきます。これらの言語を組み合わせることで、高機能なWebページを作成することができます。

これらの3つの言語を使用して、自分で作成したWebページを開発することができます。ただし、これらの言語を学ぶのは簡単ではありませんので、事前に学習をすることをお勧めします。

レンタルサーバー

自分で作成したホームページを公開するには、レンタルサーバーの契約が必須となります。レンタルサーバーを契約することにより、ホームページを公開することはもちろん、WordPressやEC-CUBEなどCMSの導入もスムーズにできます。

優良なレンタルサーバー選びの6つのポイント

CPU

CPUとは英語で「Central Processing Uni」の頭文字をとった表現で、これを日本語に直訳すると「中央演算処理装置」という意味になります。

サーバーの頭脳として、データ処理能力に大きく関わる部分となるのがこのCPUです。レンタルサーバーに高性能のCPUが搭載されていれば、処理能力も高くなり、処理速度も速くなります。

メモリ

英語で「記憶」という意味を持つ「メモリ(memory)」は、コンピュータやレンタルサーバーでは「記憶装置」といった役割を担っています。

一部のレンタルサーバー会社ではメモリの容量に関する情報を公開していますが、中には非公開とする会社もあります。

CPUが処理を実行するために必要な作業スペースとなるのがメモリです。CPUと同様にメモリの数値が高ければ高いほど、ハイスペックになります。

データ転送量

ホームページのURLにアクセスすると、サーバー側からユーザーに対してデータ送信され、ホームページを閲覧できるようになります。

しかし、同じタイミングで特定のホームページに多くのユーザーからのアクセスが集中した場合、サーバーに対しての負荷が大きくなります。

そのような場合に、データ転送量が制限されてしまい、一時的にホームページの閲覧ができなくなることがあります。このような状態のことをサーバーダウン、またはサーバー落ちといった呼び方をすることもあります。

専用サーバーと共有(共用)サーバー

レンタルサーバーは、専用サーバーと共有サーバーの2つのタイプに区分されます。 ホームページ表示のスピードで比較すると、共有サーバーよりも専用サーバーの方が速いのが一般的です。

共有サーバーのことを共用サーバーともいい、複数名のユーザーで1台のサーバーをシェアするタイプです。これを家に例えると、一軒家の中に人数分の複数の部屋を振り分けて、各ユーザーが割り当てられたエリアの中で利用するといった形になります。

一方、専用サーバーはユーザー1人につき1台のサーバーを利用するタイプです。一軒家の中に複数名で暮らすシェアハウスのような共有サーバーとは違い、一軒家にひとりで住むというイメージです。

基本的に1人のユーザー専用のサーバーであるため、他のユーザーからの影響を受けることもなく、ハイスペックな通信環境が維持できるのが強みです。

ただし、共有サーバーと比較すると専用サーバーの方がランニングコストは高くなります。

共有サーバーは申し込みから利用開始までの流れがスムーズで、月額数百円程度の低料金です。

専用サーバーは高性能である反面、レンタルスペースの設置に時間がかかり、月額費用は共有サーバーの5~10倍も高額になるケースもあります。

参考:レンタルサーバー比較。おすすめ会社を費用と特徴で紹介

レンタルサーバーのサポート体制に着目

レンタルサーバーを選択する際に、サポート体制に着目しておくことが重要です。運営会社によっては、電話でのサポートにも対応できるところもありますが、時間帯によっては電話が混み合い、繋がりにくくなることもあります。

メールやチャットシステムでフレキシブルに対応できるようになれば、レスポンスがスムーズにできて、ユーザー側には通信費の節約にもなります。

セキュリティ体制

ホームページを作成して長期的に運営していくには、万全なセキュリティ対策が必須となります。具体的には、下記のセキュリティ対策を整えておくことが必要です。

  • SSL
  • WAF
  • IDS
  • IPS
  • ファイアウォール

ホームページを安全に運営するには、今やSSLは必須といっても過言ではありません。インターネット上で流れるデータに対して暗号化の処理を施すことにより、データの流出・改ざんなどの悪質な行為を防止することができます。

とくに、個人情報など重要なデータをユーザーから預かる場合は、SSLは必須であり、ユーザーにとっての「信頼の証」であると言えます。

WAF(ワフ)とは「Web Application Firewall」のことを指し、Webアプリの棒弱性を悪用した攻撃から運用中のホームページの安全を守るためのセキュリティ対策です。

ファイアウォールの場合は、おもに内部ネットワークへの攻撃に対して防御しますが、WAFの場合はWebアプリに対しての攻撃から守るのが大きな違いです。

IDSとは不正侵入探知システムのことを指し、IPSは不正な侵入を防御するシステムのことです。

ファイアウォールのみでは完全に防御するのが困難な大きな脅威に対しても、IDSやIPSを導入することにより防御対策としての有効性が高くなります。

独自ドメインの取得

ドメインとはインターネット上での住所表記であり、ホームページを公開・運用するためにはもちろん、ユーザーが閲覧するために必須となります。

一方、独自ドメインとは世界中にたったひとつしか存在しないオリジナルのドメインのことを指します。独自ドメインを任意で設定して取得することが可能です。

たとえば、店舗や企業のホームページを作成する場合は、店名・企業名で独自ドメインを取得しておくと、ユーザー側には親しみやすさが感じられるようになります。

サブドメインと独自ドメインの違い

サブドメインはドメイン名の前につく文字列のことを指します。

例えば、ホームページのURLが「http://abcdefg.com」である場合、独自ドメイン「abcdefg.com」の前の「○○○」の部分 (http://○○○.abcdefg.com) に任意で文字列を指定することができます。

独自ドメインを取得するメリット

ホームページを作成するのなら、独自ドメインはぜひ取得しておくことをおすすめします。独自ドメインの取得で、下記のメリットが得られることでしょう。

  • ホームページを訪問したユーザーからの親しみやすさと信頼度が高まる
  • 独自ドメインの活用でSEOの観点からも有利になる可能性がある
  • 一度取得しておけば継続的に長く使える
  • 独自ドメインと共通のメールアドレスを取得できる

独自ドメインを取得するデメリット

  • 独自ドメインの種類によってはコスト高になる
  • 費用の支払いを忘れないようにきちんと管理する必要がある
  • ドメイン取得後はWhois情報に登録内容や一部の個人情報が開示される
  • 独自ドメインを長期的に継続して使うことで維持費がかかる

ホームページを自分で制作するメリット

メリット

ホームページ制作コストの削減

ホームページ制作でもっとも気になるのは費用感です。自分でホームページを作成することにより、制作会社に依頼するよりもコストを大幅にカットできます。

制作会社に企画・構築・デザイン・コーディング・運用・管理まで一任する場合、ホームページの規模にもよりますが、数十万円から百万円以上かかる場合もあります。

一方、自分でホームページを作成する場合は、レンタルサーパーや独自ドメインの取得など、費用の捻出を最小限に抑えることができます。

ホームページ制作の知識と技術を習得できる

ホームページを自分で作成する場合は、レンタルサーバーの契約・独自ドメインの取得から、企画・構築・デザイン・コーディング・テスト・公開・SEO対策・運用・効果検証・管理に至るまで、すべての工程を自分で担うことになります。

ホームページを作成してから公開するまでは長い道のりではありますが、制作に必要な専門的な知識と技術をしっかりと習得することができます。

作成の途中で時には困難にぶつかることもあるとは思いますが、向上心のある方・何事にも根気強い方ならきっと乗り越えていけるでしょう。

マイペースで更新・追加・修正作業ができる

ホームページを運営する以上は、常に最新の情報にアンテナを張り、ユーザーにいち早く旬の情報をお届けして、集客数と売上アップに繋げていきたいものです。

また、時には既存のページに修正・追加・変更などの作業が必要となることもあります。制作会社に依頼すると別途費用が発生する上に、作業内容についてその都度伝えるのも面倒です。制作会社が繁忙期になったタイミングで依頼した場合は、スピーディーな対応が難しくなる場合もあります。

自分でホームページを作成しておけば、いつでも自由なタイミングで更新作業や修正作業ができるし、費用について気にする必要もありません。

自分好みのデザイン・色彩にカスタマイズできる

自分でホームページを作成することにより、色彩やデザインも自由自在に決定することができて、カスタマイズの自由性もあります。

WordPressでホームページを作成する場合は、テーマやプラグインを自分好みのものを自由に選び、必要な機能を導入することもできます。

ホームページを自分で制作するデメリット

デメリット

ホームページを自分で作成するメリットはたくさんありますが、その一方でデメリットをともなうこともあります。

ホームページを公開するまでに時間と手間がかかる

ホームページを自分で作るには、ある程度の専門的な知識と技術力が要求されます。作成の途中でわからないことがあれば、時にはつまずくこともあるでしょう。

日々の業務に追われる中で、1からホームページを自分で作成するのは並大抵なことではありません。作成してから公開するまでは時間と手間がかかり、根気強さが求められます。

マーケティングからSEO対策まで自分で行う

ホームページを作成して公開したら、長期的に運用してアクセス数を伸ばせるように努力する必要があります。そのためには、WEBマーケティングからSEO対策まで、すべて自分で行わなければなりません。

ホームページ制作会社ではWEBマーケティングにも精通しているので、すべておまかせしたいところですが、継続的に依頼するとなると、それなりに費用がかかります。

ホームページ作成だけではなく、集客数を伸ばすためのマーケティングやSEO対策に関する知識と技術力も必要になりますので、焦らず気長に根気強く対処しましょう。

運用が順調にいかず途中で行き詰まることも

ホームページの作成から公開・運用までの道のりは長く、時には「どうすれば良いのか」と頭を悩ませることも出てくるでしょう。

作成から公開までの段取りは順調だったのに、運用がうまくいかずに途中で行き詰まるケースも少なくありません。

周囲にホームページの作成・運用について詳しい人がいれば、良きアドバイザーとなってもらえることでしょう。身近に頼れる人がいない場合は、WEBコンサルティングやマーケティングなど、不足しがちな部分について制作会社にカバーしてもらうのも良いでしょう。

ホームページ制作に最低限必要なコンテンツ

自分でホームページを作成するのに、「最低限どんなコンテンツがあれば良いのか」熟慮する必要があります。

自分の目線で一方的に作成するのではなく、常にユーザーの視点に立ち、信頼性の高いホームページに仕上げていくことが重要です。

どんなコンテンツが必要なのか良い案が浮かばない時は、同じ業界・同じ職種のホームページを参照しながら、イメージを膨らませると良いでしょう。

ホームページ作成で最低限必要なコンテンツは、おもに下記の通りです。

更新情報

ホームページに最新の情報を掲載しておくと、注目されやすくなります。

ホームページ上での更新情報は1つの独立したページとして存在するのではなく、トップページの見やすい箇所に設置しておくのが一般的です。

例えば、店舗のネットショップを運営する場合は、「人気商品を入荷しました」「○月○日から特売セールを始めます」といった情報を掲載しておくと、ユーザーの購買意欲をそそります。

企業のコーポレートサイトや採用サイトの場合は、社内での取り組み・年末年始の休業日のお知らせ・新入社員の募集など、最新の情報を掲載すると良いでしょう。

更新情報は基本的に時系列の情報となりますので、月日が経過して古い内容が掲載されたままにならないように更新頻度を高め、旬の情報を発信していくことが重要です。

お問い合わせメールフォーム

ホームページにお問い合わせメールフォームを設置しておくことで、ユーザーとの繋がりが持てるようになります。

ホームページの閲覧に関する不具合、商品に関するお問い合わせや相談事があれば、ユーザーがメールフォームを通してメッセージを発信することができます。

営業時間内であれば電話で連絡することもできますが、時間帯によっては混み合い、繋がりにくくなることもあります。

お問い合わせメールフォームを設置しておけば、ユーザーが24時間いつでも送信することができて、電話で連絡する手間も省けます。

ユーザーに向けてサービスの品質向上を目指すという観点からも、お問い合わせフォームを設置しておくことをおすすめします。

サイトマップ

ホームページのボリュームやページ数の大小に関わらず、サイトマップを掲載しておくことをおすすめします。

サイトマップとはホームページの構成図・地図・本の目次のような役割を果たしており、これを見ればどんなコンテンツが掲載されているのかが把握できます。サイトマップを設置することで、ユーザビリティの向上にも繋がります。

SEO対策としての有効性を高めるには、合わせて検索エンジン向けにXMLサイトマップを作成しておくと良いでしょう。

XMLサイトマップとは?

XMLサイトマップとは、ホームページ内の構成・掲載されたコンテンツについて、Googleの検索エンジンにスピーディーに正しく理解してもらうことを目的として、設置するファイルのことを指します。

会社・店舗概要

企業・お店のホームページを作成する場合は、会社概要・店舗概要のページを設置することで多くのユーザーからの信頼度が高まります。

会社概要・店舗概要のページには、基本情報として所在地・連絡先メールアドレス・電話番号・設立年月・従業員数・資本金・事業内容・沿革・経営理念・基本コンセプトなどを盛り込んでおくと良いでしょう。

一方、個人の方がホームページを作成する場合は、個人情報保護の関係もありますので、どの部分まで基本情報を掲載すべきか慎重に判断しましょう。

商品・製品・サービス内容

企業・お店のホームページを作成する場合は、商品・製品・サービス内容について写真も交えて詳しく掲載しましょう。販売実績や使用例に関する情報があれば盛り込んでおくと、ユーザーからの興味を惹き、信頼度も高まることでしょう。

ブログ

ホームページ内にブログを設置して定期的に更新することで、ユーザーからの関心を大きく引き寄せ、有益な情報を発信できるようになります。

ブログを設置する場合は、下記の項目について留意しておくと良いでしょう。

  • コンテンツの内容に沿ったアイキャッチ画像を挿入してalt属性を設定する
  • ユーザーの利便性を考慮してブログ記事のカテゴリを分類して見やすくする
  • ブログ記事に内部リンクを設置する
  • ブログ記事の導入文の後に目次を挿入する
  • コンテンツマーケティングを意識してブログを定期的に更新する

ブログに質の高い記事を投稿して情報を発信し続けることで、ユーザーの流入経路の幅を広げることができ、ホームページの集客数アップの効果も期待できることでしょう。

ホームページを自分で制作する2つの方法

 

デスク

ホームページ制作を自分でする場合、ホームページ作成のソフトを使う方法と、オンライン上でWordPressを導入する方法があります。

ホームページ制作のソフトを使用する

自分でホームページ制作を行う場合、もっともポピュラーなソフトとしては、Adobe社のAdobe Dreamweaverがあります。お手持ちのパソコンにソフトをインストールしておけば、すぐに活用できます。

HTMLやCSSの知識を持たない方でも、テンプレートがいくつか組み込まれているので、これを活用しても良いでしょう。

ホームページ制作の作業中に、その都度プレビューして仕上がり具合を確認することができます。

パソコン・スマホなど多彩なデバイスに対応しており、どの端末で閲覧しても快適な環境で閲覧できるように工夫されています。

この他にはHTMLを記述してホームページを自分で制作する方法もありますが、知識と技術を習得するまでには時間と手間がかかります。ホームページのレイアウトが崩れた場合に、自分で対処するのは難しいです。

ホームページ制作のソフトを活用する場合は、ソフトの使い方をある程度習得しておけばサクサク作れるようになります。

WordPressで作成する

ホームページ制作のソフトを使わずに作成したいなら、WordPressがおすすめです。WordPressはCMSの一種であり、HTML・CSS・プログラミング言語などの知識を持たない方でも手軽にホームページ制作を自分で行うことができます。

WordPressは世界中でもっとも高いシェアを占めており、ホームページ制作の経験の有無に関わらず、スムーズに作成できるのが強みです。WordPressの簡単インストール機能が搭載されたレンタルサーバーを契約しておけば、導入から設置までスピーディーな流れになります。

WordPressのデザインテンプレートの種類が豊富で、その中から好みに合うものを選んで使うことができます。WordPressのシステム使用料は無料で、さらに機能を充実させたいなら必要に応じてプラグインを導入すると良いでしょう。

ブログ形式で記事の投稿や更新作業も簡単にできるので、最新の情報を発信したい時に便利です。シンプルな操作でお問い合わせフォームを作成することも可能です。

サイトマップを自動的に作成する機能も搭載されており、無料のall in one seoのプラグインを導入しておけばSEO対策としても有効性が高まります。

ホームページを自分で制作するためのおすすめ手順

ホームページの企画 (目的・テーマ・コンセプトを決定)

ホームページの作成に入る前に、しっかりとした企画を立てておくことが大切です。どんな目的でホームページを作成するのか明確にして、下記の4点について着目しておくと良いでしょう。

  • ホームページを公開して、どんなことを伝えたいのか
  • どのような人をターゲットにして何の情報を発信するのか
  • ホームページのタイプを決定する (コーポレートサイト・ネットショップなど)
  • ホームページの運営方針や基本コンセプトを決める

ホームページ作成の目的・テーマ・コンセプトを打ち出しておくことで、今後の方向性を明確に見い出せることでしょう。

ホームページの構成・構造図をまとめる

ホームページを立ち上げる目的・テーマ・基本コンセプトを決定したら、全体の構成・構造図をまとめる作業に入ります。

ホームページに掲載する内容について、最低限どのようなコンテンツが必要なのかよく考えてみましょう。

掲載するコンテンツについて、どのようにすれば多くのユーザーの関心を引き寄せることができるのか、効果的に伝えられるのか知恵を絞りましょう。

掲載する内容がまとまったところで、ホームページ全体の構造図をまとめておきましょう。

コンテンツ制作

ホームページの構成がまとまったところで、コンテンツ制作の作業に入ります。ホームページにブログを設置する場合は、「導入・本文・まとめ」の三部構成で記事を書いておくとユーザーに伝わりやすいです。

ページの最上部には記事のタイトルが設置され、この部分がキャッチコピー的な役割を果たしています。

記事タイトルの下の導入部では、短く3つの文章にしてシンプルにまとめると良いでしょう。

  • ユーザーが抱える問題や悩み事を明確に
  • 問題を解決するための方法を提案する
  • この記事に掲載する内容について要約する

記事作成が完了したら誤字・脱字・間違った表現がないか、校閲・校正作業を入念に行いましょう。

コンテンツ制作ではユーザーの気持ちに寄り添い、正確かつ有益な情報を発信することが大切です。

レンタルサーバーの契約と独自ドメイン取得

ホームページに掲載するコンテンツがある程度固まってきたタイミングで、レンタルサーバーの契約と独自ドメインの取得を行います。

ホームページをWordPressで作成する場合は、簡単インストール機能に対応したレンタルサーバーを選んでおくと便利です。

WordPressをインストールしてログイン

レンタルサーバーを契約したら、WordPressをインストールしてログインします。一般設定・投稿設定・表示設定・ディスカッション設定・メディア設定・パーマリンク設定など、各種設定を行います。

WordPressには無料のテーマが多数用意されており、その中から任意で選択するか、別のテーマを探してみても良いでしょう。必要に応じてプラグインを導入します。また、独自ドメインの設定も忘れずに行いましょう。

レスポンシブ対応にする

ここまで準備が整ったら、レスポンシブ対応ができているかどうか、パソコンやスマホで閲覧して確認しましょう。

レスポンシブ対応になっていない場合は、WPtouchやMobilePressなどのプラグインを活用すると良いでしょう。

プログラミングの専門的な知識がなくてもプラグインを導入することで、どの端末で閲覧しても快適に表示されるようになります。

全体のレイアウトとデザインを整える

ホームページ全体のレイアウトとデザインをキレイに整えましょう。ヘッダー・グローバルナビゲーション・メインコンテンツ・フッターのレイアウトが崩れていないか、快適に閲覧できるかどうか確認しましょう。

SSL設定でセキュリティ強化

ホームページのセキュリティを強化するための対策として、SSLを設定しておくと安全性がより高まります。

ホームページにSSLを設定した場合は、URLの先端部の表示が「http」から「https」に変わり、通信データの暗号化処理が施されるようになります。

ほとんどのレンタルサーバーで無料または有料のSSLが使えるようになっているので、これを活用すると良いでしょう。

WordPressの場合は、Really Simple SSL・WP Force SSLなどのプラグインを導入することで、SSL対応が可能となります。

作成したコンテンツを流し込み・画像の挿入

作成したコンテンツの中身を固定ページやブログなどに流し込み作業を行います。各ページに画像を挿入する場合は、先に「メディア」からアップロードの作業を行い、「メディアライブラリ」から画像を選択します。

1点補足しておくと、ホームページ作成で画像素材を探すのに困ることもあるでしょう。そのような時にぜひ活用したいのが、無料の素材サイトです。

写真・イラストなどの画像が完全無料・商用フリーで利用できる素材サイトも沢山ありますので、会員登録しておくと良いでしょう。

素材サイトでは特定のキーワードで検索すると、そのテーマに見合う画像が多数表示され、必要な画像がスピーディーに探せるので便利です。

サイトマップを作成する

ホームページに掲載するコンテンツをすべて作成したところで、サイトマップを作成します。

サイトマップを作成しておくと、ユーザーはホームページ全体の構成をスムーズに把握できるようになります。

WordPressでホームページを作成する場合は、検索エンジン向けのサイトマップのプラグインとしてGoogle XML Sitemapsを導入しておくと良いでしょう。

ユーザー向けのものでは、PS Auto Sitemapがおすすめです。サイトマップ用のプラグインを導入しておけば、ホームページのコンテンツが増減した場合でも、自動的に最新の内容に更新される仕組みです。

SEO対策

Googleの検索上位に表示させるための対策として、SEO対策を実践しましょう。WordPressでホームページを作成する場合は、All in One SEO Packのプラグインを導入しておくことをおすすめします。

タイトル・ディスクリプションなどの一般設定から、Googleの検索エンジンにホームページ全体の構造を伝えるXMLサイトマップ設定、コンテンツの重複防止対策に有効的なCanonical URL機能・ソーシャルメディア設定・スパム防止対策のブロッカー機能まで充実しています。

GoogleサーチコンソールとGoogleアナリティクス

SEO対策の一環として、GoogleサーチコンソールとGoogleアナリティクスについて理解を深めておくと良いでしょう。

Googleアナリティクスは、Googleから無料で提供されているアクセス解析ツールです。運営するホームページにGoogleアナリティクスを導入することにより、アクセス数などのデータが記録されます。

どのようなルートでホームページに訪問したのか、どのコンテンツを閲覧したのか、ユーザーの行動について分析することができます。

一方、GoogleサーチコンソールもGoogleから無料で提供されており、分析ツールとして役立てることができます。

Googleサーチコンソールを活用することにより、ユーザーがどのキーワードで検索してホームページにたどり着いたのか、正確に把握できるので便利です。

ホームページを長期的に運用するにあたり、Googleサーチコンソールを導入することにより、検索順位を下げる原因など、SEO対策に関する重要な問題点を早期発見できるようになります。

参考:Googleサーチコンソールの使い方・設定方法を解説

参考:Google アナリティクス4の使い方や設定方法

自分でホームページを制作する際の11の注意点と確認事項

 

確認事項

ホームページ作成のノウハウを習得すること

自分でホームページを作成する際によくありがちなのが、WEBに関する基礎知識と技術不足です。

途中で挫折しないためにも、ホームページの作成作業にとりかかる前に、最低限必要な知識と技術をしっかり習得しておくのが基本です。

そのためにはある程度の時間と手間がかかりますので、綿密に計画を立てて長期的に取り組み、焦らないことが肝心です。

必要以上に費用をつぎ込まないこと

ホームページ作成について、必要以上に費用をつぎ込まないように注意しましょう。ホームページ作成に入る前に、最低限どのような費用が発生するのか洗い出し、予算を立てておく必要があります。

定期的に更新作業と見直しを行うこと

ホームページ完成したらそこで終わりではなく、ここからが本格的なスタート地点になります。ホームページを公開したら、下記の項目について要チェックです。

  • 掲載した内容が古くなっていないか
  • アクセス数が伸びているか
  • ユーザーが見づらくないか (文字が小さい・文字色が薄い・レイアウト崩れなど)
  • ユーザーに対して有益な情報を確実に提供できているか
  • 掲載した画像 (写真・イラスト・表など) が見づらくないか

さまざまな観点から自分で作成したホームページをチェックしてみましょう。定期的に見直しを行い、できるだけこまめに更新作業を行うよう心がけましょう。

モバイル端末対応(レスポンシブデザイン)で作成すること

ユーザーのアクセシビリティを強化するためにも、ホームページはモバイル端末対応のレスポンシブデザインで作成するのが基本です。

パソコン・スマホ・タブレットなど、どの端末で閲覧しても、ユーザーが快適に閲覧できるように心がけましょう。

レスポンシブ対応にしておくことで、ホームページの更新作業やページの追加作業も余分な手間が省けて、SEO対策としても有効性が高くなります。

参考:レスポンシブデザインとは?メリットやデメリット、作り方、コツを解説

パンくずリストとサイトマップは必ず設置すること

ホームページには、必ずパンくずリストとサイトマップを設置しましょう。

パンくずリストとは、ホームページを訪れた人が現在どの立ち位置にいるのかを示すものです。これを見れば、ホームページ内でどの階層・どのページが表示されているのかが一目でわかります。

一方、サイトマップはホームページ全体の構造図・総合案内図のようなものです。パンくずリストとサイトマップを表示することにより、ユーザビリティの向上効果とSEO対策の効果が期待できます。

Adobe Flashは使用しないこと

「Flashが得意だから、自作のホームページにはぜひFlashを駆使して動きのある画像を作りたい」と意気込む人もいるようです。従来は、Flashで画像の切り替えを行い、デザイン重視のホームページが主流だった時代でした。

しかし、残念ながらFlashはAdobe 社にて2020年にサポートが終了しており、モバイル端末での閲覧も不可となりました。

Flashを使わない代わりに、jQueryを活用して画像に動きをつけると、スタイリッシュで見映えが良くなります。

文字・文章・画像を見やすくわかりやすく

ホームページの文字を小さく表示すると、ユーザーには読みづらくなります。

文章が長くなる場合は見出し・小見出しを活用して、適度に改行するなど、ユーザーの視認性の向上に繋げるよう工夫しましょう。画像は高画質のものを選び、目がチカチカしないように見やすくなるよう配慮しましょう。

著作権を侵害しないこと(記事・画像など)

ホームページの作成で絶対にやってはいけないことは、著作権の侵害です。ホームページに掲載する文章や画像には著作権がありますので、その点を十分に踏まえておかなければなりません。

デザイン・色彩に統一性を持たせる

ホームページでどんなカラーを使うか、イメージを決めておくことが大切です。

しかし、むやみにカラーの種類を増やしてしまうと統一性がなく、美しさが感じられなくなります。ホームページの色選びで失敗しないためには、色見本サイトや配色ツールなどを活用すると良いでしょう。

ホームページのイメージにピッタリな色をメインカラーにして、色彩に統一感を持たせておくと、見映えが良くなります。

ホームページの表示速度を要チェック

ホームページを作成して公開したら、表示速度について入念にチェックしましょう。あまりにも表示速度が遅いと快適に閲覧できなくなるため、ユーザーの離脱率が高くなるリスクが生じます。

SEO対策の禁止事項

自分で作成したホームページを公開して、Google検索上位に表示させたいのであれば、SEO対策が必須となってきます。

しかし、間違った手法で行うと、かえって逆効果になるケースもありますので要注意です。

下記の2点についてチェックしてみましょう。

  • 必要以上に特定のキーワードを盛り込みすぎてはいないか
  • ホームページに掲載する記事の品質が著しく低くなってはいないか

それよりもユーザーにとって有益となる情報を積極的に発信して、自然な流れで文章を作成することが大切です。

ホームページを自分で制作するためのおすすめ手順 まとめ

今回はホームページを自分で作成するためのおすすめ手順というテーマで解説しました。この記事を最後まで読んでいただいて、「これならホームページ制作で自分で出来そう」と感じた方も多いことでしょう。

しかし、中には「自分でホームページ制作をするのはまだまだ難しそうだから、きちんと勉強して知識と技術を学んでから取りかかりたい」という人もいるかもしれません。

ホームページ作成にとりかかる前に、どんな目的で作成するのか、どんなデザイン・レイアウトにしたいのか、どんなメッセージを発信していきたいのか、明確にしておくと良いでしょう。

自分でホームページ制作をするのに、はっきりとした目的・目標があれば、創作意欲も湧いてくるというものです。

ホームページの新規制作・リニューアルを検討されていますか?

ホームページ制作大阪ドットコムでは、1998年の創業から培ってきた知見・経験を基に、ホームページ作成・集客のお手伝いなど総合的にWebのお困りごとをサポートしています。
Webに関することならまずは当社にお問い合わせください。

CTAのイメージ画像

CTAのイメージ画像(スマートフォン版)


実績豊富な
ホームページ制作会社なら

こちらをクリック



CONTACT

お問い合わせ

お見積もりのご相談・お問い合わせはこちら。
外注・業務委託も承っております。
お気軽にお問い合わせください。