Web資料

HPの作り方

まず始めに、自分でHPを作る場合と、業者に頼む場合のメリットとデメリットを


【自作する場合】

メリット

  • ・HPを自分で自由に更新・変更・運営することができる。
  • ・かかる費用が少ない

デメリット

  • ・HPを立ち上げるまで、かなりの時間と労力がかかる。
  • ・ビジネスとして運営する場合、継続的な勉強が必要。運営に時間を費やすことになる。

【業者に依頼する場合】

メリット

  • ・時間を有効活用できる。(勉強しなくても良い。運営に時間を割く時間が少ない)
  • ・専門家なので、後々の運営が効果的となる。(SEOなど)

デメリット

  • ・費用がかかる
  • ・業者を変えると、一から作り直すことが多いので、また費用がかかる。

ここでは、自作する方法をご説明します。

最初にお伝えしますが、HPを新しく作るときは、事前のサイト設計が非常に重要です。

詳しくは「HPの設計で8割決まる」をご参照下さい。


ホームページを作る方法は2つあります。


  • 1.ホームページビルダー等のソフトで作る
  • 2.メモ帳などのテキストエディターで作る

本題に入る前に、少しhtmlとcssについて触れたいと思います。

htmlとcssはプログラミング言語の一つです。HPは見た目だけ見ると簡単そうな感じがするかもしれませんが、プログラミングの結果が表示されているので、中の構成は少し複雑です。

プログラムで構成されているので、1カ所でもスペル間違いなどあると、意図通りに表示されません。例えば<a href=”index.html”>が<a herf=”index.html”>だと、動きません。

htmlは主に表示される内容と意味づけの役割を果たします。

cssは主に見た目のデザインを調整する役割を果たします。


それでは、本題に入りたいと思います。

1.ホームページビルダー等のソフトで作る

ソフトで作るメリット

  • ・誰でもある程度は作れる。
  • ・htmlやcssを覚えなくても良いので、費やす労力と時間が少なくて済む。

ソフトで作るデメリット

  • ・HPがどのように構成されているのか、根本を理解しにくい。
  • ・デザインや更新などで、応用がきかない場合がある。

市販のソフトを購入して作る方が敷居が低く、先に挙げたhtmlやcssを理解しなくても、今はかなり本格的なものを作ることができます。

ソフトとしてはBINDが良いと思います。Adobe社のDreamweaverは有名ですが、ソフトの価格も高く使いこなすのにかなり覚えなければいけないことがあります。


デメリットは上記に挙げましたが、それ以外にソースの内容があります。

ソースが自動生成されるので、あとで作成したソフト以外で修正しようと思うと、大変な場合があります。

ソースとはhtmlの構成のことで、インターネットエクスプローラー(以下IE)でしたら、左上のファイル・編集・表示とある中の、表示をクリックして、ソースをクリックすると見ることができます。


2.メモ帳などのテキストエディターで作る

テキストエディターで作るメリット

  • ・新しくソフトを買う必要が無い。

テキストエディターで作るデメリット

  • ・作れるようになるまでに、労力と時間がかかる。はっきり言って「大変」

HPはパソコンに最初から入っているメモ帳などのテキストエディターで作ることができます。

この場合は、htmlとcssを理解する必要があります。

一度理解すると、更新やデザイン変更などを、思い通りに行うことができますので、HP運営を効果的に行うことができます。

私は秀丸というテキストエディターで、カラーナビを作成しました。

デメリットは、何と言っても労力と時間がかかるということです。


一度htmlとcssを理解してから、Dreamweaverなどのソフトを使って作るのが、一番効果的で効率的かもしれません。


もし、ビジネスとしてHPを長期的に運営するのであれば、htmlとcssを覚えると、何かと便利です。


私の場合は、ホームページビルダーから入りました。ホームページビルダーの本1冊を買って、それを読みながら作ろうとしたのですが、思い通りのものができないのと、ソフトを使い方を覚えるのが面倒で、すぐにソフトを使うのをやめました。

ここからが苦労しました。

まずhtmlとcssの本を1冊ずつ買って読むのですが、プログラミングの経験がなかったため、本に書いてあることが呪文に見え、読めども読めどもわからず眠くなるだけでした。

本だけ読んでもわからないので、実際のHPからソースを印刷して、その文章の一つ一つの意味を、本を参考にしながら確認していく作業を行いました。

この確認作業かかなり大変で、印刷したソース1ページを解読するのに数十時間かかりました。(javascriptなどもあったので、完全には理解できませんでしたが)


正直、途中で何度もやめようかと挫折しそうになりました。

だいたいわかるようになってきたところで、実際の作成に入ったわけですが、スペル間違い、文章間違いなどで思ったように動きませんでした。この間違いを見つけるのが大変で、一つの間違いを直すのに15時間かかることも。後になって、便利サイトを見つけて、最初から知っていれば・・・と思いました。

ようやく完成して、webにアップできたときの達成感はとても大きかったです。

喜びも束の間、今度はブラウザ間での表示違いという問題が発生しました。(詳しくはブラウザの表示の違いをご参照下さい)このブラウザ間の問題は、今でも常に発生しています。


実際に運営をしていくと、今度は検索エンジン最適化(SEOって?をご参照下さい)をする必要がでてきて、結局、せっかく作ったHPをほとんど作り直しました。

HPはいかに、検索で上位に表示されるかがとても重要になってくるので、今思うと、早めに気づいて作り直して良かったです。


ここまでで合計300時間以上がかかりました。遠回りもしましたが、問題が発生するたびにhtmlとcssに関する理解が深まり、結果的には良かったと思います。

HPはもっているだけではなかなかビジネスにつながらないので、運営が大事です。

もしこれから、新しくHP立ち上げを検討中でしたら、自作するにせよ、業者にまかせるにせよ、運営についての本を読んでから立ち上げると良いでしょう。

もし時間と労力をかけられない場合は、専門業者に任せた方が断然、HPと時間を有効活用できると思います。HPばかりに時間を費やすことは難しいと思いますし、労力もかかりますので、専門家に任せることによって、代え難い“時間”を有効活用できるようになります。

お金を投資するか、時間を投資するか。

なかなか難しい問題です。


【著者】八幡優
カラーナビ企画・サイト作成と運営責任者
カラーナビは、ユーザー様にとって面白く、有益な情報を提供することにより、より多くの「カラーとの出会い」を創り出すことがテーマです。
この「カラーナビ for school and consultant」では、これからプロとして活動する方・現在プロとして活動している方への情報を発信することにより、個々のカラーコーディネーター様の活躍にお役立てできればと思っています。
カラーナビへの広告掲載
info@colornavi.net
AISホームページ
http://www.ais-ais.co.jp