使い方はあなた次第。無料のツールを使ってオリジナルのWEBサイトを作ってみよう!

website

情報社会が発達している現在では、インターネットを使ってWEBサイトやWEBサービスを利用しない日がないと思います。いつも何気なく見ているサイトを一から作ろうとすると、HTMLやコードを入力して……といったように、難しい作業を行わなければいけません。しかし、インターネット上にある無料のツールを使うことで、誰でも簡単にWEBサイトを作ることのできるのです。今回は、そんな無料のツールを使ったWEBサイトの作り方について、詳しく紹介したいと思います。編集・執筆 / SHIGEMATSU, AYUPY GOTO

WEBサイトを簡単に作れるサービスがあることを、知っていますか?

あなたは、誰でも簡単に作れるWEBサイト制作ツールがあることをご存知ですか?そのほとんどが無料で利用することができます。中には有料のものもありますが、無料のものでもかなりクオリティの高いものを作ることができます。自分でサイトを作ることができると、作品をWEB上でまとめたポートフォリオサイトとして活用できたり、趣味の情報を世界中に発信できたり、情報を共有する手段になったり……その使い方はあなた次第で、いろいろなシーンに活用することができます。
最大のメリットとしては、難しい作業を行わなくても手軽にサイトを作ることができることです。パソコンを使うのが苦手だという人も安心してください。WEBサイトの基盤となる部分がもうすでに出来上がっているので、画像をはめ込んだり文字を入力したり背景の色を変えるだけで、あっという間にオリジナルのWEBサイトが完成してしまいます。なので、WEBサイトを作ったことのない人も挑戦しやすいのが特徴です。

無料でWEBサイトが作れるサービスをご紹介

Wix

Wixは、HTMLなどを打ち込む必要が無い無料で簡単にWEBサイトを作ることができるサービスです。500種類以上のテンプレートから自分の好きなものを選び、組み合わせて作っていきます。アイコンも豊富で、レイアウトしやすいです。

wix_hp

Wix HP

Jimdo

こちらもテンプレートからデザインを組み立てることのできるサービスです。操作はシンプルで画像を入れ込みたいところ、文字を変えたいところをクリックして入れ替えるだけです。フリープランとビジネスプラン、プロプランの3タイプがあり、フリータイプのみ無料で利用することができます。フリープランの場合、様々な企業の広告が大きく表示されています。

jimdo

Jimdo HP

Ameba Ownd

こちらのサービスはお洒落なテンプレートが豊富に揃っています。ブランドや雑誌のデザインをイメージしたものや、カフェのメニュー風のものなど、スタイリッシュでかっこよく仕上げることができます。

fireshot-capture-127-%e7%84%a1%e6%96%99%e3%81%a7%e3%83%9b%e3%83%bc%e3%83%a0%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%84%e3%83%96%e3%83%ad%e3%82%b0%e3%82%92%e4%bd%9c%e3%82%8d%e3%81%86-ameba-ownd%e3%82%a2
Amena Ownd HP

ペライチ

テンプレートを選び、クリックと文字入力だけでその他の操作をしなくてもWEBサイトが完成してしまうサービスです。専門知識が無くてもしっかりとしたWEBサイトが作れます。こちらも無料プランと有料パターンがあり、必要に応じて選ぶことができます。

fireshot-capture-128-%e9%a9%9a%e3%81%8f%e3%81%bb%e3%81%a9%e3%82%ab%e3%83%b3%e3%82%bf%e3%83%b3%ef%bc%81%e7%84%a1%e6%96%99%e3%83%9b%e3%83%bc%e3%83%a0%e3%83%9a%e3%83%bc%e3%82%b8%e4%bd%9c%e6%88%90

ペライチ HP

実際にWEBサイトを作ってみよう!

では、無料のツールを使ってWEBサイトを作ってみましょう。今回は、先程ご紹介した「Wix」というツールを使って制作したいと思います。説明と手順が分かりやすく書いてあるので、誰でも簡単に作ることができますよ。是非チャレンジしてみてください。

wix1
まずは、どのようなテーマのWEBサイトを作るか決めましょう。今回は作品集をイメージして作りたいと思うので、デザイナーのテーマを選んでみます。


fwix7
次に、自分の作りたいものに合わせてテンプレートを選んでいきます。
wix5
テーマに合ったものを選びます。
画像がたくさんあって見やすいので、このテンプレートを使って作っていきたいと思います。


wix5
先程のテンプレートをクリックすると、編集画面に切り替わります。
枠で囲んである左側のボタンをクリックすると、背景を変えられたり画像を追加したり、SNSのアイコンをつけられたりカスタマイズできます。
fireshot-capture-123-wix-%e3%83%9b%e3%83%bc%e3%83%a0%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%a8%e3%83%87%e3%82%a3%e3%82%bf_-http___editor-wix-com_html_editor_

fireshot-capture-124-wix-%e3%83%9b%e3%83%bc%e3%83%a0%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%a8%e3%83%87%e3%82%a3%e3%82%bf_-http___editor-wix-com_html_editor_


fireshot-capture-125-wix-%e3%83%9b%e3%83%bc%e3%83%a0%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%a8%e3%83%87%e3%82%a3%e3%82%bf_-http___editor-wix-com_html_editor_%e3%81%ae%e3%82%b3%e3%83%94%e3%83%bc
左側のメニューボタンから、アイコンを追加してみました。
背景の色も全体の雰囲気に合わせて自由自在に変えることができますよ。


fireshot-capture-126-wix-%e3%83%9b%e3%83%bc%e3%83%a0%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%a8%e3%83%87%e3%82%a3%e3%82%bf_-http___editor-wix-com_html_editor_%e3%81%ae%e3%82%b3%e3%83%94%e3%83%bc
次に、元々配置されていた画像を差し替え、アイコンとして作成した画像を配置してみました。
このように、画面を自分なりにカスタマイズすることでオリジナルのWEBサイトを作ることができます。
全部のレイアウトが決まったら、右上にある「公開」ボタンを押せば、WEBサイトの完成です!

最後に

自分でWEBサイトを作れると、ポートフォリオとして作品を載せたり、撮った写真を一つのWEBサイトにまとめたりと、発信の幅が広がると思います。HTMLなどを使わなくても作ることができる方法があるということを、今回の記事を通して知っていただけたら嬉しいです。是非みなさんも一度、オリジナルのWEBサイト作りに挑戦してみてくださいね。

(2017.4.10)

著者

重松芙史香

女子美術大学デザイン・工芸学科のヴィジュアルデザイン専攻に所属しています。かわいい小物や雑貨を集めるのが趣味です♬

記事一覧へ

ポートフォリオでデザインチームとつながろう

ポートフォリオをつくる

作品を投稿してデザインチームとつながる日本最大のマッチングプラットフォーム。もちろん、ポートフォリオのみの活用も可能です。

作成する

デザイナーを採用する

国内最大のデザインプラットフォームで、チームにマッチするデザイナーに声をかけてみませんか?

採用する