アーキテクチャとファイル名変更について教えて下さい。

質問

アーキテクチャという構造を知りＨＰに取り入れようと思います。
例えば　トップ→商品一覧→赤いペン　となっている時　
●●●.jp/shouhin/redpen.html
と掘り下げていきたいのです。「赤いペン」のページで「ファイル名の変更」→「shouhinn/redpen」というようにただ単にshouhin/を付ければ良いと思っていたのですが、変更できませんでした。
色々なサイトを拝見しましたがアンダーバーで区切っているページも見ましたが意図は同じなのでしょうか？
なにかファイルを結び付けるような作業がいるのでしょうか？ちなみに
ビルダー９で編集中です。
御親切な方教えて下さい。よろしくお願いします。

回答No.3

abril · ベストアンサー

> ＦＴＰツールでやると「shouhin」というディレクトリは作成できるのですが、そのディレクトリの中に「red pen」ファイルを移動することができないのです。そもそもビルダーで「shouhin」というディレクトリを作ってないからですかね？

というかつまり、FTP転送の際「サイト丸ごと転送」とか何とかいう感じのモードを使用されているのだと思いますが、その場合、ローカル側とWebサーバ側の階層構造が一致していないとNGなのでは。手動でやれば、Webサーバへの個別のファイルアップもディレクトリ移動も可能です。

仮に、質問者様のサイトの”ホーム”ページ（Webサイトと同じ意味で使われている方ではなく、「サイトの顔」という本来の意味の）が"http://www.hoge.co.jp/index.html"だったとします。であれば、通常考えられるディレクトリ構成としては以下の様なパターンが多いかと思われます（あくまで一例です）。
───────────────────────────────────
public_html（←"http://www.hoge.co.jp/"に相当する部分だと思って下さい※1）
├ index.html（←サイトのトップ、所謂”ホーム”ぺージ）【1】
├ shouhin（←「商品」に関するディレクトリ）
│ ├ index.html（”商品一覧”ページ）【2】
│ ├ redpen.html（”赤いペン”ページ）【3a】
│ └ bluepen.html（”青いペン”ページ）【3b】※3
├ company（←「会社案内」に関するディレクトリ）※2
│ ├ index.html（会社概要）
│ └ history.html（年表）
└ sitemap.html←（”サイトマップ”ページ）※3
───────────────────────────────────
※1：ご契約のホスティング・サービス、プランによってこのディレクトリの名称は様々です。
※2：構造の考え方をわかりやすくする為の、仮のディレクトリの一例です。
※3：同じくファイルの一例。

つまり、質問者様が意図されている「トップ→商品一覧→赤いペン」という構造は、
先ず”ホーム”ぺージ【1】から質問者様のサイトに入り、次に「商品」というカテゴリへのリンク【2】をクリックして”商品一覧”ページ【2】に入り、更にその「商品」カテゴリ内に収められた個別商品ページである”赤いペン”ページ【3a】や”青いペン”ページ【3b】を”商品一覧”ページに貼られたリンクを辿って順に訪れて行く…
というイメージではないかと思います。

イメージできましたでしょうか？
もし上記の様な構造にしたいのであれば、

> ビルダー９では作成済みの「shouhin」というファイルを一旦削除し「shouhin」というディレクトリで作成すればよいのでしょうか？

「「shouhin」というファイルを一旦削除」してしまったら”商品一覧”ページに相当するファイルがなくなってしまいますから、削除してはいけません。先ず「「shouhin」というディレクトリ」を意図する階層に作成し、その上で「「shouhin」というファイル」をその中に移動させ、更にそれがインデックス・ぺージであるならば（この場合”商品一覧”ページですのでその様に考えるのが妥当でしょう）、"index.html"というファイル名にリネーム（ファイル名を変更する、という意味です）する、という手順です。

ただし、階層を移動する、という事は必然的にその移動したHTMLファイルから参照している関連ファイル（画像やCSS・JavaScriptなどの外部ファイル）の位置や、リンクの場所も変わる為、それらを移動先からみて正しい位置に指定しなおしてやる必要がありますので、注意して下さい。

お礼

解決しました。
有難う御座いました。

補足

abril様何度も詳しい内容有難う御座います。
説明していただいたどおりの「構成」で間違いありません。私のページは
├ index.html（←サイトのトップ、所謂”ホーム”ぺージ）【1】
│ ├ shouhin.html（”商品一覧”ページ）【2】
│ ├ redpen.html（”赤いペン”ページ）【3a】
│ └ bluepen.html（”青いペン”ページ）【3b】
という状況で「ディレクトリ」が無い状況なので作成したいのです。しかしビルダー９の操作で分からず、「ヘルプ」→「検索」→「ディレクトリ」では出てこないのです。御指摘された【「shouhin」というディレクトリ」を意図する階層に作成し、その上で「「shouhin」というファイル」をその中に移動】という文面ですが、どうやって「階層に作成」し移動すればいいのでしょうか？というのも「新規ページ作成」で作ってもまた.htmlになってしまうので。。。
本当に初心者ですみません。
参考URLとかあったら教えてください。
宜しくお願い致します。

回答No.2

abril

> FTPで調整するのですね。

いや、ANo.1様が仰っているのはそういう事ではなく…
おそらく質問者様は、URLが意味しているところの「ディレクトリ名」と「ファイル名」の違いを正しく認識しておられないのではありませんか？

"●●●.jp/shouhin/redpen.html"で言うなら、"●●●.jp"は「ドメイン」、"shouhin"はそのドメイン直下の「ディレクトリ」、"redpen.html"が「ファイル」です。「赤いペン」というページの実態は最後の"redpen.html"だけであり、それより上の記述は「赤いペン」というファイル（ページ）がどの住所（置き場所）になるかを示しているだけです。

> 「赤いペン」のページで「ファイル名の変更」→「shouhinn/redpen」というようにただ単にshouhin/を付ければ良いと思っていたのですが、変更できませんでした。

「ただ単にshouhin/を付ければ良い」と思っていたのでは、変更できないでしょうね。そのファイルの階層を変えることと、ファイル名を変える事は全く意味が違います。そして、ファイル名には"/"は入れられません。

> アンダーバーで区切っているページも見ましたが意図は同じなのでしょうか？
> なにかファイルを結び付けるような作業がいるのでしょうか？

「アンダーバーで区切っているページ」は「ファイルを結び付けるような作業」をしているわけではありません。「アンダーバーで区切」られた部分＝ディレクトリ名（階層）であり、「ファイル」は最後に表示される部分（".html"という拡張子で終わらないものも沢山ありますが、それについては省略します。多分混乱されるだけなので）だけです。

なので、コンテンツの階層構造はローカル上（ご自身のPC上等）でも、アップロード先（Webサーバ上）でも原則同じにしておく事が一般的です。
FTPの段階でいちいち質問者様が思われている？様な「調整」しているわけではありません。

補足

階層構造の意味が理解できました。。。
指摘されてるように「shouhin」も「redpen」もすべて一つのファイルで作成していました。
ビルダー９では作成済みの「shouhin」というファイルを一旦削除し「shouhin」というディレクトリで作成すればよいのでしょうか？
ＦＴＰツールでやると「shouhin」というディレクトリは作成できるのですが、そのディレクトリの中に「red pen」ファイルを移動することができないのです。そもそもビルダーで「shouhin」というディレクトリを作ってないからですかね？
頑張ってみます。

お忙しいのに有難う御座いました。

回答No.1

noname#77845

●●●.jp/shouhin/redpen.html
はftpでアップデートする場所に、
shouhin
というディレクトリを作成し、そのディレクトリの中に
redpen.html
というファイルがあることを意味しています。

因みに、これは単にディレクトリ構造を表しているだけであり、「アーキテクチャ」そのものではありません。
アーキテクチャは、もっと広い意味で、基本設計や設計思想を表す言葉です。

お礼

FTPで調整するのですね。
最近読んだ本で階層(アーキテクチャ)を深めた方がロボットが理解しやすいとかいてありましたので・・・
初心者でＨＴＭＬをかじったばかりです。もっと沢山本読んで勉強します。
御親切にありがとうございました。