現在、在宅でできる副業としてホームページ制作に関するものが多くあり、人気です。
ホームページを作ると言っても一体何を作るのか、何から手を付ければ良いのか、初めての人には難しく感じるかも知れません。
そこで、ホームページを作るってどう言うことなのか、どういう作業が必要なのか、ホームページ制作の流れから説明し、なるべく短期間で必要なことだけ勉強してホームページ制作をマスターする方法を紹介したいと思います。
ホームページ制作の流れ
まずはホームページ制作の流れを簡単に説明します。
通常、ホームページを制作する場合の流れはこんな感じです。
- 全体のコンセプト、構成、デザインを考える
- HTML、CSSファイル、画像、動画等を制作する
- 制作したファイルをWEBサーバーにアップロードする
- ブラウザから動作確認する
- 完成後、運営
制作中のファイルをその都度WEBサーバーにアップロードし、動作確認しながら制作する方法もありますし、全てを同時進行でやる方法もあります。
制作をいくつかこなせば自分のやりやすい方法が見つかると思います。
それでは、それぞれの工程について簡単に説明します。
コンセプト、構成、デザインの考え方
他人から依頼を受けてホームページを制作する場合、コンセプト、ページ内容、メニュー、デザインの方向性について打ち合わせを重ね、イメージを固めてから制作に入る必要があります。
自分で勉強や練習のために制作する場合、コンセプトや構成、デザインに関しておおまかに考え、作りながら変更して行く感じでも大丈夫です。
とは言え、最初にイメージを細部まで固めておくのとおかないのでは制作のスピードが変わって来ます。
ある程度イメージを固めてから制作に入る方が結果的に早く仕上がります。
それでは、コンセプト、構成、デザインの考え方のついて紹介します。
コンセプト、構成について
何のためにホームページを制作するのか、そのためにはどんなページが必要なのかをまず考えます。
例えば、ある商品を販売するためのホームページを制作する場合、ホームページを作る目的は『閲覧者に商品を購入してもらうこと』になります。
そのためには、閲覧者に商品の詳細、良さを知ってもらうための『商品の詳細ページ』、購入してもらうための『ショッピングカート』が最低限必要になって来ます。
怪しいホームページからは商品を購入してもらえないので、誰がこの商品を紹介、販売しているのかを閲覧者に知ってもらうために、『会社紹介、会社概要』のようなページも必要になります。
商品に関する質問、販売者に関する質問等も受け付けられるように『お問い合わせフォーム』も必要になります。
HTML、CSSについては後で説明しますが、通常、ホームページはHTML、CSSと言う言語を使って制作します。
この段階で『ショッピングカート』、『お問い合わせフォーム』が必要だと言うことは、HTML、CSSの他に『PHP』、『Javascript』も必要かな？と大体で良いので考えておきます。
『PHP』、『Javascript』については別で詳しく説明しますが、そういう感じでコンセプトからメニュー、ページの構成まで考えます。
デザインについて
コンセプト、ページ構成を考えたら次はデザインを考えます。
閲覧者がページを開き、ページ内容まで見るかどうかはほぼデザインで判断されます。
デザインと言うのはそれほど重要なものではありますが、追求し出したらキリがありませんし、
よほどのアーティストでもない限り既成概念を壊すような斬新なページは作れないと考えて割り切ることが大事です。
普段色々なホームページを見ていればわかると思いますが、大抵のウェブサイトはフォーマットが決まっています。
閲覧者にとってもある程度フォーマットにのっとったページの方がメニュー、ページ構成を把握しやすく、見やすさに繋がるので、デザインに関してはフォーマットにのっとった中で少しのオリジナリティを出せれば充分です。
そう言ったデザインをスピーディーに出していくために、普段から色々なページを見て現在主流のページ構成、メニュー配置、カラー等を常に意識してなんとなく頭に入れておくことが重要です。
ホームページの制作方法（HTMLとCSSについて）
パソコンでホームページを見ている時にどこでも良いので右クリックして『ソースを表示』を選択してみてください。
なんだかわからない文字がびっしり書かれたページが表示されます。
それがホームページの正体です。
びっしり書かれた文字は主に『HTML』と言う言語です。
「ここにこういう文字を書いてこういう画像を表示して」と言うことをChrome、Safari、Edge等のブラウザに指示するのが主に『HTML』と言う言語の役割です。
『HTML』だけでもホームページは作れますが、それを『CSS（スタイルシート）』と言う言語で装飾します。
『CSS』にホームページ全体の形やフォント、文字の色、背景等をまとめて書き、それを『HTML』ファイルから読み込むことで、普段見ているような綺麗なホームページを作ることが出来ます。
次に、それらのファイルを制作する方法をいくつか紹介します。
ホームページ作成ソフトを使う
ホームページ作成ソフトを使えば、HTML、CSSの知識がなくてもホームページを作ることができます。
ワードで文書を作る感覚で本格的なホームページが作れるので、ワードを使って文書を作ったことがある人ならそれほど苦も無くスムーズにホームページを作ることが出来ます。
いくつかホームページ作成ソフトを紹介します。
・ホームページビルダー
1994年から発売されているホームページ制作ソフトです。
ホームページ制作に興味がある人なら一度は聞いたことがあると言うほどポピュラーなソフトです。
バージョンアップを重ね、現在は機能、UIも洗練され、スマホ対応のページでもショッピング用のページでも何でも手軽に作ることが出来るようになっています。
初心者でも比較的簡単に使いこなせるので初心者の人におすすめです。
価格はパッケージ版が14,100円～、ダウンロード版は11,800円～になります。
・Dreamweaver（ドリームウィーバー）
こちらも歴史が古く、1997年から発売されています。
ホームページビルダーと同じくらい知名度があるポピュラーなソフトです。
ホームページビルダーと比較すると機能も多く、使いこなすのは少し難しいかも知れません。
HTML、CSSの知識がなくてもページ制作はできますが、あれば更に本格的なページを制作することができ、プロのWEBデザイナーも使用しています。
手打ちでHTML、CSSを書く
HTML、CSSをテキストエディタに自分で書いていくことを『手打ち』と言います。
手打ちでホームページを制作するには、HTML、CSSに関してかなりの知識が必要になります。
自分でホームページを作って楽しんだり、制作に関して細かい注文がない場合、上に挙げたソフトを使った制作で充分ですが、ホームページ制作に関する職業につきたい場合や副業としてホームページに関する仕事をしたい場合は最低限手打ちでホームページが作れる程度の技術がないと通用しません。
今後、このサイトではHTML、CSSやその他ホームページ制作に必要な技術を短期間で習得するための独学方法について説明していきます。
今の段階では『HTMLやCSSと言うファイルを作ってホームページを制作する』とだけ頭に入れておいてください。
制作したファイルをウェブサーバーにアップロードする
制作したファイルはウェブサーバーにアップロードすることでPCやスマホを使って世界中の人が閲覧できるようになります。
ファイルをウェブサーバーにアップロードするには、『FTPソフト』と言うソフトを使用します。
ホームページ作成ソフトを使う場合、大抵ソフトの中にFTPソフトが組み込まれているのでそれを使用します。
手打ちでファイルを作ってアップする場合は、『FFFTP』と言うソフトがわかりやすくておすすめです。
アップロード後について
ホームページは、ファイルを制作してウェブサーバーにアップロードすれば完成、完了と言うわけにはいきません。
たくさんの人に見てもらうのが目的なので、アップロード後は自分のホームページが何人の人に見てもらっているのか確認し、どうすればたくさんの人に見てもらえるのか常に工夫していきます。
そのために『アクセス解析』を利用して閲覧者の動向をチェックし、改良しながらホームページを運営していきます。
まとめ
短期間の独学でホームページ制作が出来るようになるために、まずは全体の流れを知ることが重要です。
流れを知った上でそれぞれの工程に関して必要な部分を細かく勉強します。
今後、HTMLやCSS、デザインについてやJavascript、PHP等、必要な言語を短期間で効率良く使えるようになる方法を紹介していきます。
コメント