【初心者でもできる】Webサイトの作り方
webサイトを作るのは大変だと思われがちですが初心者でも作ることは簡単だと思いますし、無料でも作ることができるので是非作ってみてください。
サイトの作り方
Webサイトを作る時に必要なものは大きく分けて以下の3つになります。
- ドメイン
- サーバー
- コンテンツ
ざっくりとそれぞれを紹介すると、ドメインが住所的なものでこのサイトではcococo-web.comにあたります
サーバーは土地的なものです。これがないとインターネット上に情報を公開することができません。
最後にコンテンツですが、これはサイト内容です。
サイト内容はhtml,cssなどのプログラミングの知識があれば自分で書いて作れます。もし知識がなくてもWordPressをいうシステムを使ってプロが作ったサイトを簡単に使えます。
ドメイン
ドメインとは、サイトを作る時にリンクとして必要になります。
リンクに必要と考えればドメインがよく住所と言われていることが理解できると思います。
アイスで有名のハーゲンダッツでは「haagen-dazs.co.jp」、牛丼でお馴染みの吉野家では「yoshinoya.com」、日本郵便やゆうちょ銀行がある日本郵政「japanpost.jp」がそれぞれのドメインになっています。
ドメインはそのサイトだとわかる名前の後にある「.co.jp」「.com」「.jp」などを決まった中から選びます。
今回紹介するドメイン購入サイト「ムームードメイン」で購入する時、よく利用されるドメインの費用は以下のようになります。
| ドメイン | 取得(円) | 更新(円) |
|---|---|---|
| .com | 750 | 1,728 |
| .net | 750 | 1,728 |
| .org | 1285 | 1,848 |
| .info | 366 | 2,029 |
| .co.jp | 1,980 | 4,378 |
| .jp | 2,035 | 3,344 |
取得が購入から1年間使うのに必要な費用で、更新が利用期間を一年増やすのに払う費用です。
そのため長く使うなら更新日もしっかりと確認しておきましょう。
ドメインの種類はどれがいいのか
.comや.jpなどで変わることは見る人の印象だけです。
自分のサイトにあった好きなものの内、価格が安いものを選べばいいと思います。
ムームードメインを利用するのであれば「.com」が総合的におすすめで、1年使い捨てなら「.site」が取得費53円なのでおすすめです。
ドメイン取得サイト
ドメイン取得サイトでおすすめできるのは以下の３つになります。
軽くそれぞれのメリットデメリットを紹介します。
ムームードメインは値段がこの中だと少し高いが、サーバー(ロリポップ)の特定のセット契約で無料になる。
お名前.comは値段が安いが、広告メールがめちゃくちゃ送られてくる。
Xserverドメインはレンタルサーバーと契約する時に、無料でドメインをもらえるが別のサーバーに移管することができない。
ドメイン取得サイトと、サーバーは基本的にセットで契約するため、サーバーも含めた総合判断でムームードメインを今回は紹介します。
ムームードメイン
それではムームードメインでドメインを取得します。
登録
ムームードメインのHPの上部にあるログイン、新規登録の順にクリックした後手順に従って登録を完了させましょう。
使い方
HP上部のドメイン取得をクリックした後に、欲しいドメインに欲しいドメイン名を入力してください。
既に他の人が持っているドメインは取得することができないので、カートに入れれるもので好きなドメインをカートに追加から申し込みします。
購入する時にDNSをどうするか聞かれると思いますが、デフォルトのムームーDNSで大丈夫です。
これでドメインの取得は終了です。
サーバー
サーバーは自前のパソコンを利用して作ることも可能ですが、障害もなく常に稼働し続けるのは難しいのでレンタルサーバーを借りましょう。
ムームードメインでドメインを取得した人は運営が同じであるロリポップサーバーを推奨されます。
ロリポップ
登録
ロリポップのHPから10日間無料お試しをクリックして、お試しを利用するプランを選びます。
お試し中であれば好きなプランに変更できるので好きなプランでお試しして大丈夫です。
契約する時に以下のような初期ドメインと、パスワードを作りますが、ログインする時に必要なので初期ドメインを忘れないようにしましょう。
登録が終了したらいよいよドメインを設定して自身のサイトを作っていきます。
使い方
登録で初期ドメインとパスワードが確定したら、HP上部のログイン、ユーザー専用ページをクリックします。
ここで初期ドメインとパスワードを入力しますが、初期ドメインの.の後も正しいように選択してください。
ユーザー専用ページに移動できたら左上の独自ドメイン設定をクリックします。
次に独自ドメイン設定のボタンをクリイックします
ムームードメインで取得したドメインを独自ドメインに、.の後が無いドメインを公開フォルダに入力します
その後に取得したムームードメインのアカウント情報を入力すれば独自ドメインをサーバーで利用できるようになります。
これで取得したドメインにサイトの情報を載せれるようになりました。
コンテンツ
サイトのコンテンツについて作り方は以下の三つに分かれます。
- プログラムを書いて0から作る。
- WordPressを利用して作る。
- プログラムとWordPressの両方を利用して作る。
プログラムでを書く場合html,css,JavaScriptのようなWeb系のプログラミング言語を利用します。
これらの言語を利用してサイトの枠組み、内容、デザイン、レスポンシブ対応などを全て自分で作ります。
WordPressを利用する場合、プログラミングの知識がなくても簡単にサイトを作ることができます。
今回は軽くそれぞれのやり方で公開する方法を紹介します。
htmlファイルをアップロードする
まずはそれぞれのOSに初めからあるテキストエディタでいいのでindex.htmlというを作りましょう。
内容はpタグで囲んですきな文字でも入れましょう。
保存するときはフォーマットをhtml、名前をindexにして、すぐに取り出せる場所に保存しましょう
ロリポップのユーザー専用ページに移動して、サーバーの管理設定のところにある「ロリポップ!FTP」をクリックしてください。
取得した独自ドメインがあると思うので、その独自ドメインのフォルダをクリックしてください。
左上にあるアップロードを選んで先ほど作ったindex.htmlのファイルをドラック&ドロップしてください。
これでFTPが完了したので自身のurlに飛ぶと、pタグの中身が書いてあります。
WordPressのインストール
まずはWordPressを使えるようにロリポップのユーザ専用ページから、サイト制作ツールのWordPress簡単インストールに移動してください。
WordPressを利用したい独自ドメインを選択して、テーマをCocoonにしてください。
インストールが完了するとサイトURLと管理者ページURLがわかるようになります。
管理者ページURLがサイトの情報を書く場所で、サイトURLがWordPressを利用したサイトのURLになります。
サイトURLに飛ぶとサイトらしい枠組みができていると思います。
管理者ページURLで自身の思うサイトに仕上げましょう。
まとめ
無料でもレンタルサーバーと任意ではない独自ドメインを借りることはできます。
しかしアップロードできる量が少なかったり、phpが利用できなかったりします。
少しだけWebに触ってみたい方は無料でも大丈夫だと思いますが、商業的なサイトを作るときは有料のサーバーを選びましょう。