1. ホーム > 
  2. Webサイト制作 > 
  3. サイト制作のヒント > 
  4. FFFTPの使い方

FFFTPの使い方

Windows用FTPソフトの定番「FFFTP」でサーバーへの接続や切断、ファイルのアップロードなどの基本的な使い方を解説。便利なFFFTPの活用Tipsもあわせてご紹介。

  • 2016/11/12
  • 2016/10/9

WebサーバーにHTMLや画像ファイルをアップロードするには、FTPクライアントを使います。Windowsの代表的なFTPクライアント、FFFTP。その使い方について解説します。

FTPとは?

FTPとはFile Transfer Protocol(ファイル・トランスファー・プロトコル)の略で、2台のコンピュータの間でファイルを転送するためのプロトコル、つまり「約束事」です。
この約束事に沿って、誰でも簡単にファイルの転送ができるようにしたソフトウェアを「FTPクライアント(FTPソフト)」と呼びます。

また、通信経路を暗号化してセキュリティを高めたFTPSや、SSHを介してファイル転送を行うSFTPというプロトコルもあります。

参考:FTPS、SFTPの違いって? – Qiita

ファイルをサーバーにアップロードする手順

サーバーにファイルをアップロードしてみましょう。ここでの解説は、アップロードするためのファイルが一つのフォルダ内にまとまっている状態を前提にしています。

  1. フォルダの階層を移動するアイコンの場所まず左側のローカル側のフォルダの移動アイコンをクリックして、アップロードするファイルが保管されているフォルダを選びます。ウィンドウ内のフォルダをクリックすれば、そのフォルダ内のファイル一覧が表示され、左上のアイコンをクリックすると「一つ上のフォルダ」内のファイル一覧が表示されます。
  2. メインウィンドウ右側のサーバー側でも同じように、アップロードしたいフォルダを開きます。
  3. アップロードしたいファイルを、左のローカル側から、右のサーバー側のウィンドウにドラックして移動するとファイルがアップロードされます。フォルダをドラッグした場合、そのフォルダ内のすべてのファイルがアップロードされます。

複数のファイル・フォルダを同時にアップロードする方法

FFFTPのウィンドウに連続して表示されているファイル・フォルダは、その範囲をドラッグすることで一気に選択する事ができます。
そのままサーバー側にドラッグすれば、まとめてアップロードできます。

ウィンドウの一番上のフォルダと、一番下のファイルを同時にアップロードしたいといった場合には、Ctrlキーを押しながらフォルダ・ファイルをクリックすれば、クリックしたものだけを選択する事ができます。
あとはサーバー側にドラッグすればアップロードできます。

またアップロードしたいファイルをドラッグする方法以外にも、ファイルをアップロードする方法があります。

右クリックで「アップロード」を選ぶ方法

アップロードしたいファイルを選択して右クリックすると、メニューが開くので「アップロード」をクリックすると、選択したファイルがアップロードされます。

右クリックメニューからアップロードする方法は、複数のファイルを選択して実行することも可能です。

矢印アイコンをクリックしてアップロードする方法

アップロードしたいファイルを選んで、メインウィンドウの上部にある上向きの矢印をクリックするとそのファイルがアップロードされます。

この方法でも複数のファイル・フォルダを選択して一気にアップロードすることができます。

ファイル名を変更してアップロードする方法

アップロードしたいファイルやフォルダを選択して右クリック。
「名前を変えてアップロード」を選択すると、名前を変えるウィンドウが開き、そこで設定したファイル名でアップロードする事ができます。

名前を変えてアップロードの設定場所

この機能は、サーバーの設定を変更する「.htaccess」ファイルをアップロードする時に便利です。

「.htaccess」は、ファイル名の先頭に「.(ドット)」を付ける必要がありますが、パソコン側では、.(ドット)以降が拡張子と判断されてしまい、ファイルが保存できません。
(ファイル名のない拡張子だけのファイルと認識される)

そこで、パソコン側では「htaccess.txt」としてファイルを作成・編集し、アップロードする時に「.htaccess」とファイル名を変えてあげれば、トラブルも少なくうまくいきます。

ミラーリングアップロードとミラーリングダウンロード

ミラーリングとはデータの複製を別の場所に作成することを指します。

FFFTPのミラーリングアップロードは、サーバー側のデータを完全にローカル側のデータと一致させ、ミラーリングダウンロードはその逆です。

ミラーリングアップロード

サーバー側にローカル側のデータを完全に複製する方法です。

サーバー側に存在しないファイル・フォルダは作成され、ローカル側に存在しないファイル・フォルダは削除されます。

ミラーリングアップロードの図解

ミラーリングダウンロード

ローカル側にサーバー側のデータを完全に複製する方法です。
ローカル側に存在しないファイル・フォルダは作成され、サーバー側に存在しないファイル・フォルダは削除されます。

ミラーリングダウンロードの図解

ミラーリング機能は、サーバー側の完全なバックアップを行いたいなど、使う場面によっては便利な機能ですが、一括でファイル・フォルダの作成・削除を行うので危険も伴います。

十分に検証できている時だけに利用することをお勧めします。

サーバーからファイルをダウンロードする手順

ダウンロード方法はアップロード方法と似た手順です。

サーバー側でダウンロードしたいファイルをローカル側にドラッグアンドドロップで移動するとダウンロードされます。

サーバー側でファイル・フォルダを選択して右クリック、「ダウンロード」を選んでもOKです。

下向きの矢印をクリックしてもダウンロードできます。

サーバーの接続を切断する方法

サーバーの接続を切断するには、コンセントプラグにXが付いているアイコンをクリックします。

コンセントプラグのアイコンをクリックすると、接続するサーバーを選ぶ「ホスト一覧」ウィンドウが開きます。

便利なFFFTPのTips

FFFTPを使う時に覚えておくと便利なTipsをご紹介します。

ファイル・フォルダのパーミッション変更

パーミッションとは、ファイルやフォルダの閲覧・編集権限です。
サーバーにアップロードしたファイルでも、Webサーバーに閲覧権限がないとブラウザで表示させることができません。

権限のないファイルを表示しようとすると、下図のようなエラー画面が表示されてしまいます。

閲覧権限のないページを表示したエラー画面のサンプル

こういったエラーが表示された場合には、FFFTPを使ってパーミッションの変更をする必要があります。

  1. 属性変更の設定場所パーミッションを変更したいファイルを選んで右クリックし、「属性変更」を選択します。
  2. 属性には「オーナー」「グループ」「その他」の3つのカテゴリーがあり、それぞれ「呼出」「書込」「実行」の3つの権限があります。通常、ブラウザで表示させるだけのファイルであれば、「その他」の「呼出」にチェックが入っていれば問題はありません。

パーミッションの設定は、不用意に変えてしまうとセキュリティリスクになる可能性があります。よく分からないという方は触らないほうが無難です。

操作は、上記のエラーが表示されてしまった場合などだけにとどめておきましょう。

FFFTPの関連ページ

FFFTPのダウンロード・インストール方法
FFFTPの設定と接続できない時に確認すること

Webデザイン・プログラムスキルを身につけたい方におすすめしたいスクール

私もWebスキルを身につけるためにスクールに通いましたが、正直言って「趣味の講座レベルのスクール」が多く、実践的なスキルを身につける事ができるスクールは多くありません。

ただ全くの未経験ではWebを仕事にする事が難しいのも事実。そこでWebの実践的なスキルを身につけられるスクールをご紹介します。

スクールの価格は安くありませんので、まずは無料体験レッスンや無料カウンセリングで体験してみて、良さそうだなと思ったら本格的に取り組む方法をおすすめします。

Webスク(6か月のガッチリ型)

半年間、オンラインとオフラインのカリキュラムで「即戦力」と呼ばれるような人材になるためのスクール。業界の企業を見学するオフィスツアーやIT企業の人事担当との交流会など、現実的なキャリア形成のイメージを作れる機会があるのが良いです。

無料体験レッスンでは、キャリア形成の相談もできます。

WebCamp(1か月の集中型)

こちらは1ヶ月の短期集中型。と言っても、最初のカウンセリングを通してカリキュラムは個人ごとのオーダーメイドなので、自分の都合で学べるのが良いです。

このご時世、直接Web制作に携わらない部署の人もWebに関する知識は必要なので、社会人の方の受講も多いです。

CodeCamp(2〜6か月のカスタマイズ型)

現役エンジニア・デザイナーからマンツーマン指導が受けられるスクールです。内容的には他のスクールにひけはとらないにもかかわらず、オンラインのみなので価格が安いのが良いです。

新卒などの社内研修でも利用されているので、社員のスキルギャップに悩んでいる方にも良いかもしれません。

「役にたった」と思ったらシェアお願いします