無料のホームページ作成ツールを14個も!もう制作会社を頼らない。

制作会社を頼らずホームページを自分で作れるツール

ごめんなさい! いきなりの自己PRですが緊急なのでお許しを。
あまりに好評でずっと売切れ状態が続いていましたが、やっと再開のめどがつきました。
わたくしウェブさえがあなたのホームページを作ります。
売り切れ前にこちらをクリック!

はい! 自己PRは以上で終わり、本記事の始まりです。

「ホームページを無料で作成する」ー 前回の更新からかなり経ちましたが、テーマは同じでございます。

ホームページの作成に役立つおすすめの無料ツールを集めました。ぜんぶ無料で気軽に試せます。制作会社を頼る必要はございません。初心者さんもご遠慮なく、ぜひホームページ作成にチャレンジしてみてください! (スマホサイト、もしくはネットショップを作りたい人は以下のリンク先で特集してます)

ホームページ作成にお役立ちのツール14個

まずはWebサイトビルダー8個から!

最近、ホームページ作成のための「Webサイトビルダー」が熱いんです!

Webサイトビルダーとは、簡単な操作でホームページを作れるツールです。今回は特に無料でブラウザから使えるものだけを紹介します。

ブラウザとは、普段ホームページを閲覧するのに使っているアプリのことですね。Windowsなら「インターネットエクスプローラー」、Macなら「Safari」が標準でインストールされています。機能が豊富で
動作が軽い、Googleが提供するChromeを利用している人も多いでしょう。

インターネットとブラウザさえあれば、特別なソフトを揃える必要はありません。だれでも簡単にホームページの作成を楽しめます。

注意。「ホームページビルダー」といってもいいのですが、あの有名ソフトと混乱しないように本記事では「Webサイトビルダー」と呼びます。

これは、今回紹介するウェブサイトビルダーのうちの一つ、「IM-Creator」です。どんなふうにホームページを作っていけるのか、60秒のビデオにまとめられています。

最初に用意されたテンプレートからデザインを選んだあと、ドラッグ&ドロップと簡単なキーボード入力で完成に近づけていきます。だいたい共通してどのWebサイトビルダーもこの流れでホームページの作成を進められます。

Webサイトビルダーの歴史は古く、昔から色々ありました。でも、操作性がイマイチでした。選べるテンプレートにも不満が。種類は少なく、ダサくて、人前に出せるクオリティは望めませんでした。それがいつのまにか、こんなに進化していたのですね!

技術的なハードルはほぼ地べたくらいに下がりました。HTMLやCSSのような専門スキルは不要です。素人に近い初心者さんでも、会社や店舗など、クオリティ重視のビジネス用ホームページもじゅうぶん目指せることに驚きました。

というわけで、今回、色々なWebサイトビルダーを触ってみました。その中からいくつか操作性とデザインの両方で「イイネ!」と思ったオススメのものを紹介します。

1.一番人気のホームページ作成サービス! WIX

wix

本記事、一番のおすすめ。本当に簡単に高品質のホームページを作成できます。

悔しいことに、優れたウェブサイトビルダーの多くは外国産です(頑張れニッポン!)。WIXはイスラエル発のサービスですが、完全に日本語に対応しているところが嬉しいです。日本語で文字を入力できるのはもちろん、管理画面も日本語で見られます。作成を進めるにあたって、言語の違いによるストレスはありません。

デザインは種類豊富なテンプレートから選べます。一般企業、レストラン、個人事業、ポートフォリオなど、業種や目的別にカテゴリーで分類されているので、自分好みのものを見つけやすくて助かります。

機能の拡張性も最高です。オンラインで商品を販売できるショッピングカートの機能や、更新を簡単にできるブログなどを追加できます。最近はオンラインの予約システムも増えました。どんどん新しい機能が発表されるのは、ワクワクしますね。開発側が常に改良へ挑んでいる証拠です。

ユーザーサポートも親切です。WIXを使いこなすためのマニュアルがあります。それだけでなく、ブログで積極的に役立つ情報を配信しています。ホームページへの集客ノウハウ、デザインをおしゃれに見せるテクニックなど、読み応えの多い記事ばかりで勉強になります。

さすが人気ナンバーワンのWebサイトビルダーですね。色々なデザインを選べて、機能も盛りだくさん、おまけに優しいサポートもついてくる。今回が初めてのホームページという初心者さんから、高機能なウェブサイトを求める上級者まで満足できるサービスだと思います。

WIXでのホームページの作り方

サンプルとして、実際にWIXでホームページを作成してみましたよ。作成の流れを追ってみます。

1. ホームページのデザインはテンプレートから選びます

こちらからユーザー登録を済ませれば、すぐにテンプレートを選べます。テンプレートはカテゴリーに分かれているので、すぐに目的のテンプレートを見つけられます。

今回はレストランのテンプレートを選んでみました。

レストラン

2. ブラウザでテンプレートを編集

ブラウザで編集している様子

テンプレートを選択後、そのままブラウザで直接デザインを編集できます。上のように文字を打ち込んだり、

こんなふうに画像を差し替えたりを、目で見ながら簡単にできます。

画像を差し替えている様子

3. 公開もワンクリック

公開も簡単

好きなだけ編集を楽しんだあとは、「公開」ボタンをクリックするだけ。すぐにホームページを一般に向けて公開できます。なんて簡単なの!

WIXはこちら

2. おしゃれなあなたは「IM-Creator」

IM-Creator

次は冒頭のムービーで紹介した「IM-Creator」です。

「IM-Creator」でも、実際にひとつホームページを作ってみました。これです。奇抜な色使いで目がチカチカ~、開いた途端に閉じてしまうかも(笑)。

これはテンプレートから選んだデザインをほぼそのまま使いました。ここにIM-Creatorの特色があります。IM-Creatorは、他のWebサイトビルダーとはちょっと毛色が違う、奇抜でオシャレなテンプレートがそろっています。名称通りに、特にクリエイターやアーティストな方々にマッチするサービスだと思います。

ホームページ作成の流れ(IM-Creator版)

今回作ったサンプルを例に、「IM-Creator」を使ったホームページの作り方を振り返ってみます。

まずはテンプレートを選びます。
テンプレートを選択

ユーザー登録をすれば、すぐにデザインをテンプレートから選べます。気に入ったテンプレートを見つけたら、そこからホームページの作成が始まります。

文章を差し替え
文章を差し替え

テンプレートにすでに書き込まれたテキストを自分用に差し替えていきます。

写真の編集や差し替えも簡単
写真の編集と差し替え

テキストだけでなく、写真もドラッグ&ドロップのマウス操作だけで差し替えられます。

ユーチューブの動画も貼付けたりして
ユーチューブ

動画を貼り付けるのも簡単です。

SNSのシェアボタンはそれぞれの配布先からソースを貼り付けるだけ
SNSと連動

facebookやTwitterの口コミ効果を期待してのものです。

アクセス解析(Googleアナリティクス)のセットアップも簡単。IDを入力するだけです。
Googleアナリティクスも簡単

ホームページへのアクセスを集計し、のちのアクセスアップへ役立てます。

他にも色々と。とにかくページ上に表示したい画像をドラッグ&ドロップで置いていくだけでホームページの作成を進められます。
ドラッグドロップ!
ここまで1時間くらいかな?で完成です。初心者でも簡単です! クリエイターのポートフォリオにも向いてるかもです。

3.これも日本語対応 Jimdo

Jimdoも日本で人気のウェブサイトビルダーです。日本語に完全対応しています。使い始めの登録から作成画面、アカウントの管理やサポートまで全部日本語が通じます。

スマホからデザインできるアプリも出てますよ。場所を選ばずベッドに転がりながらでもホームページを作成できます。

4.海外のお客様を狙いたいならEdicy

Voogという新しい名称でリニューアルしたみたいです。Voogが優れているのは、マルチ言語のホームページを作成できるところです。日本語以外に英語や中国語など複数の言語を利用した多言語サイトを作れます。

作成時の操作性はピカイチでした。試したなかでダントツの使いやすさでした。動作が軽く、キーボードショートカットも用意されています。PCにインストールされたソフトと同感覚で作業を進められるので、没頭しやすいです。

5.オサレ!スマホサイトならスムーズなStrinkingly

strikingly

スゴく洗練されております。無駄なものがありません。デザインにもそれが現れてます。テンプレートはすっきり見やすくシンプルです。色々と詰め込んでないところが、実はかなり好みでした。

管理画面の見栄えも良くて、わかりやすく、完成まで迷わず進められます。

最近はスマホ対応の重要性が叫ばれていますね。Strinkinglyは特にモバイル用のサイトと相性が良いので、いま急いでスマホ対応のホームページが欲しいという人におすすめです。

6.グラフィックデザイナー向けのWebydo

Webydoは、グラッフィクデザイナー向けといえるホームページ作成サービスです。

テンプレートが用意されているわけではなく、フォトショップやイラストレーターで先にデザインしたものをベースに作成を進めます。最終的にデザインを人工知能でコーディングしてくれます。デザインは得意だけどコーディングは苦手いう人は使ってみてはいかがでしょうか。

7.Webnode

これも日本語対応しますよ。ここまでいろんなツールを試用すると、正直、もうどれでもいいんじゃないかという気になってきます。それくらい全て操作性に優れ、クオリティの高いホームページを作れるからです。

どうせ無料です。とりあえず全部試してみるというのもいいんじゃないかな。相性もあるので、触ってみて気持ち良いものに決めればいいと思います。

8.ネットショップ作成ならBASE

BASEは、今までのWebサイトビルダーと異なり、ネットショップを専門にしています。(今までのでもネットショップを作れることは作れますが)

初期費用も月額にかかるお金も不要です。3分程度の登録作業でネット上にお店をオープンできます。今までのWebサイトビルダーと同じテンプレート方式でショップのデザインを決められます。商品の登録や顧客管理も簡単にできてクレジットカードの決済システムも利用できます。無料だなんて信じられません。

ネットショップを無料で作成できるサービスは下記でも特集してますよ!

(再び)ホームページ作成の流れ

っと、ここまでホームページのデザイン~公開までを担当してくれるWebサイトビルダーについて紹介してきました。実はこれ以外にもホームページを自分で作成する場合は色々と必要な作業があります。

ホームページ作成の流れ

これは一般的なホームページ作成の流れです。

作り上げるホームページの規模や制作を進めるチームの編成などによって、前後・削除される工程はありますが、おおまかにはこんな感じに落ち着きます。

それぞれの工程を手短に説明すると

企画
企画

ホームページ作りは、まず企画から始まります。

作り始めの第一歩として、色々とアイデアを出し、どんなホームページにしたいか計画を立てます。誰に見てもらいたいのか、どんな内容にしたいのか、ページ数、デザインの方向性、完成後のホームページへどうやって集客するか、最近ではfacebookやtwitterなどSNSとの連動方法も重要な検討事項の一つになってきてますね。

企画を進める方法は千差万別、企画者の癖やスキルによって、またプロジェクトの色によって様々です。ウェブさえでは、企画の方法について、色々と掘り下げて記事にしていきたいと思ってますし、過去にもいくつか書いてますよ。

サイトマップ
サイトマップ

サイトマップは、ホームページ全体の構成図です。

企画で明らかした必要なページをトップページを頂上にして配置していきます。このとき気をつけたいのは、訪問者がどのようにホームページ内を巡るのか(これを導線という)を意識することです。

常にトップページがお客さんにとって入口ページになるとは限りません。どのページから入ってきても、一番見てもらいたいページへ到着できる配置を考えることが重要です。

ワイヤーフレーム
サイトマップ

ワイヤーフレームはページ単位の設計図です。ページ上に、文章や写真など、なにをどこに配置していくのかを図にします。

今回のようなWebサイトビルダーを使う場合は、選ぶテンプレートに合わせて配置を決めていくことになります。差し替える文章や写真を検討し、テンプレートのデザインを活かしながら、ページ上で言いたいことが閲覧者に伝わりやすい配置を考えます。

原稿作り
ワイヤーフレームが決まれば、その配置図に従って、掲載する文章や画像を原稿として用意してデザインに着手します。ウェブサイトビルダーの出番です!

ホームページを作成する前に役立つツール6個

Webサイトビルダーの出番まで、実は結構めんどくい作業がありました。でも、お金をかけない代わりに手間というコストが発生するのは仕方のないこと。覚悟を決めて取り組みましょう。

各工程で役立つツールがいくつかありますよ。利用して工程ごとの負担を減らしましょう。

9.MindMeister

MindMeisterはブラウザからマインドマップを作れるサービスです。

マインドマップは、一つのテーマを軸にアイデアを枝分かれに広げながら、同時に整理もできるアイデア整理術です。企画をスムーズに進めるために利用できたり、、サイトマップの作成や、原稿作成時の文章構成にも応用できます。

10.Cacoo

Cacooはカワイイ管理画面から、色々な図を作れるサービスです。「サイトマップ」や「ワイヤーフレーム」を作るのに利用しましょう。

操作感はWebサイトビルダーとよく似ています。「ドラッグ&ドロップ+キーボード入力」で、あらかじめ用意されたパーツを組み合わせながら、楽しく図の作成を進められます。

11.Color scheme designer
color scheme designer

ホームページのデザインにとって、色の使い加減はとても重要です。
見る人の購買欲を刺激したり、信頼感や安心感を伝えるには、色合いが大きく作用します。でも、色の組み合わせ方って難しいんですよね。

そこで便利になるのが配色ツールのColor scheme designerです。軸になる一色を選ぶと、合う色を勝手に選んでくれて、さらに親切なことに、色の配置も含めたレイアウトを提案してくれます。

配色について、初心者さん向けの記事を書きました。あわせて読んでみてください。

12.MouLocX
color scheme designer

配色ツールとコンビで使いたいのがカラーピッカです。モニタ上で、マウスを当てた部分の色をrgbの数値で教えてくれます。

13.ただピク
ただピク

ただピクは、複数の画像配布サイトを横断して欲しい画像を検索できます。
検索できるサイトは現在36個!これだけあれば、どんな画像もまず見つかるはずです。

14.Photoshop Express Editor
photoshop

あの画像編集ソフトの王、Photoshopを機能はかなり制限されていますがブラウザから無料で使えます。写真の補正や切り抜きなど、簡単に素早くできるので、大きく編集が必要でない場合は重宝し、実際、原稿に使う写真の編集くらいなら、これで充分かもしれません。

探すと他にもたくさん見つかりました。ブログで使う画像を作るのにも利用できます。

独自ドメインについて

最後に「独自ドメイン」について説明しておきます。

独自ドメインを取得するとオリジナルのアドレスでホームページを運営できます。このブログの場合でいうと「websae.net」の部分です。

無料のウェブサイトビルダーでホームページを作成すると自動的にアドレスを与えられます。永久にそのウェブサイトビルダーを利用し続けるのなら、与えられたアドレスでもいいのですが、もしいつかレンタルサーバーを借りて、本格的なホームページを運営していくつもりであれば、注意が必要です。

ウェブサイトビルダーからレンタルサーバーへ移転すると、アドレスが変わってしまいます。それまでに得た固定客全員に新たなアドレスを知らせることは難しいですし、SEOの効果もリセットされます。結果、大きくアクセスを失ってしまいます。

それを避けられるのが独自ドメインです。独自ドメインを取得しておけば、新しい環境へホームページを移してもアドレスは変わらないからです。将来的に制作会社へ依頼する予定のある人や、もっと高機能なホームページへリニューアルするつもりのある人は、早い段階で検討しておくといいでしょう。

無料のホームページ作成ツール、まとめ

以上、ホームページを作成するときに役立てられる無料ツールの紹介でした。

Webサイトビルダーは、専門的に見るとHTMLソースが美しくない、将来的に自前のサーバーへ移転することが難しい、などデメリットも見つかります。

でも、取っ掛かりのハードルの低さと完成までのスピード感を考えると、とりあえず名刺代わりになるホームページが欲しいときや、手っ取り早くイベントページやキャンペーンサイトを作りたいときなど、活躍の場は多いはずです。

そのほか、いろいろな理由で制作会社を頼れない人は、なんせ無料。費用的なリスクはありません! 難しく考えず、まずは試してみてはいかがでしょうか?

シェアしてくれると嬉しいです!(コメントも喜ぶよ

あなたにはこんな記事もおすすめ!
ん?最新情報を見逃さない方法!?
わざわざブログに来なくても、自動的にウェブさえの更新情報を受け取ることができます。「お、いいね!」と思われた人は、SNSのアカウントをフォローするか、RSSリーダーへ登録、どれでも都合のいい方法で受け取ってくださいね! しばらく休止していたウェブさえマガジンも最近再開しました。メールで受信できます。受信は無料で、いつでも解約できるので気軽に登録してみてください。
ウェブさえマガジン
  • facebook
  • twitter
  • google

コメントも大歓迎!

Top