ホームページ制作やSEO対策についての情報ページ

ホームページ制作 大阪のファーストウェーブロゴ

ホームページ制作 本町のファーストウェーブ電話番号

ホームページ制作 ブログ

全てのブログを見る

ホームページ制作・管理・更新 自分で出来る??

【投稿日:2023/01/22】

ホームページ制作・管理・更新は自分で出来る?
それって難しいの??

①そもそもホームページを自分で制作・管理・更新できるの?

23303705

ホームページを自分で制作して管理・更新することはできるのか?
その答えはYESです。
YESとお答えしましたが、ある程度の環境やスキルは必要です。 何事もそうですが、まったくの素人が何かを作り上げるのは、努力が必要なのは当たり前ですよね!努力すればホームページの制作や管理は可能です。
それでは必要な環境やスキルについて出来るだけ分かりやすく述べていきたいと思います。

①ー1 自分で制作・管理する場合の必要な環境は?

まずはホームページを制作する上で必要な環境からお話します。
ホームページ制作に必要なのは、まずパソコン。パソコンはWindowsでもMACでもどちらでも構いません。できれば高スペックパソコンが理想です。
高スペックパソコンが必要な理由は、画像編集ソフト(Adobe Photoshop・Adobe Illustrator)やコーディングソフト(Adobe Dreamweaver)等を使用する際に、ある程度のCPUとメモリーを積んでいないと作業効率が落ちるからです。CPUは人間でいう脳、メモリーは作業机と思ってもらえるとわかりやすいと思います。人間が作業するのに脳の回転は作業効率に重要ですよね!また、作業机が狭いと作業効率が落ちます。パソコンもそれと同じで広い机と優秀な脳が作業効率をアップさせます。

ホームページ制作に必要なオススメソフト

  • Adobe Illustrator(イラスト・図面・ロゴを作成等)
  • Adobe Photoshop(画像のトリミング・画像加工・バナー作成等)
  • Adobe Dreamweaver(コーディング・FTP接続等)

上記のソフトは比較的プロ仕様のソフトですが、使い方を勉強しようと思うとYou Tube等でたくさんの解説動画があります。操作は難しいですがマスターすると非常に美しくてプロっぽいホームページ制作が可能です。是非You Tube動画等で必要なスキルをマスターしてください。
上記3つのソフトはサブスクリプションのAdobe Creative Cloudで全て使用可能です。※Adobe Creative Cloudは上記の他に動画編集ソフト(Premiere Pro)なども使用可能です。 ※Dreamweaverだけなどの単品サブスクリプションもあります。

①ー2 ホームページを制作・管理するためのスキルは?

23344951

ホームページを自分で作成するためには

  • HTML
  • CSS
  • JavaScript(上級者向け ※動きの無いホームページ制作の場合は不要)

のスキルが必要です。
では上記のうち、必須のHTMLとCSSはどのような役割を持つのかを説明していきます。

【HTML】

ハイパーテキスト・マークアップ・ランゲージの略で、ホームページを制作するための言語です。見出し・段落・リンク等をマークアップしていきます。
HTMLには「タグ」が複数使用されており
例えば
<h1>一番大きな見出し</h1> → h1タグ
<p>段落</p> → pタグ
などがあります。
HTMLを記述するにはパソコンにインストールされているメモ帳でも可能ですが、AdobeのDreamweaverを使用すると入力のアシストをしてくれるので、かなり楽になります。また、記述したHTMLをアップロードする際も、Dreamweaverから直接FTP接続することが出来ます。
Dreamweaverはパソコン内のファイル内の階層を保持することができるので、サーバーにアップロードする際も階層を考えずにアップロードしてホームページを更新することが出来ます。

【CSS】

カスケーディング・スタイル・シートの略で、ホームページのスタイル(デザイン)部分を担うものです。フォントの色の指定・フォントの大きさ・フォントの太さ・段落と段落のスペースの大きさ等を指定していくことが出来ます。
一例を上げると
■HTML
<h1>一番大きな見出し</h1> → h1タグ
■CSS
h1{
color:red;
font-size:18px;
}
このCSSを解説すると
h1タグのフォントの色を赤にして、フォントサイズを18pxにしてね!
という指示ををCSSでしています。
CSSにはインライン記述と外部ファイル記述の2つの方法があります。
インライン記述とは、HTMLに直接CSSを記述する方法です。
外部ファイル記述とは、HTMLにCSSファイルをリンクさせて、外部のファイルとしてCSSを記述する方法です。記述方法はヘッダー部分に
<link rel="stylesheet" href="sample.css" type="text/css" media="all">
のように書きます。そして「sample.css」にスタイルを記述していきます。

おすすめは「外部ファイルCSS」です。
インライン記述の場合、HTMLファイルに直接記述することでHMTLとCSSが混在してしまって、後で管理がやりにくくなります。
また、ホームページは複数のページでヘッダー(上部)やフッター(下部)などの共通部分があります。これらを後から変更する場合などインライン記述の場合は全てのページの修正が必要となります。外部ファイル記述の場合は外部ファイル1つの修正で全てのページの修正が一括で可能です。

①ー3サーバーとドメイン取得について

初心者の方がホームページ制作をするにあたって二の足を踏む理由として、レンタルサーバー契約・ドメイン取得が大きな原因になっているのではないでしょうか?
サーバー・ドメインの構造や関係は非常に複雑な感じがしますよね…。
※筆者もはじめてのサーバー契約は緊張いたしました…。

サーバー契約・ドメイン取得についてわかりやすく説明します。

【レンタルサーバー契約】

そもそもレンタルサーバーとはレンタルサーバー企業がサーバーを貸し出してくれています。
共用サーバーの場合は複数のサーバーを保持しているレンタルサーバー企業のひとつのサーバー内のスペースを借りるイメージです。
専用サーバーの場合はひとつのサーバーを独占して借りる事ができて自由度は増しますが、複雑な作業が必要になります。それにくらべて共用サーバーは管理画面からの設定がメインですので、サーバーのマニュアルを見ればある程度直感で設定することが可能です。

筆者オススメのレンタルサーバー
エックスサーバー

【独自ドメイン取得】

独自ドメイン取得はレンタルサーバーを借りるレンタルサーバー企業で取得すると比較的簡単に取得できます。というのも、レンタルサーバーを契約したら管理画面が与えられるのですが、その管理画面から引き続きドメイン取得もできてしまうからです。特に難しいことなくドメインを取得することができるのです。たとえば、「ドメインは別のサーバー企業が安いからこっちで取得しよう」となると、サーバーとドメインが別々の会社(別々の管理画面)になってしまい、取得したドメインを別会社のサーバーに設定する作業が必要になり、若干複雑な設定が必要になります。
ですのでサーバーやドメインの取得・設定に詳しく無い場合は同じレンタルサーバー企業でサーバー契約・ドメイン取得をするようにしましょう。
また、サーバー契約 ドメイン取得はハードルが高そうだな…と感じるのであれば、制作業者にこの作業だけ代行してもらうことも可能です。

①ー4無料で制作できるホームページサービスってどうなの?

最近では「無料ホームページ」なるものがよく宣伝されています。無料というのは魅力的ですが、デメリットも結構あります。

代表的なデメリットは

  • デザインがテンプレートのため、同じようなホームページが複数存在する
  • カスタマイズするのにはかなりの専門知識が必要(HTMLやCSS)
  • 広告が表示される
  • 独自ドメインを使用できない、もしくは使用するなら有料
  • 突然サービスが終了する、もしくは有料化する

等があげられます。

一番怖いのはサービス提供会社が収益の悪化等でサービスを終了することです。せっかく作り上げてきたホームページがある日突然無くなってしまってはたまったものではありません。
また、筆者の経験上無料ホームページサービスはSEO(検索順位最適化)には弱いような感じがします。無料ホームページのソースコード(HTML)を見てみると、ソースコード上部に不要っぽい(簡単にデザイン、更新できるようにするためのプログラム等)コードがかなりの行数で書かれています。そのせいで肝心なコンテンツが下の方になってしまっています。SEO的にはあまり理想的なソースではないように思います。※こちらは個人的な見解です。
無料ホームページを利用される場合はこれらのデメリットを検討した上でご利用ください。

②ホームページを自分で制作するまでの工程

23412748

②ー1 まずはサーバー契約とドメイン取得

サーバーの契約と独自ドメイン取得が最初の工程となります。私の個人的なおすすめはXserverです。国内シェアNO1の実績があり速度も問題ありません。タイミングによっては独自ドメインが契約中永久無料の特典もあったりします。どこのサーバーを借りようか悩んでいるのであればXserverをオススメします。
Xserverでサーバーを契約したら、続いて管理画面からドメインも取得しましょう。
現在(2023/01/16)では独自ドメイン永久無料のキャンペーンが有るのでサクッと独自ドメインも取得しましょう。独自ドメイン取得の上で一つアドバイスするのであれば、あなたのサービスに関連するワードが入ったドメイン取得をしましょう。
例えばイタリアン料理店であれば、italian-〇〇.comなどできる範囲でいいので業態のワードを入れる事をオススメします。

筆者オススメレンタルサーバー 「Xserver」
初期費用無料、月額990円から、高速・多機能・高安定レンタルサーバー『エックスサーバー』

②ー2 html・cssでコーディング

サーバー契約・ドメイン取得が完了したら、次はいよいよウェブサイトの作成です。
Illustratorでロゴの作成やPhotoshopで画像加工を済ませて、いよいよコーディングです。
個人的にはコーディングソフトはDreamweaverを使うのがベストだと思います。
これらのソフトの使用方法はYou Tubeなどで検索するとたくさんの動画がありますので、前もって勉強しておきましょう。

②ー3 FTPでサーバーにアップロード

Dreamweaverでコーディング作業が終わったら、サーバーにアップロードしましょう。
DreamweaverのFTP接続設定をするとコーディング→FTPアップロードと繰り返し行う修正、更新作業が簡単にできます。
一度設定してしまうとファイルの階層を考えずにアップロードできるのでおすすめです。

②ー4 ドメインにアクセスして表示の確認

アップロードが終了したら、実際のURLにアクセスしてホームページを確認しましょう。
トップページだけではなく、すべてのページを確認しましょう。
また、レスポンシブウェブデザインの場合は、自分のスマートフォンでURLにアクセスしてスマホサイト表示も確認しましょう。

③ホームページを自分で制作する場合のメリット、デメリット

③ー1 自分で制作する場合のメリット

23316269

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

  • 制作会社に支払う代行費用が不要
  • 自分自身のスキルアップにつながる
  • ホームページを修正、更新したい際にすぐに実行できる
  • ホームページを自分で作ることでマーケティングも考える事ができる

のような事が挙げられます。

③ー2 自分で制作する場合のデメリット

23316260

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

  • ホームページを制作する前に勉強する時間がいるので、完成までに時間がかかってしまう
  • 制作する為のソフトを使用するのに費用がかかる
  • コーディング中のデザインのズレ等が発生すると、解決するまでにかなりの時間がかかる
  • サーバー、ドメインの設定や管理を自分でやらなくてはいけない

などがあります。

④まとめ

ホームページを自分で一から制作するのは可能だと言いましたが、もちろん可能なのは可能です。しかし、事前の勉強や制作中に解決するべき事がたくさんでてきます。時間に余裕のある方はご自身でのホームページ制作に是非チャレンジしてください。
自営業者(他にホームページを作るスタッフがおらず、経営者自身が制作 修正 更新する)や、副業したいが、本業で時間が無いという方はホームページ制作の専門会社に代行制作してもらいましょう。
特に自営業の方はご自身の商売を伸ばす事が優先です。自分でホームページ制作をすることはご自身の商売を一番よく理解しているので非常にいいことですが、会社の売上を上げる事がメインですので、そのあたりのバランスをしっかり考えてからにしてください。

ホームページ制作・SEO対策についてのメールお問合せ

ホームページ制作・SEO対策についての電話お問合せ