ＨＰ制作後について困っております。

すみません素人です。上手く説明出来るかわかりませんが、アドバイスお願いします。
業者に制作してもらいました。文章の変更など簡単な更新は自分でやろうと思います。
ＦＦＦＴＰと言うソフトで左のフォルダで修正したものを右にアップロードしてますが、
アップロード前に確認が出来ないみたいな感じなんです。
ＦＦＦＴＰのソフト以外で、アップロード前に、修正したものの確認方法など無いでしょうか？
修正後サーバーに反映する前に、確認したいのです。

No.1 回答者： adobe_san 回答日時： 2016/04/13 13:53

ありまっせ〜！

これがえぇんとちゃう？
http://www.adobe.com/jp/products/dreamweaver.html
プレビュー見ながら修正でけまっし、サイトとの同期もでけま！
一々修正したのを手作業でUPせんでもえぇんでっせ〜！
同期ってすれば「常にサーバーのコピーが手元にる」んでっせ〜！
あんさんには持って来いのソフトなんだわ！

この回答へのお礼

回答ありがとうございます。
試してみます。

お礼日時：2016/04/13 15:14

No.2 回答者： naokita 回答日時： 2016/04/13 14:43

ブラウザで確認後に、アップロードするけど、何か問題でも？

FFFTPの前に、何のソフトでテキスト編集してるの？

メモ帳やテキストエディタで編集すると思うけど、
その後に、
編集する時（エクスプローラーのファイル一覧）の、そのファイルをWクリックすれば、
（もしくは右クリック→開く→各ブラウザで開く）
（便利なエディタだと、F12キーで出来るとか。もしくは割り当てる）
ブラウザが立ち上がって、修正後の画面が表示される。

更に修正する場合/した場合は、
その画面のまま「F5キー」か「更新ボタン」で、修正後の画面がリロードされて新たに表示される。

この回答へのお礼

回答ありがとうございます。

自分の編集方法です。
FFFTPを立ち上げ、左該当フォルダを右クリック
ノートパッドで修正→上書き
上書きした場合元に戻せないかと思うので
それで困っております。
つまり上書きする前に変更後のHPなど見れないかと
思います。

お礼日時：2016/04/13 15:05

No.3 回答者： naokita 回答日時： 2016/04/13 15:50

#2です。

お礼への回答：

一手間掛かりますが、
FFFTPの起動は最後のアップロード時で良いです。
面倒でも、エクスプローラー（PCのフォルダから）から、ファイルを立ち上げるようにくせをつけましょう。
そこから#2回答の方法で編集します。
ただ、

ご利用のメモ帳は、最低限の機能しかなく、
１回しかUNDO(戻す事)できないので、
他のテキストエディタ（無料でも良い）をDLして利用しましょう。

※ 要「テキストエディタ」で検索（機能や好みで選びましょう）

その初期設定で、メモリが許す限りのある程度「元に戻す機能」(UNDO)が出来るテキストエディタが多いので、
編集後、内容が気に入らなかったら、UNDOしましょう。

※ 上書き保存しても、ファイルを閉じなければUNDOできます。
大抵は、パソコンのキーボード（割当）で、
「Ctrl+Z」でUNDO出来ますし、ボタンで「元に戻す」もあるでしょう。

それが難しいなら、もう１つ別ファイルを開いて、最初に全部コピペ（バックアップ）しておけば良いのでは？

この回答へのお礼

ありがとうございます。

お礼日時：2016/04/13 16:11

No.4 回答者： narative_h 回答日時： 2016/04/13 16:40

FFFTPの画面内からファイルを開いているのですね。

私がもしやるとしたら以下の方法です。

左側は自分のパソコン内にあるファイルなので、
もちろんFFFTPを介さずに編集できます。
その場所は、添付した画像の赤い←の部分に示されています。

仮にaaa.htmlというファイルを編集し、アップロードすると考えます。

自分のパソコンのaaa.htmlのある場所にたどり着いたら、編集する前にコピーをとっておきます。
aaa.htmlというファイルをコピーして、
「aaa元ファイル.html」という名前で保存しておきます。
そしてaaa.htmlをノートパッドで開き編集します。

あらためてFFFTPで画面を更新して見て下さい。

aaa.html
aaa元ファイル.html

というように二つのファイルが見えると思います。
そしてaaa.htmlの方をいつも通りアップロードします。
もし、元に戻したかったら自分の環境にある「aaa元ファイル.html」を
aaa.htmlの名前に戻してすぐサーバへアップロードします。

自分のパソコン内に過去のファイルを残しておくことがポイントです。

この回答へのお礼

回答ありがとうございます。
ベストな方法ですね。

お礼日時：2016/04/13 17:19

No.5 回答者： gugutto3 回答日時： 2016/04/13 17:38

上書きする前に別名で保存して、修正前、修正後を確認してから、アップロードして、サイト上で名前を変更するか、パソコン上で名前を変更して（上書きするか、以前の名前はリネームして残しておいて）アップロードします。

この回答へのお礼

回答ありがとうございます。

お礼日時：2016/04/14 00:42

No.6 回答者： whtg001 回答日時： 2016/04/16 02:01

FFFTPの左がPC内で、右がサーバー内ですので、左側のPCにあるindex.htmlをブラウザで開いてみてください。

なお、サーバー側のプログラムとして動作する、ｘｘｘ.plやxxx.phpはブラウザだけでは開けません。開けるのは、xxx.html xxx.htmのファイルです。

おおまかにはこれでUPするまえに確認できます。

No.7 ベストアンサー 回答者： ORUKA1951 回答日時： 2016/04/17 09:21

基本は、おっしゃるとおりFTPソフトでダウンロードしたのち、変更を確認してアップロードになります。

その時に、そのサイト全体のファイルをダウンロードしておく必要があります。
￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
★ただし、それを考慮したつくりになっていないと不可能です。(後述)

ローカル側に、そのサイト全体を保存するフォルダーを作成します。のちのために絶対にしておくこと。
サーバーの階層に合わせること
1) とりあえずはこちら・・
FTPで見た構造
ftp://******/user/vit/homepage/
とかになっていたら、必ず
D:/user/vit/homepage/
にしておきます。
　このフォルダーにすべてを入れておきます。
同様に同じ階層にフォルダーごとコピーします。
D:/user/vit/homepage_Backup/
　これはバックアップ用で手をつけません。(間違いを防ぐために読み取り専用にしておくとよい)

そしたら、先のフォルダに戻り、編集したいファイルをエクスプローラで見つけてテキストエディタで編集して上書きする。
★テキストエディタは高機能なものを使うこと。ちなみに私はEmEditor( https://jp.emeditor.com/ )です。
　　３か月試用できるし、Free版もある。無限に元に戻れますし・・。テキストエディタ自体にプレビューや指定したブラウザで開くボタンを指定できますが、

【注意】
　プロの製作の場合はこれでは表示確認ができない事が多いと思います。
1) 拡張子が.htmlであってもHTMLファイルでないことが多い。
　私は、CGIやPHP、あるいはSSIで動作させる場合も拡張子は.htmlにしています。
　CGI: Common Gateway Interface サーバーで動作するプログラム
　　Common Gateway Interface - Wikipedia( https://ja.wikipedia.org/wiki/Common_Gateway_Int … )
　PHP: ppとして動作するファイル
　　PHP: Hypertext Preprocessor - Wikipedia( https://ja.wikipedia.org/wiki/PHP:_Hypertext_Pre … )
　SSI: Server Side Includes　定型部分はインクルード(よそから読み込んで埋め込むとか)
　　Server Side Includes - Wikipedia( https://ja.wikipedia.org/wiki/Server_Side_Includes )
　サーバーに.htaccessという拡張子だけのファイルがあれば、それで設定します。

2) 関連ファイルが絶対パスになっている。
　例えば、
　ページ内の画像が<img src="/images/abc.jpg" width="" height="" alt="">
　スタイルシートへのパスが<link rel="stylesheet" href="/styleSheet/standard.css">
　さらにはリンクが、<a href="/prodacts/abc/">製品1</a>
　　これらの場合はローカルでは適用できません。また、最後の例のように**abc/ となっている場合もそのフォルダーにあるindex.htmlなどにはリンクしません。

これを確実に確認するために、ローカル側のパソコンにHTTPサーバーをインストールする必要があります。
上記の例でいうと
file:///D:/user/vit/homepage/index.html
を書き直したら、テストの時は、
http://vit26770.localserver/
などで、テストしなければならないからです。

SSIである　.html ファイルの例
＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
<body>
　　<header>
　　　　<h1>テスト</h1>
<div class="abstract">
　　　　<p>
　　　　　　当社では、・・・【中略】・・・などを専門に扱って来ました。
　　　　</p>
</div>
　　　　<nav>
<!--#include virtual="/SSI/header_navigationList.htm" -->
　　　　</nav>
　　</header>
￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
と書いてあって、ローカルサーバーを経由すると
「/SSI/header_navigationList.htm」にある文章を置き換えてくれる。絶対パスなのでどの階層においてもよい。
＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
<body>
　　<header>
　　　　<h1 id="title"><a href="/"><img src="/images/logo/address.gif" width="200" height="68" alt="一屋刃物店"></a></h1>
<div class="abstract">
　　　　<p>
　　　　　　当社では、・・・【中略】・・・などを専門に扱って来ました。
　　　　</p>
</div>
　　　　<nav>
　　　　　　<ul>
　　　　　　　　<li><a href="/index.html">Top</a></li>
　　　　　　　　<li><a href="/News/index.html">ニュース</a></li>
　　　　　　　　<li><a href="/index.html#prodacts">製品情報</a></li>
　　　　　　　　<li><a href="/knowledge/index.html">***の知識</a></li>
　　　　　　　　<li><a href="/Information/index.html">会社概要</a></li>
　　　　　　　　<li><a href="/Contact/index.html">質問</a></li>
　　　　　　</ul>
　　　　</nav>
　　</header>
￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
と書き換わる。
　この方法だと、全く同じ内容が複数のページに書かれているときに、いちいち修正しなくてよくなる。

★私は、Cygwin( https://ja.wikipedia.org/wiki/Cygwin )をつかって、HTTPサーバー(apache)やperl,PHPなども含めてテストできるようにしていますが、その環境を整えるのは、素人さんにはあまりにもハードルが高いでしょう。
　クライアント側にそれを仕込んだパソコンを提供することもある(パソコン込みで10万円加算)

結論：
　テキストエディタは高機能なものを用意しましょう。
　必要部分を書き換えたら、ファイル名を変更してアップロードして試しましょう。
　　index.html でしたら、index.htm でも、indexNew.htmlでもよい。
　　表示を確認したら、古いほうを削除して、新しいほうの名前を変更しましょう。

　たぶん、この方法しかないと思います。

★ちゃんとした製作会社なら、通常はメンテナンス用のCGIやCMSを入れておいてくれるはず。
　管理者としてそのCGIで必要な部分を書き換えるとか。あるいはCMS( https://ja.wikipedia.org/wiki/%E3%82%B3%E3%83%B3 … )の管理画面でメンテナンスできるように最初からCMSでサイト作りをする。