ウェブサイトを作ろう~初級編:まず初めに制作に必要なもの~

ウェブサイトを自分で作る場合はいくつかのツール・環境が必要になります。

今回は説明も兼ねて紹介したいと思います。

では早速いってみましょー!

 

1.PC

これは基本ですね。むしろわざわざ説明するか迷いましたが、スマホやタブレットで制作を考えている人がいたら断然PCをお勧めします。

 

ノートPCでもデスクトップPCでも構いません。インターネットが利用できる環境であれば大丈夫です。

私の場合はwindowsでやってますがMacでも構いません。

 

2.テキストエディタ

テキストエディタ

htmlやcssに文字を入力していく際、必要になってくるのがテキストエディタです。よくウェブサイト上でマウスを右クリック→ページのソースを表示で出てくるアレです。

 

テキストエディタで入力した内容がウェブサイトのデザインに反映されます。いわば『ウェブサイトの設計図』みたいなもんです。

 

・TeraPad(無料)

無料で使用できて、ウェブサイトの構造を勉強しながら作っていきたい人におススメです。

使い方はこちらを参考にどうぞ。

プログラミングにも使える!TeraPadの使い方【初心者向け】|TechAcademy 

 

・dreamweaver(有料:¥2,180/月)

Adobe社が作成したテキストエディタです。多くのウェブデザイナーの方が使用していて、多機能で便利。こちらのソフトは有料でdreaweaver単体だと¥2,180/月です。

 

使い方に多少の勉強は必要なものの、慣れてくれば作業効率は上がりますし、レスポンシブデザインも作成しやすいので、とても便利なツールです。

 

無料体験ダウンロードも行っているので、試しに使ってみてはいかがでしょうか。

ホームページ作成ソフト | Adobe Dreamweaver CC体験版ダウンロード

 

3.画像修正ソフト

ペイントソフト

スライダー用の画像を加工したり、ウェブサイト上にイラストを載せたいときに必要なソフトです。それぞれ特徴があり、どれも勉強が必要ですが、ウェブサイトをより華やかにするためにも欠かせません。

 

 

・GIMP(無料)

無料なのにとても高機能なペイントソフトです。読み方はギンプです。画像編集やペイント機能を搭載しており、無料でこれは正直すごいと思います。

 

使いこなせればphotoshopやillustlatorにも引けを取らないことでしょう。専門書も販売しているので、細かい使い方は本を買って学びましょう。

公式ページ:Gimp

使い方ガイド:GIMPの使い方 | Synclogue Navi

 

 

・illustlator(有料:¥2,180/月)

Adobe社のソフトで、イラストの作成、テキストの編集やレイアウトにも最適なツールです。通称イラレ。

 

ウェブデザインだけではなく、名刺やチラシの作成にも使用されていて、多くのデザイン業に携わる方が利用しています。こちらもGimp同様多機能なので、本を買って勉強したほうが良いです。

 

無料お試しができるので、一度触れみてはいかがでしょうか。

30 日間の無償体験版を開始 | Adobe Creative Cloud

 

・photoshop(有料:¥2,180/月)

こちらもAdobe社のソフトです。通称フォトショ。主に画像編集に特化していて、初めて写真修正で使用したときに『す、すげえ~』と何回も驚いた記憶があります。フォトショップで画像を加工していく動画は面白ですよね。

 

マツコ・デラックスを痩せさせてみた photoshop diet

 

photoshopも無料体験実施中です。

30 日間の無償体験版を開始 | Adobe Creative Cloud

 

 

4.レンタルサーバー

 

作成したウェブサイトをインターネット上に表示するためにはサーバーを借りなくてはなりません。

 

ウェブサイトが『』だとすると、レンタルサーバーは建てるための『土地』だと思ってください。レンタルサーバー会社はそれぞれ料金が異なり、サービスも違ってきます。

一概にどれがおススメとは言えませんので、作成するウェブサイトの規模に合わせて適したものを選択しましょう。

 

さくらインターネット

2週間お試し期間ありのレンタルサーバー。wordpressを使いたいならスタンダードプラン以上を申し込みましょう。

各種プラン | さくらインターネット

 

ロリポップ

サポートサービスが充実しているレンタルサーバー。平日21時までチャットでのサポートを対応。選択したプランによっては電話でのサポートもしてくれるので初心者にとってはありがたいですね。

ロリポップ

 

 

5.FTPソフト

 

テキストエディタでデザインをコーディングして、画像編集ソフトで彩りを加えて、ウェブサイトが出来ました。そうしたら次にサーバーにアップロードをしなければなりません。このままでは他の人が見られないですからね。

 

FTPソフトはローカルである貴方のPC内にあるhtmlを、オンライン上のサーバーへと運ぶ役割を担っています。

オンラインに上げて、初めてウェブサイト公開となります。

 

FFFTP

以前まではパスワードやファイルを暗号化せずに送受信するFTP接続しか対応していませんでしたが、最近では、暗号化された状態でセキュアな通信が出来るFTPS接続に対応しています。初心者にとってとっつきやすいです。

FFFTPダウンロード | 窓の杜

 

FileZilla

高機能かつ初心者にも使いやすいFTPソフトです。こちらを使っておけば間違いないかもしれません。

FileZillaダウンロード

 

いかがだったでしょうか。大ざっぱな説明でしたが、以上がウェブサイトを作成、公開するまでに必要なツールになります。

 

とりあえず以上が揃っていればウェブサイトを公開することはできます。

 

それぞれの細かい使い方については後ほど記事にする予定なので、今は「こういうものが必要なのか。なるほど」、と思っていただければ充分です。

 

 

 

 

 

Follow me!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です