ウェブサイトを作りたい!
けど、どれくらいのステップがあって、どれくらいのコストがかかるのかわからない。。。!
そんな人のためのサイトです。
以前、自分を発信すること(expressiveness)が増えると良い…と書きました。
(きになる人はまりっさのビジョンをcheck!)
ブログであれプロフィールであれ、自分(企業)のウェブサイトを作ることは、
「自分のブランドを見直し、他者に発信する」ひとつの形態だと思っています。
今回は、ウェブサイト作成してみたい、という人に向けて、ウェブサイト公開までのステップを、まとめてみました。
細かいステップは他の多くのサイトで手順解説があるので個別に検索していただきたいと思いますが、
完成までにどのような工程があり、どのくらいの手間がかかるのか、ざっくりお伝えできればと思います!
サイト構築の前に…
この記事の目次
0.どんなサイトを作成したいのか考える。
作成上の注意点の概略が書かれたサイト↓ https://whitehatseo.jp/point-is-careful-when-starting-web/
サイトを作ろう!と決めたら… <HP作成の準備>
1.サーバーを借りる
有名なものですと、Xサーバー、ロリポップサーバー、お名前.com などがありますが、どこの会社のものを借りるか決めます。
プロおすすめのレンタルサーバーの紹介サイト↓
http://wp-fun.com/howto/page-928/
2.ドメイン(独自のサイトURL)を取得する
・ドメイン会社の比較(お名前.com、ムームードメインなどの検討)
サーバーとの相性もあります。
取得料金と更新料金がありますので更新料金の確認もしてみてください!
ドメイン取得会社の比較のヒント↓
https://domain-comparison.com/
・ドメインの末尾の種類の選び方(.com、.co.jp、.org、.net などの決定)
ドメインの末尾でサイトの雰囲気・信用が変わります。
どんなどんな種類が適切か簡単に紹介しているサイトです↓
https://seotaisaku.co/seo/how-to-choose-own-domain
3.サーバーとドメインをつなげる
自分が1で借りたサーバーと、2で取得したドメインを結びつけます。
サーバーのログイン画面で接続を行いますが、「〇〇◯(サーバー名) ドメイン 結びつける/登録」などで検索すると、丁寧に解説してくれているサイトがたくさんあります。
https://goo.gl/vPDMr3 「公開アップロードフォルダ」のヒント(ロリポップの場合)
4.WordPressのアカウントを作る
WordPressは二種類(.com / .org )あります!
自分のオリジナルなカスタマイズを加えるサイトを作るならば.orgです。(サーバー、独自ドメイン必要なもの)
サーバーのログイン画面から繋げられることがほとんどなので、「◯〇〇ワードプレス作成」と検索してみてください。
参考までに、Wordpressの二種類についての解説しているサイトをご紹介します。https://wisdommingle.com/difference-between-wordpress-org-and-wordpress-com/
その設定の際に、Wordpressのアドレスでwww.をつけるか否かを選ぶ場面があります。迷ったら、こちらのサイトを参考に↓
https://satopedia.com/www/
ウェブサイトのコンテンツ作り
5.ウェブサイトの構成を考える
<テーマ決め>
テーマ設定にあたり、どんな目的を持ったウェブサイトを作成するのか決めます。
WordPressにおける「テーマ」とは、ウェブサイトのテンプレートのようなもので、無料で使えるものも多くあります(有料のものも、一般にインターネットからダウンロードできるものもあります)。
具体的には、おおよそ以下のような論点があります。
①「コードはあまり書きたくないから既存のテーマを使うのか?」「枠組みだけできているものに自分でヘッダーフッダーを埋め込んでいく(=ブランクテーマ)のか?」
②「ブログメイン(動的サイト)か?」「表示サイトメイン(静的サイト)か?」
③「何のページを作り、どういう階層にするのか?
(ホーム、会社概要、ブログ、お問い合わせetc…)」
ウェブサイトの作る目的にあわせたデザイン、構成、を選ぶことが大切です。
<コンテンツ>
会社のサイトか、個人のサイトかにもよりますが、以下のようなサイトや関連サイトも参考になればと思います。
・競合に負けないHPの作り方:https://nandemo-nobiru.com/web-3088
・ターゲットの絞り方:https://webkatu.jp/design/s1ep02-1/
・ウェブサイトのブランディングについて:https://webbu.jp/web-branding-2133
6.開発環境を設定する
開発環境とは、ウェブサイトを編集するページ(場所)のことです。
どのようなテーマを利用するのかによって様々ですが、気をつけること、しておいた方が良いことがあります。
①ウェブサイトのバックアップを取っておく
せっかく作成したサイトが、ある日突然接続できなくなった!データがなくなった!
コンピュータの世界では、こういった「説明できない事故」は避けられません。痛い思いをしないように、バックアップは定期的にとるようにしましょう。
バックアップの対応参考サイト:https://requlog.com/self-branding/wordpress/backup-all-in-auto/
②(ブランクテーマを選ばなかった人向け) 子テーマの作成
子テーマとは、wordpress内にあったテンプレートのコピーを取ること。
子テーマが必要な理由は、元のテンプレートが作成者によって更新されたり削除されても、自分のウェブサイトが崩れないようにするためです。
子テーマの作り方参考サイト:https://vseomedia.com/2017/03/wptheme-child-twentyseventeen/
③ローカルページを利用して編集する
他にも、wordpressでいきなり編集するのではなく、一旦別の場所で開発して、色々試行錯誤する場所を設定する方法もあります。
7.ロゴ・ファビコンなど作成
これは直接サイト作成には関係ありませんが、ウェブサイトで大切なロゴについても勉強が必要なので付け加えておきます。
ロゴは企業や個人事業のアイコンとなる画像のことです。
ファビコンとは、ブラウザ上のタブの小さい画像のことです。

これらの作成は、
・オンラインで無料で作れるもの
・500円程度の低価格から作成をオーダーできるもの
「ココなら」というスキルシェアのアプリがおすすめ!
→https://coconala.com/categories/351?ref=top_categories
・自分でAdobeなどを利用して作成する
などがあります。
…いかがでしょうか?
ざっくりと、どのような流れでウェブサイトを作成するのか、道筋がわかっていただけたかと思います。
少しウェブの知識がある方なら、これならできるかも!と思ったかもしれませんし、初心者の方は、「結構大変そう、、」という印象かもしれません。
最近は、いろんな方法を解説したウェブサイトがたくさんあります。何か詰まったら、”検索”をかけてみてください。
お力になれることはいたしますので、質問があればコメント欄に書いてみてください!(答えられなかったらごめんなさいね)
ではではEnjoy making your personal website! 😀