Webサイト制作を始める前に確認しておきたい事とWebサービスの紹介

ホームページ作りとも言います。「Webで作品を公開したい!」「自分の公開スペースを作りたい!」なんて思ったときに、いくつか自分のWebスペースを作る方法を紹介したいと思います。

まず目的を決めてから

まず「誰に何をどういう風に見てほしいのか?」→目的を決めることが第一です。

「撮った写真を載せる」とか「色々作ったものを載せたい」とか「ただの日記」とか「色々な人との情報交換の場を作りたい」とか、目的は色々あるかと思いますが、それを決めなくては形が見えてきません。

あたりまえの事ですが、これが一番重要です。

最近では色々なサービスが充実しているので、昔のように”ホームページ”を作らなくても、自分のWebサイトを作ることはできます。見栄えのいいWebサイトを作るのは意外と時間がかかるので、それに費やす時間を是非自分のクリエイティブに費やしてほしいです。

サービスを使う

最近では、SNS(ソーシャルネットワーキングサービス)やブログサービスなどを使えば簡単に自分のWebページができてしまいます。プロのWebデザイナーが見やすいように最適化しているので、読者、視聴者も見やすく、コミュニティを活用すれば見てもらえる場も広がります。

SNS

SNSというと一般的にtwitterfacebookmixiGREEMobageMyspaceなどが思いつくと思います。

そんな中でクリエイター向けのサービスを展開しているところも結構あります。スマホなどでも見れるので、外出中にパッと他の人に見てもらうにもアップしておくといいかもしれないです。

割と有名どころ(というか私の周りで使っている人が多いところ)を集めましたが、他にも色々とあります。

ブログサービス

ブログサービスを使って日々の日記や写真、らくがき、Tips等を載せると、SNSとは違った、”自分のサイト”が作れます。

SNSの情報をブログに持ってくることもできます。

最近は「ちょっとブログっぽぃことやるならTumblrでよくね?」とかよく聞きます。特に文章ベースでなく、画像(写真、イラスト)が多い方はオススメです。

一般的なブログサービスなら、FC2、Blogger、忍者ブログ、アメーバブログを使っている方をよく見かけます。

Webサイトを作る【CMS編】

「上に挙げたようなサービスに頼りたくない!」「オリジナルが作りたい!」と思う方もいると思います。そうなると、Webサイトを作るということになります。
となると、勿論それなりに手がかかります。

最近のWebサイト制作のキーワード:「CMS」

HTMLとかCSSとかJavascriptなんかに手を付ける前に、一回頭に入れておくといいものがあります。それが「CMS(コンテンツマネージメントシステム)」です。最近の一般的なサイト構築では、ほぼ使われていると言っても過言ではないほどに使われています。このサイトもリニューアル時にCMSの一つであるWordPressというシステムを使って作りなおしました。

CMSとは、簡単に言えば、ブログのようにブラウザ上でコンテンツを更新・管理できるシステムです。

例えば、このサイト「俺CG屋」で考えてみましょう。

CMS導入前

更新しようと思うと、

  1. 新しいHTMLファイルを作成(テンプレート化はしてました)
  2. その中の書き込む部分(タイトル、本文、概要など)を探してHTMLファイルに直接書く。
  3. さらに、トップページ、カテゴリページ、サイドバーのカテゴリ部分などに、新しい記事が書かれたことを書き加える。(サイドバーは1つ書けばすべてに反映されるようにはしてました)
  4. それらをファイルアップロードソフトでアップし、結果を確認する。

という非常に面倒な工程を踏まなくてはいけません。しかも、この作業をしようと思うと、家でしかできませんでした。

CMS導入後

更新しようと思うと、

  1. WEBブラウザで自分のサイトの管理画面にアクセス。
  2. そこで記事に必要な情報を書き込む。
  3. 結果を確認する。

という感じにブログを書く雰囲気で一瞬でアップできます。あの面倒だった更新情報を他の所に書き込むことも自動でやってくれます。しかも、インターネット環境があれば、どこからでもアップできるので、極論スマホからでもアップできます。

以上のように、更新が非常に楽になります。更新のしやすさはモチベーションにも繋がるので非常に大きなファクターだと思います。こういうサイトを動的なサイトと言います。

もちろん、上の例でいうHTML直書き(静的なサイト)の方がいい場合もあります。それは変更がない、更新頻度が少ない、または1ページで完結する場合です。大きな企業のサイトとなれば、そのページごとに最適化するので、動的なサイトよりも静的なサイトの方がいい場合もあります。

もう一つCMSを進める理由

楽に更新できるCMSですが、日本では「Movable Type」「WordPress」という2つのシステムがほぼメインになっています。Movable Typeの方は詳しくないのですが、Wordpressの方は「テーマ」というものが設定できて、それを変えるだけでサイトのデザインを一瞬で変えることができます。

このテーマは無料でクオリティの高いものが沢山あり(もちろん有料もあります)、色々なWebデザイナーの方が配布してくれています。

これを使えば、HTML、CSS、Javascriptなどの勉強をすることなく(HTMLだけ記事を書くときに必要な場合もあり)、サイトを作ることができます。他人のデザインを使用するという意味では、上のWebサービスとそう変わりはないかもしれませんが、広がりはあります。

CMS導入時の注意

ただし、CMSはWebサービスのようなものではありません

なので、サーバーが必要になる点は普通のWebサイトと変わらないので注意してください。あくまでシステムです。

ちなみに、WordPressはオープンソースなので無償。Movable Typeの方は個人版は無償、商用利用は有償63000円、オープンソースは無償で商用利用可能だが、機能に制限ありとなっています。

「テーマで一発!」というのでなく、カスタマイズするのであれば難易度は一気にあがりますので、html、css、javascript等を習得した後に検討してみてください。

Webサイトを作る【必要な技術など】

オリジナルサイトを作るには?

さて、Webサイト制作を始めるわけですが、基本的にHTMLCSSを勉強しないとどうしようもないです。

このHTMLというのは、いわゆるプログラミング言語みたいなものなのですが、c言語とかそういう「いかにもプログラミングです!」みたいなのとは違って、「ここはこうしてね」くらいで簡単にできるようになっています。 なので、「勉強かぁ・・・」と臆することはないです。

このHTMLと一緒に付いてくるのがCSSというものです。 HTMLは文章構造(「ここが見出しだよー」とか「ここに画像を入れてー」とか)を書くものなのですが、 CSSは見栄えを書くものです。見た目を良くしたい方はCSSを重点的にやっていくと、とても見栄えのいいサイトができます。

これに足す形で、動き等の見た目を出す場合はJavaScriptというスクリプトを使います。JavaScriptは非常にできることが多く、見た目から内部的なものの制御までできます。HTMLやCSSに比べたら難しいですが、最近はjQueryというJavaScriptのライブラリ(ツールセットみたいなもの)があるので、見た目だけなら割と簡単にできます。

以上3つがWebサイトの基本です。
例外として、フルFLASHサイト(全てFLASHで作ったサイト)がありますが、そのFLASHのコードもHTMLに書き込みます。

必要なソフト

ソフトについてですが「プログラミングのためのソフトがないとできません!」なんてことはなく、パソコンに標準で付いているものだけで作ることもできます。(例えば、メモ帳で作れます。)フリーのツールもとても充実しているので、本当に作り込んだサイトでもない限りツールのためにお金が飛んでいくことはないと思います。逆に、プロでも人によってはシンプルなエディタで書いている人もいます。

ただし、アイコン等を作る場合は画像編集ソフト、またはイラストソフト等が必要なります。プロの人はこっちの方がお金かかってますね。この辺はWebで素材を拾ってくることもできます。画像を作りたい方は2DCGの方を参考にしてみてください。

サーバーについて

HTML等、サイトに必要なものが作り終わったらサーバーというものにアップロードする必要があります。 Webサイトはネットワーク上に存在するコンピュータからデータをダウンロードすることで見ることができています。このコンピュータがサーバーです。

自分のパソコンをサーバー化することもできますが、専門的な知識が必要なのに加え、稼働し始めてもずっと動かしっぱなしにしとかないと、電源を切っているときは他の人が見れません。

こんなことは現実的ではないので、レンタルサーバーというものを使います。 これは簡単に言うと、サーバーのある容量分だけを貸してくれるサービスです。サーバーのメンテナンスとか運用とかは向こうでやってくれるので、こっちは作ったものをアップロードするだけでWebサイトを公開することができます。

色々なレンタルサーバーがあり、個人向けのものから企業向けのものまであります。 個人的にオススメするのは初心者ならロリポップかと思います。

というのも、このサービスは格安な値段から始められるからです。 安いからと言って機能が貧弱かというとそうではなく、初心者に必要なものがそろってます。 月額105円で十分すぎるくらいの機能がもらえます。

上に書いたCMSを使用するにはMySQLというデータベースが必要になるので、ロリポプランというランクが一個上のプランにしなければなりませんが、それでも大した値段ではないです。インストールはロリポップで自動でやってくれるので、多数サイトを作る時には重宝しています。

途中からプランを変えることでスペックアップさせることもできるので、あとからスペックを上げていくこともできます。私の場合は、コロリポから初めて、ロリポプランに変えました。

あとは、単純な考えですが、沢山の人が使っている実績があるという安心感ですかね。

企業用のサイトや動画をGBサイズで何個も乗っけるとかいうなら話は別ですが、まず普通なら1GB使うだけでも相当なコンテンツ量が必要なので、個人用や小さいサイトとしては適しているかと思います。

フリーのサーバーもありますが、広告などが出てしまうことや、あとあとの事を考えると有料のものを使うメリットが色々とあります。例えば、フリーの場合はそのサービス自体がサービスをやめることになってもタダなので文句は言えません。サーバーを後で変えるとなると非常に面倒なことが色々と発生します。

他にもレンタルサーバーは色々とあるので、調べてみてください。

サーバーにアップすれば、あとは世界のインターネットどこからでも見ることができます。 サーバーにアップした時点で公開状態になると思っていてもいいかもしれません。 スマートフォン用や携帯用も作ろうと思えば作れるので、是非色々試してみてください。

PAGE TOP

Twitter

    人気記事

    新着まとめ