自分専用のホームページ作成に必要な費用とスキル【最短１ヶ月】

個人でお菓子や絵画などのお教室をはじめたい〜！

そういった時に必須なのが自分専用のホームページ

また、小学校のプログラミング必修化に伴い今のうちに学んでおけば、

子供に教えることもでき一石二鳥。

コロナで家も出れない事ですし、

自宅にいる時間を活用し自分専用のホームページを作ってみてはいかがでしょうか？

自分専用のホームページ作成に必要な費用とスキル

まず主にサイト作成のために必要な知識がこちらになります。

プログラミング(コード)の知識

HTMLとは・・サイト上の文章の骨組み

CSSとは・・それを装飾、デザインする役割

レスポンシブデザイン(メディアクエリ)・・PC、タブレット、スマホと端末によって調整するデザイン

です。

実際に使用した教材はこちら

HTML,CSSを勉強すると以下の事ができるようになります。

→WEBサイトの見た目をデザインできる

→ブログを書く時表示バグなどを直せる。

またHTML,CSS,レスポンシブデザイン(メディアクエリ)に学習を絞り1ヶ月しっかり勉強すれば出来るようになります。

マナブさんのロードマップに沿って学習を進めて行く中で、エディタ（sublimetext）を使用しますが、

パソコンが得意でない私のような方は最初に導入の仕方などでさっそく最初の壁に当たります。苦笑

そんな困った時に心強いサイトをご紹介。

学習の参考になるサイト

といっても初期の頃の疑問は、ほぼサルワカで解決しました。

何か分からない事が出てきたらまずはサルワカで調べて見てください。

１ヶ月で【自分のホームページ制作】できると言いましたが、

１から全て、コードを書いてとなるとやはりまだ厳しいです。

なので、ここで私がオススメする方法は１ヶ月×毎日２時間、HTMLとCSSを学習したのち、

ワードプレスで有料テーマを導入し、固定ページや外観をカスタマイズする方法です。

これならコードをほぼ触ることなくサイトを作成する事ができます。

自分専用のホームページ作成に必要な費用 ワードプレスの場合

このサイトのようなブログ付きの、

更新が簡単に出来るサイトを作りたい場合、

かかる初期費用はだいたい３万円程です。

レンタルサーバーの土地代(エックスサーバー）のみ、毎年継続して支払う必要があります。

またキャンペーンがない場合は別途でドメイン代年間”1000円”程かかってきますので、今がお得です。

今回私はブログもやっていきたかったので、ブログに特化したアフィンガーにしましたが他にも有料テーマの種類はいろいろあります。

個人的にすごく素敵だな〜！！と思うのが、

LOTUSという有料テーマで値段は約1万3000円です。

サロンのように洗練されたホームページ制作をしたい方にオススメです。

１ヶ月で自分専用のホームページを作る方法

実際にこのブログのサイトは、

といった感じで作りました。

なのでほぼコードは書いていません！

ですが全くHTML・CSSが分からないと何かと不具合や表示バグで困るので勉強しておく方がいいです。

プロゲートなどを使い、最低限のHTMLとCSSの学習をしておくことをオススメします。

私が作ったサイトの細かい設定の補足

インスタグラム、地図などの埋め込み方法は

"インスタグラム 埋め込み ワードプレス"などでググって調べると出てきます。

ワードプレスは(WP)は利用者が多いのでグーグルで調べた時欲しい答えが出てきやすいのもオススメのポイントです。

うーん、固定ページやら投稿ページってちんぷんかんぷん

ワードプレスを触った事がなければ、分からなくて当たり前です！

イメージとしては、初めてスマートフォンを使いはじめた時のような操作感で使えるので、とにかく使って慣れようといった感じです。

※もちろんオリジナルテーマの作成などは専門の知識がいるのでプログラミング学習が必要となってきます。今回はあくまでも私が作ったようなシンプルなサイトのご紹介です。

なおホームページ制作の流れをまとめると、

といった感じで、ワードプレスのサイトを作りました。

分からない箇所は "WP SSL化設定"などでググるとそれぞれやり方は出てきます。

ここまで聞いて、でもサイトにそんなお金かけたくないな〜とお思いの方は無料で作ることも可能です。

自分専用のホームページを無料で作りたい場合、

これらのサイトでもプログラミング(コード)が分からなくても制作出来ます。

無料で自分専用のホームページができるサイト

ペライチは１ページのみのシンプルなペラサイトです。近年お教室のサイト制作などに人気です。

まず、学習時間も初期費用も削りたい方は上記のサイトで作ってみるのもありです！

ただなんども言いますがHTML・CSSが分からないと細かいデザインの設定や、表示バグが起こった際に困ることが多々あります。

また、無料の場合それなりにデメリットもあって、

などの点があります。

といっても高額なサーバー代などを浮かす事ができるので、

といった方にはとっても便利なサイトです。

また、Jimdoなどでとりあえず無料で作ってみて気に入ったら有料プランに切り替えてみるのもありです。

有料会員になると月々１０００円で広告非表示や、

ページ数の追加などなど出来ることも増えるみたいです。

もちろん無料のままで使っている方もたくさんいます！

その他のホームページ制作で使える便利なツール

実際によく使っているツールがこちらです。

Canvaはtwitterなどで投稿した時のアイキャッチ画像をつくるのに便利で、

実際に上記のようなテキストをつけた画像が作成できます。

アイキャッチ画像とは・名前の通りユーザーの目を引く画像です。投稿した際、サイトURLのみだとSNSではスクロールされてしまいスルーされがちです。

JPEG miniは画像の軽量化するのに使っています。

はじめ何も知らずに軽量化せずバンバン画像を取り込んでいたらサイトが重たくなって開くのに時間がかかるようになってしまいました。。

ユーザーの離脱にも繋がるので、しっかり画像は軽量化しましょう！

O-danは無料で素敵なフリー素材を見つける事ができるサイトです。

ホームページ作成の上で一番大事なこと

それは、ググる力です。

サイトのレイアウトで困った時、HTML/CSSなどのコードの勉強をするにしてもこの力があればほぼ解決できます。

プログラミングを勉強すると自然とこのググる力がつくのでオススメです。

自分が一体なにをしたいのかを明確化し、

目的に沿ったサイトを作ってみてください。〜！