西田さん用 手順書(予備)
FTPソフト「FileZilla」で、自分でホームページのファイルをサーバーに置く方法

✅ この作業は終わっています(10月12日)。新しいサイトは、エックスサーバー(XServer Static)の仮のアドレス https://st221282.static.jp/ に公開ずみです。10月12日の朝、仲が最新版(10月5日のロゴ入り、10月12日のプライバシーの文)に入れ替えました。西田さんがファイルを上げる作業は、もうありません。

残っているのは、ドメイン(niimagroup.org)のお引っ越しだけです。ドメインお引っ越しの手順(全27)を見てください。

📌 この手順書の位置づけ
ふつうは、ブラウザだけでやる手順書(ファイル管理編)と、仲がFTPで置く方法が先です。こちらは予備です。仲から「こちらを」と案内があったとき、または西田さんが「自分でやってみたい」と思ったときだけ使ってください。案内がないうちは、手を止めて大丈夫です。

西田さんご自身のパソコンに、無料のFTPソフトFileZilla(ファイルジラ)を入れて、ホームページのファイルをサーバーの公開フォルダ(「/」)に置く手順書です。WindowsでもMacでも使えます。

XServerアカウント本体のパスワードを、誰かに送る必要はありません。この作業では、ファイルを置くためだけの「FTP専用の新しいパスワード」を、西田さんが自分で作って、自分のパソコンの中でだけ使います。作業を途中で止めても何も壊れません。同じファイルは何度でも置きなおせます。落ち着いてゆっくり進めてください。

⚠ やりとりのきまり
仲との連絡は、すべてGRANTのメッセージだけでおこないます。パスワードや確認コードは、GRANTのメッセージにも書かないでください(この方法では、仲にパスワードを渡す必要がありません)。困ったときは「どの画面で何と出たか」をGRANTのメッセージでお知らせください。画面の写真の撮り方は、最後の「画面の写真の撮り方」にあります。

この手順書の「確かめた」と「まだ確かめていない」について
・✅ 確かめ済み:サーバーの設定(ホスト名・ポート・暗号化の方式)、ファイルの置き方の順番(index.html は最後)、サイズの照合のしかた、.htaccess に触らないこと。これらは、仲が同じ種類のサーバーで実際に試した結果と、XServer社・FileZillaの公式の情報にもとづいています。
・🔶 まだ確かめていない:FileZilla自身の画面の細かい見た目や、ボタンの名前。仲はFileZillaを実際に動かして試すことができていません。そのため、FileZillaの画面は「〜のような画面が出ます」と書いています。名前や並びが少し違うことがあります。似た名前のものを使うか、手を止めてGRANTでお知らせください。

0. 始める前に(用意するもの)

  1. 用意するものを手元にそろえます。

    • パソコン(WindowsでもMacでもかまいません。どちらか分からないときは、下の「分からないとき」を見てください)
    • XServerアカウントのメールアドレスとパスワード(西田さんだけが知っているもの。ログインのときにだけ、自分で入れます)
    • ホームページのzipファイル:niimagroup-site-20260930-flat-for-filemanager.zip(手順7で保存します)

    分からないとき:画面の左下か左上に、四角い4つの窓のマーク(Windows)か、りんごのマーク(Mac)が見えるほうです。

  2. 作業時間の目安は、はじめてなら40分〜1時間です。途中で休んでもかまいません。

  3. 今回使うサーバーの情報(メモしておくと便利です)

    ホスト(サーバー名)sv17.static.ne.jp ※XServerの「FTPの利用」の画面に出る名前が正しいものです。違っていたら、画面の名前を使ってください
    ユーザー名st221282
    パスワード手順3で、西田さんが新しく作る「FTP専用のパスワード」(ここには書きません)
    ポート21
    暗号化明示的なFTP over TLS(必須)
    公開フォルダつないだ直後の場所そのもの(「/」)。「ホスト初期フォルダ」は空欄(XServer公式の指定)
    サイトのアドレスhttps://st221282.static.jp/

1. FileZillaを手に入れる(安全な入手先)

🛑 ここがいちばん大事です。検索すると、本物そっくりの「ダウンロード」ボタンの広告や、別の会社が配っているダウンロードサイトが出てきます。そこから入れると、いらないソフトが一緒に入ったり、ウイルスが混ざったりすることがあります。必ず、次の公式サイトだけから入れてください。

  1. ブラウザのアドレスの欄に、次のアドレスをそのまま貼りつけて開きます(検索結果のリンクは使いません)。

    https://filezilla-project.org/download.php?show_all=1

    上のほうに「FileZilla Client」と書かれ、Windows・macOSなどの種類ごとに、ダウンロードの行が並んだページ(のような画面)。アドレスの欄に filezilla-project.org と出ています

    • アドレスの欄が filezilla-project.org になっているか、必ず見てください。似た別の名前(つづりが1文字違う、など)のときは、閉じてください。
    • 「FileZilla Client」のほうを選びます。「FileZilla Server」は別のソフトです(使いません)。「FileZilla Pro」は有料版です(使いません)。
  2. 自分のパソコンに合うものを選びます。

    • Windows:「Windows (64bit x86)」のインストーラー(setup)。ファイル名に sponsored(スポンサー)と入っていないものが、おすすめです。
    • Mac:「macOS」の、お使いのMacに合うもの(Apple製のチップのMacなら「Apple Silicon」、古いMacなら「Intel」)。分からないときは、画面左上のりんごのマーク →「このMacについて」で「チップ」か「プロセッサ」を見てください。

    ファイル名が FileZilla_3.○○.○_win64_sponsored2-setup.exe のように sponsored と入っているものと、入っていないものが並んでいる様子(のような画面)

    ⚠ 広告やおまけのソフトに注意
    ・ページの中の、緑や青の大きな「Download」「ダウンロード」ボタンで、FileZillaのページの外に飛ぶもの(広告)は押さないでください。
    ・「sponsored」と名前に入ったWindows用のインストーラーは、インストールの途中で、別のソフト(ブラウザなど)をすすめてくる「おまけ」が付くことがあります(公式サイトの案内と、複数の報道にもとづく内容です。仲が実物を開いて確かめたわけではありません)。入れてしまったときは、すすめる画面で必ず「辞退する/Decline/スキップ」を選びます。
    ・「ほかのダウンロードサイト」「ダウンロード管理ソフト」「ウイルス対策ソフトが必要です」といった画面が出たら、そこで止めて、何もインストールしないでください。

  3. ダウンロードが終わったら、ファイル(Windowsは .exe、Macは .tar.bz2 または .dmg など)が、パソコンの「ダウンロード」フォルダに保存されます。

2. FileZillaをインストールする

Windowsの場合

  1. 「ダウンロード」フォルダの FileZilla_…setup.exe を、ダブルクリックします。「このアプリがデバイスに変更を加えることを許可しますか?」と出たら「はい」を押します。

  2. 「License Agreement(使用許諾)」が出たら「I Agree」、次の画面で「Anyone who uses this computer(このパソコンを使う全員)」か「Only for me」を選んで「Next」を押していきます(どちらでも大丈夫です。初期の選択のままでかまいません)。

  3. 「Optional offer(おまけのソフトの提案)」のような画面が出たら、ここが大事な場所です。「Decline(辞退)」を押して、先へ進みます。「Accept(受け入れる)」は押しません。

    別のソフトの名前と「Accept」「Decline」の2つのボタンがある画面(のような画面)。出ないこともあります

  4. 最後に「Install」→「Finish」を押します。

Macの場合

  1. 「ダウンロード」フォルダの、FileZillaのファイルをダブルクリックして開きます(FileZilla.app という青いアイコンが出ます)。

  2. その FileZilla.app を、「アプリケーション」フォルダに、マウスでつまんで運びます。

  3. 「アプリケーション」の中の FileZilla をダブルクリックします。「インターネットからダウンロードされたアプリです。開いてもよろしいですか?」と出たら「開く」を押します。(出ないこともあります。)

  4. もし「開発元を確認できません」と出て開けないときは、パスワードを入れたり、設定を変えたりする前に、画面の写真をGRANTでお送りください。

共通:はじめて開いたとき

  1. FileZillaが開きます。左右に分かれた画面(左がパソコンの中、右がサーバーの中)と、上に細長い入力欄(ホスト・ユーザ名・パスワード・ポート)が並んだ画面(のような画面)です。

    上に「ホスト」「ユーザ名」「パスワード」「ポート」の入力欄、中ほどに「ローカルサイト」と「リモートサイト」の2つの枠が見える画面

    「ようこそ」の画面などが出たら、「OK」を押して閉じます。アップデートをすすめられたら、公式のものかどうか分からないので、いったんキャンセルして大丈夫です。

3. XServerで「FTPの利用」をONにして、FTP専用の新しいパスワードを作る

ここは、ブラウザの手順書の1〜2と同じ入り口です。FTP専用の新しいパスワードを作ります。XServerアカウント本体のパスワードとは、別のものです。

  1. ブラウザ(Chrome)で、XServer Staticのログイン画面を開いて、ログインします(ブラウザ手順書の手順1と同じです)。
    https://secure.xserver.ne.jp/xapanel/login/xstatic/

    ログインすると、「XServer Static契約管理」というページが開きます。下のほうの「ご契約一覧」の中の「サーバー」で、st221282 の行を探します。

  2. その行の右のほうにある サーバー設定 を押します。

    サーバーの設定の項目がならんだ画面(のような画面)。その中に「FTPの利用」という項目があります

  3. 「FTPの利用」の項目の 変更する を押します。

  4. 「利用設定」を「ON」にします。

  5. パスワードの欄に、新しい、FTP専用のパスワードを入れます。

    ⚠ パスワードの決め方
    ・英字と数字だけで、10文字以上にしてください(記号を入れると、うまくつながらなくなることがあります)。
    ・XServerのログインのパスワードや、ほかで使っているパスワードは、使わないでください。今回だけの、新しいものにします。
    ・このパスワードは、手帳などに書いておくか、頭に入れておいてください(あとでFileZillaに入れます)。GRANTのメッセージや、画面の写真には、書かないでください。

  6. 確認画面へ進む を押し、内容を確かめて 変更する を押します。

    完了を知らせる画面(のような画面)。または、「FTPサーバー(ホスト)名」や「ユーザー(アカウント)名」が出ている画面

  7. 「FTPサーバー(ホスト)名」(svで始まり.static.ne.jpで終わる文字)と、「ユーザー(アカウント)名」(st221282)を、確かめてメモします。

    ※ONにしてから、使えるようになるまで、数分かかることがあります。

4. FileZillaに、接続の設定を入れる

仲が実際にFTPで成功させたときの条件を、FileZillaの画面の設定に置きかえたものです。次の表のとおりに入れてください。パスワードは「毎回たずねる」設定にして、パソコンの中に書き残さないようにします。

項目入れる値理由
プロトコルFTP - ファイル転送プロトコルXServerのFTPは、この方式です(SFTPではありません)
ホストsv17.static.ne.jp(手順3で見た名前)XServer公式の指定
ポート21XServer公式の指定
暗号化明示的なFTP over TLSが必要(Require explicit FTP over TLS)暗号化なしでは使いません。「必要」を選ぶと、暗号化できないときは、つながらずに止まります(安全側)
ログオンの種類パスワードを尋ねる(Ask for password)パスワードがパソコンに保存されません
ユーザst221282XServer公式の指定(サーバーID)
転送設定 → 転送モードパッシブ(Passive)仲が成功させたときと同じ。家庭の機器とも相性がよい
転送設定 → 同時接続数の制限チェックを入れて「1」一度に1つずつ置く。失敗の原因が分かりやすくなる(仲のすすめ)
詳細 → デフォルトのリモートディレクトリ空欄XServer公式:「ホスト初期フォルダ」は空欄
  1. ※FileZillaの日本語表示の言葉は、版によって少し違うことがあります。英語の名前も( )に書きました。
    FileZillaの左上の、「サイトマネージャー」のアイコン(小さな四角が3つ重なったマーク)を押します。キーボードでは、Windowsは Ctrl+S、Macは ⌘+S です。メニューの「ファイル」→「サイトマネージャー」でも開きます。

    左に「マイサイト」のような一覧、右に「一般」「詳細」「転送設定」「文字セット」などのタブがある画面

  2. 左下の 新しいサイト を押し、名前を「にぃまのサイト」のように入れます。

  3. 右の「一般」タブで、上の表のとおりに入れます。

    • プロトコル:FTP
    • ホスト:sv17.static.ne.jp
    • ポート:21
    • 暗号化:明示的なFTP over TLSが必要
    • ログオンの種類:パスワードを尋ねる
    • ユーザ:st221282

    プロトコル・ホスト・ポート・暗号化・ログオンの種類・ユーザが縦にならんだ入力画面(のような画面)

    ⚠ 「暗号化」の選択肢に、「プレインFTPのみ使用(安全ではありません)」があります。これは選ばないでください。「通常はFTP over TLSを使用…(利用できるなら)」の項目も、避けてください。「必要」と書かれた項目を選びます。

  4. 「転送設定」タブを開きます。

    • 「転送モード」:パッシブ
    • 「同時接続数を制限する」にチェックを入れ、「最大接続数」を 1 にする
  5. 「詳細」タブの「デフォルトのリモートディレクトリ」が空欄であることを確かめます。

  6. まだ「接続」は押さず、OK を押して、いったん閉じます。(保存されます。)

5. 【大切】「ファイルが欠ける」ことへの備え(TLSについて)

🛑 先に、知っておいてほしいことです。
仲が、同じ種類のサーバーで試したところ、ファイルを置くときの暗号化の方式が「TLS 1.3」という新しい方式だと、画像などのファイルが、大きさ0のまま(空っぽ)になったり、途中で切れたりしたことがありました(仲の環境のcurlというソフトでの結果です)。「TLS 1.2」までに制限すると、全部、正しく置けました。そのとき、サイトが一時的に空白になることもありました。

事実(✅確かめ済み)

推定(🔶まだ確かめていない)

そのため、この手順書では、次の3つで備えます

  1. 備え1:同時接続は1つ、パッシブ、暗号化「必要」で置く。(手順4で設定ずみ。仲の成功したやり方に、いちばん近づけています。)

  2. 備え2:置いたあとで、ぜんぶのファイルの大きさを、必ず照合する。(手順9。付録Aの「正しい大きさ」と、1つずつ比べます。)これが、いちばん確実な守りです。エラーが何も出なくても、大きさが違えば失敗です。

  3. 備え3:違っていたら、そのファイルだけ、置きなおす。(手順9のやり方。何度やっても大丈夫です。)それでも直らないとき(置きなおしても何度も0バイトになる、「TLS session resumption …」のエラーがくり返し出る、など)は、そこで手を止めて、GRANTで仲にお知らせください。仲が、成功した方法(TLS 1.2に制限したFTP)で、置く代行ができます。(そのときに、仲にパスワードをお渡しするかどうかは、西田さんがお決めになれます。ブラウザ手順書の11章を読んでからで大丈夫です。)Windowsのパソコンなら、付録BのWinSCPで、同じ「TLS 1.2に制限」を自分で再現することもできます。

⚠ index.html は、いちばん最後に置きます。index.html は、サイトの表紙のファイルです。これが空っぽ(0バイト)になると、サイトが真っ白になります。そのため、ほかのファイルの大きさを全部確かめてから、最後に置いて、もう一度、大きさを確かめます。

6. サーバーにつなぐ

  1. FileZillaの「サイトマネージャー」を開き、左の一覧で「にぃまのサイト」を選んで、接続 を押します。

  2. 「パスワードの入力」の画面が出ます。手順3で作ったFTP専用のパスワードを入れて、OK を押します。(XServerのログインのパスワードではありません。)

    「パスワードの入力が必要です」のような小さな画面。入力欄の文字は黒い丸「●」で出ます

  3. 「不明な証明書」(Unknown certificate)のような画面が出ることがあります(出ないこともあります)。

    • 画面の中の「ホスト」や「サブジェクト」に、*.static.ne.jp や sv17.static.ne.jp のように、ここまでメモしたホスト名と同じ会社のものが出ているかを見ます。
    • 出ているなら、「今後もこの証明書を信頼する」のようなチェックを入れて、OK を押して大丈夫です。(仲が調べたところ、このサーバーの証明書は、正しい認証局が出したもので、エラーなく確認できました。)
    • まったく別の名前が出ているときは、押さずに、画面の写真をGRANTでお送りください。
  4. つながると、画面の上のほうの「メッセージ」の欄(黒い文字や青い文字がたくさん出るところ)に、「ログインに成功しました」や「ディレクトリ一覧の取得に成功しました」のような文字が出ます。右の「リモートサイト」の枠には、「/」と、ファイルの一覧が出ます。

    右の枠の上に「リモートサイト: /」と出て、その下にファイルやフォルダの一覧がある画面(のような画面)

    • メッセージのなかに、「TLS」や「暗号化」といった言葉が出ていれば、暗号化されています(出る文言は、FileZillaの版によって違います)。
    • 右の一覧には、これまでの作業の続きなら、index.html、default_page.png、niimagroup-site-20260930-flat-for-filemanager-1(フォルダ)、niimagroup-site-20260930-flat-for-filemanager.zip などが見えるはずです。これらは消さないでください。
  5. 「つながらない」「ログインできない」ときは、手順11の表を見てください。

⚠ 同じ失敗をくり返さないために:パスワードを何度も間違えると、いったん使えなくなることがあります。3回まちがえたら、手を止めて、手順3の「FTPの利用」で新しいパスワードを作りなおしてください(英数字だけ)。

7. 置くファイルを、パソコンに用意する

⚠ ブラウザ手順書とは、ここが逆です。ブラウザ手順書(ファイル管理)では、zipを開かずにそのままアップロードしました。FTPでは、zipを自分のパソコンで「展開(解凍)」して、中身のファイルとフォルダを置きます。

  1. 次のボタンで、zipファイルをパソコンに保存します(ブラウザ手順書と同じファイルです)。

    ⬇ ここを押して、zipファイルをパソコンに保存する
    niimagroup-site-20260930-flat-for-filemanager.zip(約730KB)

    すでに保存してあるなら、それを使います。必ず、名前が「…flat-for-filemanager.zip」のものを使います。

  2. zipを展開します。

    • Windows:zipファイルを右クリック →「すべて展開」→「展開」ボタン。同じ場所に、同じ名前のフォルダができます。
    • Mac:zipファイルを、ダブルクリックします。同じ場所に、同じ名前のフォルダができます。
  3. フォルダの中を開いて、確かめます。次の4つのフォルダと、ファイルが、すぐ見えることを確かめます。

    • フォルダ:css、donation、form、images
    • ファイル:index.html、404.html、donation.html、form.html、privacy.html、robots.txt、sitemap.xml、favicon.ico

    フォルダの中に、css・donation・form・images の4つのフォルダと、index.html などのファイルがならんだ画面(のような画面)

    ⚠ フォルダを開いたら、さらにもう1つ同じ名前のフォルダしかなかった(入れ子になっている)ときは、そのフォルダの中まで入って、index.html が直接見える場所を使ってください。
    Macで、__MACOSX や .DS_Store という名前が見えても、それは置きません(選ばないでください)。

  4. この、「index.html が直接見えるフォルダ」の場所を、おぼえておいてください。次の手順で、FileZillaの左側(パソコン側)で開きます。

8. ファイルを置く(index.html は最後)

🚫 この作業で、触らないもの
サーバーの上にある .htaccess と .ftpaccess は、サーバーが使う大事なファイルです。選ばない・消さない・名前を変えない・上書きしないでください。default_page.png、…flat-for-filemanager-1 のフォルダ、古いzipも、そのままにしておきます。
理由:.htaccess を壊すと、サイト全体が「500」というエラーで見られなくなったからです(仲が試した結果です)。
今回置くファイルのなかに、.htaccess や .ftpaccess は入っていません。もし、パソコン側のフォルダに見えても、選ばないでください。

  1. 左側(ローカルサイト)で、手順7で用意したフォルダを開きます。左の枠の上にある「ローカルサイト:」の欄に、フォルダの場所(パス)が入っています。その下の木の形の一覧から、展開したフォルダ(index.html が見えるフォルダ)をクリックして選びます。

    左の下の枠に、css・donation・form・images のフォルダと、index.html などのファイルが出ている画面(のような画面)

    右側(リモートサイト)が「/」になっていることも確かめます。

  2. 置くもの(index.html 以外ぜんぶ)を選びます。

    1. 左の下の枠(ファイルの一覧)を1回クリックしてから、キーボードで、すべて選びます。Windowsは Ctrl+A、Macは ⌘+A です。
    2. そのまま、index.html の行だけ、選択をはずします。Windowsは Ctrl キーを押しながら、Macは ⌘ キーを押しながら、index.html の行をクリックします。

    index.html だけ色がついていなくて、そのほかの行(css・donation・form・images の4フォルダと、404.html などのファイル)が色付き(選ばれた状態)になっている画面(のような画面)

  3. 右側にドラッグして置きます。選んだものを、マウスでつまんで、右側の「リモートサイト」の枠(空いているところ)に運んで、はなします。

    • 右クリックのメニューにある「アップロード」を押しても、同じです。
    • 画面の下の枠に、「キューに入っているファイル」として、ファイルの名前がならび、1つずつ消えていきます。全部で、フォルダの中のファイルあわせて21個です。
    • 終わるまで、FileZillaを閉じたり、パソコンを閉じたりしないでください。ふつう、1〜3分ほどです。

    画面の下に、転送中のファイル名が1つずつ出る枠。終わると「成功した転送」のタブに、ファイル名がならぶ画面

  4. 「同じ名前のファイルが、すでにあります」(Target file already exists)という確認が出たときは、置きなおしのときだけの画面です。はじめて置くときは、出ないはずです。出たら、「サイズが違えば上書き」のような項目があれば、それを選んで OK を押します。(なければ、「上書き」を選びます。)ただし、.htaccess や .ftpaccess、default_page.png のことでこの画面が出たら、止めて、写真をGRANTで。

  5. 赤い文字のエラーが出たとき:画面の下の「失敗した転送」というタブを開いて、どのファイルが失敗したかを見ます。置きなおしは、手順9のあとで、やります。エラーが出ても、慌てなくて大丈夫です。つづけて手順9へ進んでください。

  6. ここでは、まだ index.html は置きません。次の手順9で、ほかのファイルが全部正しく置けたことを確かめてから、手順9の最後に置きます。

9. 大きさ(サイズ)を、ぜんぶ確かめる

仲が成功したときも、ここでサイズを照合して、確実さを確かめました。画面にエラーが出なくても、必ずやってください。これが、ファイルが欠けていないことの、いちばん確かな証拠です。

  1. 右側のファイル一覧に、「サイズ」が見えるようにします。右の枠の一覧の上に、「ファイル名」「ファイルサイズ」「ファイルタイプ」…の見出しが出ています。「ファイルサイズ」の列が見えていれば、そのままです。見えないときは、見出しの上で右クリックして、「ファイルサイズ」にチェックを入れます。

    「ファイル名」「ファイルサイズ」「ファイルタイプ」「最終更新時刻」などの列が見える画面。サイズは「16,915」のように、バイト数が出ます(のような表示)

  2. まず、いちばん外側(「/」)のファイルの大きさを、付録Aの表と見くらべます。404.html、donation.html、favicon.ico、form.html、privacy.html、robots.txt、sitemap.xml の7つです。

  3. 次に、右の枠で、フォルダをダブルクリックして中に入り、同じように大きさを見くらべます。css(1個)、donation(1個)、form(1個)、images(11個)です。一覧のいちばん上の「..」をダブルクリックすると、1つ上に戻ります。

  4. まちがい(失敗)の目じるし

    • 大きさが 0(またはほとんど空っぽ)
    • 付録Aの表より小さい(とくに 16,384 のような、きりのよい数で止まっている)
    • 一覧にファイルそのものがない

    1つでも、そのようなものがあれば、次の「置きなおし」をします。全部が表と同じなら、下の「6番目」(index.html を置く)へ進みます。

  5. 置きなおし(失敗したファイルだけ)

    1. FileZillaの左側(パソコン側)で、同じフォルダを開きます(たとえば images が失敗なら、左も、その中の images を開く)。
    2. 左側で、失敗したファイルだけを選んで、右側の同じフォルダ(images の中)にドラッグします。
    3. 「同じ名前のファイルがあります」と出たら、「サイズが違えば上書き」(なければ「上書き」)を選んで OK を押します。
    4. 置きなおしたら、もう一度、右側の大きさを、付録Aの表と見くらべます。
    5. それでも合わないときは、FileZillaの「サーバー」メニュー →「切断」で、いったん切って、もう一度「接続」して、同じことをくり返します。3回やって直らなかったら、手を止めて、GRANTで仲に「どのファイルが、何バイトか」をお知らせください。
  6. ほかのファイルが全部、表と同じになったら、最後に、index.html を置きます。

    1. 左側で、展開したフォルダのいちばん外側に戻り、index.html だけを選びます。
    2. 右側の枠が「/」であることを確かめて、ドラッグして置きます。
    3. 「同じ名前のファイルがあります」と出たら、「上書き」を選んで OK を押します。(最初から入っている、XServerの初期の index.html が、新しいものに置きかわります。これが、正しい動きです。)
    4. 置いたら、右側の index.html の大きさが、16,915 になっていることを確かめます。0 のままのときは、すぐ、もう一度置きなおしてください。(0のままだと、サイトが真っ白になります。)

10. ブラウザで、サイトを確かめる

  1. ブラウザで新しいタブを開き、次のアドレスを開きます。
    https://st221282.static.jp/

    グループにぃまのロゴや写真が入ったトップページ

    公開できたときの、新しいホームページのトップ(見本)
    公開できたときの、新しいホームページのトップ(見本)
  2. 次の3つの点を確かめます。

    • グループにぃまのロゴや写真が、すべてきちんと出ているか(「×」印や、空白がないか)
    • メニューやボタンから「応援(寄付)」のページに進めるか
    • 「お問い合わせ」のページに進めるか
  3. 最初の画面(「このサーバーに、ファイルのアップロードができます。」など)のままのときは、キーボードの Shift キーを押しながら、ブラウザの更新ボタンを押してみてください(Macは ⌘+Shift+R)。

  4. ここまでできたら、GRANTのメッセージで、仲に「FTPでできました」と知らせてください。(うまくいかなかったときは、手順11を見て、画面の写真をGRANTで送ってください。)

※仮のURLでは、ページの裏側の情報(検索やSNSの住所など)の一部が、本番のアドレス(niimagroup.org)になっています。表示の確認には影響しません。「存在しないページ」の案内画面(404.html)も、仮のURLでは本番と見た目が少しちがっていて大丈夫です。

11. 困ったとき

⚠ 困ったら、手を止めて、GRANTのメッセージで仲へ。「どの画面で、何と出たか」を教えていただければ大丈夫です。画面の写真はこちらの方法で撮ってください(パスワードが写らないように)。うまくいかなくても、西田さんのせいではありません。

こんなとき考えられる原因どうするか
つながらない(「接続がタイムアウトしました」「接続できません」) ホスト名の写しまちがい/「FTPの利用」がまだONになっていない(ONにして数分かかることがある)/会社や学校のネットワーク、セキュリティソフトが、FTPを止めている ホスト名(sv…)の綴りを、XServerの画面と見くらべる。5〜10分待ってもう一度。それでもだめなら、メッセージ欄(上のほうの文字)の写真をGRANTで。
「ログインできません」「530 Login incorrect」 ユーザー名(st221282)かパスワードの入れまちがい/XServerのログインのパスワードを入れてしまった パスワードは「FTP専用のパスワード」です。3回までにして、手順3で、英数字だけの新しいFTPパスワードを作りなおす。
右側の一覧が出ない、「ディレクトリ一覧の取得に失敗しました」でとまる データの通り道(パッシブ)がうまくいっていない、または、暗号化の続きがうまくいっていない 手順4で、転送モードが「パッシブ」になっているか確かめる。いったん切断して、もう一度つなぐ。それでもだめなら、メッセージ欄の写真をGRANTで。
「TLS session resumption on data connection failed」のような赤い文字 手順5でお話しした、TLS 1.3まわりの不具合の可能性(推定) FileZillaは、自動で切って、つなぎなおします。そのあと、手順9の大きさの照合をして、足りないファイルだけを置きなおす。くり返し出るなら、手を止めてGRANTで。Windowsなら付録BのWinSCPも使えます。
大きさが0のファイル、途中で止まったファイルがある TLS 1.3での転送失敗(仲が実験で確かめた現象) 手順9の「置きなおし」をする。index.html が0のときは、最優先で置きなおす。
「550 Permission denied」などで置けない 置く場所がちがう/同じ名前の、さわってはいけないファイルを上書きしようとしている 無理に押し切らず、手を止める。右側が「/」か確かめる。.htaccess や .ftpaccess には触らない。画面の写真をGRANTで。
置いたのに、ブラウザで、最初の画面のまま変わらない index.html が置けていない/0バイト/ブラウザが古い画面を覚えている/サーバーの反映待ち 手順9の最後の、index.html の大きさ(16,915)を見る。Shiftを押しながら更新。少し待つ。「無効なURLです。プログラム設定の反映待ち」と出たときは、故障ではありません。30分〜最大1時間待ってから、もう一度。
ロゴや写真が「×」になる、ページが途中で切れる、文字がおかしい images などのファイルが欠けている 手順9で、images の中の11個の大きさを、もう一度、付録Aと見くらべる。違うものだけ置きなおし。
ページが「500」や「Internal Server Error」と出て、見られなくなった サーバーの大事なファイル .htaccess の中身が変わってしまった可能性 それ以上さわらないでください(.htaccess を選ばない、消さない)。画面の写真をGRANTのメッセージで送ってください。仲が控えのファイルで直せることもあります。仲から案内があれば、ブラウザ手順書の10章(ファイルマネージャで .htaccess を元の2行に書きかえる方法)で、西田さんご自身で直せます。案内がないうちは、やらないでください。
「403 Forbidden」の英語の画面 いちばん外側(「/」)の index.html が、なくなっている、または置けていない 右側の「/」の一覧に index.html があるか、大きさが16,915かを見る。なければ手順9の最後をやりなおす。
FileZillaが開かない、インストールできない(Mac:「開発元を確認できません」など) パソコンの安全機能が止めている 設定を変えたり、パスワードを入れたりする前に、画面の写真をGRANTで。

12. 終わったら:FTPパスワードの変更か、FTPをOFFに

🛑 作業が終わったら、必ず、どちらかをしてください。FTP専用のパスワードは、ファイルを置いたり消したりできる鍵です。使い終わったら、使えなくしておくと安全です。

  1. 【A】FTPパスワードを変える

    • XServerにログイン →「サーバー設定」→「FTPの利用」の 変更する
    • パスワードの欄に、前とはちがう新しいパスワード(英数字10文字以上)を入れる(新しいパスワードを、仲に送る必要はありません)
    • 確認画面へ進む → 変更する
  2. 【B】FTPをOFFにする(ふだんFTPを使わないなら、こちらがおすすめです)

    • 「サーバー設定」→「FTPの利用」→ 変更する
    • 「利用設定」を「OFF」にして、確認画面へ進む → 変更する
  3. FileZillaの側も、片づけます。パスワードを「尋ねる」設定にしたので、パソコンにパスワードは残っていません。念のため、FileZillaを閉じてください(Windowsは右上の「×」、Macは ⌘+Q)。

  4. GRANTのメッセージで、「変えました」か「OFFにしました」と、仲に知らせてください。

※サーバーの上にある、最初からのファイル(default_page.png など)や、これまでの作業でできたフォルダ・古いzipは、そのままで大丈夫です。消すかどうかは、あとで、仲と一緒に決めましょう。

画面の写真(スクリーンショット)の撮り方

⚠ 写真に、パスワードが写らないようにしてください。
・「パスワードの入力」の画面や、XServerの「FTPの利用」でパスワードを入れている画面は、撮らないでください。
・FileZillaの上の入力欄に、パスワードが残っていないか、撮る前に見てください。
・どうしても写ってしまったら、送らずに撮りなおしてください。万一、送ってしまったときは、手順12の「パスワードを変える」を、すぐやってください。

Windowsの場合

  1. キーボードの Windows(旗のマーク)キーと Shift キーを押しながら、S を押します。

  2. 画面が少し暗くなります。マウスで、写したいところだけを、斜めになぞって四角で囲みます(パスワードが出ているところは、囲みません)。

  3. 画面の右下に、小さな通知が出ます。それを押すと、写真が開きます。「保存」(フロッピーのマーク)を押して、「デスクトップ」などに保存します。

  4. GRANTのメッセージの画面で、その写真のファイルを選んで、送ります。

Macの場合

  1. キーボードの Shift と ⌘(コマンド)と 4 を、同時に押します。マウスの矢印が、十字の形に変わります。

  2. 写したいところだけを、マウスでなぞって囲みます(はなすと撮れます)。パスワードが出ているところは、囲みません。(「画面全体」を撮りたいときは、Shift+⌘+3 です。)

  3. 写真は、「デスクトップ」に「スクリーンショット ….png」という名前で保存されます。

  4. GRANTのメッセージの画面で、その写真のファイルを選んで、送ります。

うまく撮れないときは

付録A. 置くファイルの一覧と、正しい大きさ

この表は9月30日の版のものです。いまのサイト(10月12日)とは大きさが違います。この作業は終わっているので、使いません。

置いたあとの、右側の「ファイルサイズ」(バイト数)と、見くらべてください。1つでも違えば、そのファイルは置きなおしです。全部で22個(index.html を含む)です。この大きさは、zipの中のファイルの実際の大きさで、確かめ済みの数字です。(FileZillaの表示は、「16,915」のようにカンマが入ることがあります。)

場所ファイル名正しい大きさ(バイト)
「/」(いちばん外側)404.html3,689
「/」donation.html6,623
「/」favicon.ico2,229
「/」form.html6,635
「/」privacy.html5,899
「/」robots.txt68
「/」sitemap.xml452
「/」(最後に置く)index.html16,915
css フォルダstyle.css11,037
donation フォルダindex.html449
form フォルダindex.html437
images フォルダapple-touch-icon.png24,739
imagesfavicon-32.png2,194
imageslogo.webp47,054
imagesnishida.jpg6,016
imagesogp.jpg90,172
imagesstep-1.webp50,378
imagesstep-2.webp41,010
imagesstep-3.webp69,348
imagesstep-4.webp46,240
imagesvoice-m.webp30,764
imagesvoice-r.webp35,328

※「/」に、index.html(16,915)のほか、7つのファイル。css 1個、donation 1個、form 1個、images 11個。合計 8+1+1+1+11=22個。

付録B.【Windowsだけ】もうひとつのソフト「WinSCP」を使う場合

⚠ これは、手順5で心配した「TLS 1.3」を、自分で止められるソフトです。FileZillaで、サイズが合わないことがくり返されたときの、予備の予備です。Windows専用です(Macでは使えません)。🔶仲はWinSCPの画面を実際に動かして確かめてはいません。公式の説明書にもとづく内容なので、画面は「〜のような画面」とお考えください。

  1. 公式サイト https://winscp.net/(アドレスが winscp.net であることを確かめます)から、WinSCPのインストーラーを入れます。広告のボタンや、別のサイトのダウンロードには、ご注意ください(手順1と同じです)。

  2. WinSCPを開き、新しいサイトの画面で、次のように入れます。

    • ファイルプロトコル:FTP
    • 暗号化:TLS/SSL 明示的な暗号化(TLS/SSL Explicit encryption)
    • ホスト名:sv17.static.ne.jp  ポート番号:21
    • ユーザ名:st221282  パスワード:FTP専用のパスワード(保存しない)
  3. 「設定」(Advanced)→「TLS/SSL」のページで、「最小TLS/SSLバージョン」も「最大TLS/SSLバージョン」も、TLS 1.2 にします。(WinSCPの公式説明書に、「最大のバージョンを制限できる。とくにTLS 1.3は新しく、正しく動かないサーバーがある」と書かれています。)

    「最小TLS/SSLバージョン」「最大TLS/SSLバージョン」の2つの選択欄がある画面(のような画面)

  4. あとの手順(置く順番、index.html は最後、サイズの照合)は、FileZillaと同じです。WinSCPでは、サイズが、ファイル一覧の「サイズ」の列に出ます。

💬 困ったら、手を止めて、GRANTのメッセージで仲へ。
「どの画面で、何と出たか」を教えてもらえれば大丈夫です。画面の写真を送っていただけると、いちばん早いです(パスワードが写らないようにしてください)。

ドメイン(niimagroup.org)の引っ越しとは別の話です。この手順は、新しいホームページを、仮のアドレス https://st221282.static.jp/ に置くだけです。ドメインのお引っ越しは、ドメインお引っ越しの手順(全27)で進めます。

出典:エックスサーバー社(XServer Static)の公式マニュアル「FTPソフトの設定」「FTP仕様一覧」(ホスト名・ユーザー名・ポート21・FTP over SSL・ホスト初期フォルダは空欄・FileZillaの案内)、FileZilla公式サイトとドキュメント(入手先・設定項目・パッシブモード・TLS 1.3のチケットの記録)、WinSCP公式ドキュメント(TLS/SSLページ)。ボタンの名前や画面は、各社の都合で変わることがあります。