ホームページを作りたい方は今の世の中たくさんいらっしゃることでしょう。
コロナウィルスによるステイホームの時代です。家にいながらできることをしたいとお考えかもしれません。時間さえあればコツコツと作ることができるので、今の時代に合っているのではないでしょうか。
さて、このページではあなたのホームページ制作のスタートをスムーズにするための、まとめ情報を提供します。限りなく簡単に説明しますので、一読いただければきっと役に立つことでしょう。
目次
1.手書きで一から作る
2.CSSフレームワークを使って作る
3.Webサービスを使って作る
4.ホームページ作成ソフトを使って作る
5.まとめ
1.手書きで一から作る
手書きでホームページを作るには、HTMLとCSSという言語を覚える必要があります。この言語のことを専門的にマークアップ言語と言うのですが、さほど難しくはありません。
単に「こう書けばこうなる」の繰り返しで覚えていけます。基本的に単純な仕組みになっています。
HTMLはホームページの骨格の部分を表現するもので、Googleなどの検索エンジンはHTMLを解釈して検索結果に表示してくれます。
そして、CSSは別名スタイルシートといい骨格部分のHTMLにデザインを加える言語です。
HTMLとCSSを覚えるにはコツコツと3ヶ月くらい取り組むことが必要です。一から覚えることで、目次2のようなテンプレートを使った場合でも改造したりできます。
では、どのように学習を進めていくかについてお話ししましょう。
まず、数冊の本を購入しやってみることです。これでかなりの力がつきます。
ただ一つ気をつけて欲しいことは、ネットの情報では古かったり、まとまっていなかったりして体型的に理解できないことです。HTMLもCSSもどんどん新しくなっていっています。ですので本で学んだ方が効率は良くなります。
一番初めに読むべき本は「【Amazon.co.jp 限定】 1冊ですべて身につくHTML & CSSとWebデザイン入門講座 (DL特典: CSS Flexbox チートシート)」がおすすめです。サンプルサイトの完成まで一連の流れの中でホームページ制作に必要なことが俯瞰でき、合わせて技術も身につきます。
2.CSSフレームワークを使って作る
ある程度HTMLとCSSがわかってきたら、CSSを自分でバグなく書くのは面倒になるかもしれません。そんなときに役立つのが、CSSフレームワークです。
CSSフレームワークというのは、作り手が使うであろうデザインをあらかじめ作ってくれているものです。ですのでフレームワークのルールに沿ってHTMLを書くことでホームページができてしまいます。
ちなみに私は「BootStrap」というフレームワークを利用して普段からホームページ制作をしています。HTMLにはクラス(class=”~”)という記述方法があり、クラスに決まった文字を入れることでCSSがHTMLに反映され、デザインが完成します。
すごく簡単にできるのですが、ある程度の基本がわからないとうまく使えないので、まずは手書きができるまでやって見ることをおすすめします。「千里の道も一歩から」という心持ちで取り組むといいと思います。
BootStrapを使う場合は、こちらの一冊で作れます。
「Bootstrap 4 フロントエンド開発の教科書」
公式サイト:Bootstrap4
さらに必要なツール
「Brackets」アドビが開発している無料のテキストエディタです。ホームページを作成する目的ならこのエディタが一番です。
また、問い合わせフォームが必要なら、無料のフォームサービスを埋め込むことで何とかなります。
そして、出来上がったホームページは、レンタルサーバーにアップロードすると公開できます。
3.Webサービスを使って作る
最も手軽な方法ですが、バックアップや移設ができないものがほとんどです。サービスに依存してしまうのがリスクですが、何のために使うかはあなたの判断次第です。様々なサービスがありますので、無料で試してみて気に入ったものを使えばいいでしょう。
Jimdo
Wix
Webnode
ホームページ作成ツール一覧をご覧ください。
4.ホームページ作成ソフトを使って作る
今ほとんどのホームページ作成ソフトは高額ですし複雑な機能があり使いこなすまで時間がかかりますが、結構いいものはできると思います。ソフトのメリットはソフトが生成したファイルを保存して置けることです。
ただし、ソフト自体に何らかの不具合が生じ、内部のデータが壊れ今まで制作したものが失われるリスクがあります。そうなったらもう一度作るのはかなり大変です。PC自体のバックアップを取るか、復元機能のあるソフトを選べばいいでしょう。
SIRIUSは、SIRIUS内のデータのバックアップ機能があります。
まとめ
ホームページを自作するには、4つの方法がありそれぞれに良し悪しがありますが、あなたの目的に合わせて選ぶしかありません。私は自分で作ることが好きなのでHTML/CSSを勉強しました。
ECショップなどのネットショップやコメントの受付などの機能が必要な場合はWebサービスを使うか、ウェブアプリケーションの作り方を勉強することになります。もしくはWordPressなどになりますが、結構難しいのでどこまでやりたいかも考えた上で、どの自作方法がいいかを決めることが大切です。