Webディレクトリに最適なフォルダー構造は何ですか?


9

私は何年にもわたってWeb開発を行っており、常に次のようなWeb構造を作成しています。

public_html/login.php
public_html/css/login.css
public_html/js/login.js
public_html/img/logo.png

他の人が使うのを見てきました:

styles/login.css
images/logo.png

そして最近、同僚が好きだということがわかりました。

public_html/a/login.js   - application
public_html/s/login.css  - styles
public_html/i/logo.png   - images
public_html/p/photo1.jpg - photos
public_html/f/menu.swf   - flash

1バイトまたは2バイトを保存する以外に、これらのオプションには利点または欠点がありますか?このコンセプトのベストプラクティスはありますか?


リクエストごとに、追加のフォルダー:テンプレートの場合は「t」、xmlの場合は「x」
St. John Johnson

回答:


6

私はあなたの現在のシステムに固執しますが、私は自分とほぼ同じ名前を使用しているので、偏見があるかもしれません。

3文字のフォルダー名を保持することは意味をなすのに十分なほど詳細ですが、URLを整理するのに十分なほど簡潔であることがわかりました。

各フォルダーを1文字に切り詰めるのはやり過ぎです。mc10が指摘しているように、広く解釈の余地があります。たとえば、JavaScriptファイルの場合は「a」を選択しませんでした。「動作」の場合は「b」を選択しました。私はどちらももっと正しいとは思いません、それは命名体系がどれほど曖昧であるかを指摘するだけです。

フォルダ名として「スタイル」と「画像」を使用することは完璧ですが、短い名前を使用する方がはるかに理にかなっています。すべてのファイル、すべてのURL、リクエストでそのフォルダーが参照される回数を考えてください。バイトが増え始めます。確かに、短いフォルダー名を使用することで実際の帯域幅が節約されるとは思わないでしょうが、取得できるすべてのビット(およびバイト)を使用します。

私は通常、これらのいくつかのフォルダーに固執します。

  • js -JavaScriptファイル
  • img-画像ファイル
  • css -CSSファイル
  • lib-出力を生成しないサーバー側スクリプト。ライブラリ、クラスなど
  • doc-通常のページナビゲーションの一部ではない、OfficeドキュメントやPDFなどのバイナリファイル

2

CSSおよびJSフォルダーは、静的にコード化される(別名HTMLのみ)可能性がある個々のサイトには適していますが、CMSを使用する大規模なサイトには実用的ではありません。

CMSは、独自のフォルダー構造で「スタイル」フォルダーと「画像」フォルダーを使用しますが、通常はサブディレクトリー内に埋め込まれています。これはコンテンツをレイアウトするための優れた方法であり、多くのCMSに好まれています。

1文字のフォルダ名を使用すると混乱を招きます。一見すると、写真(p)と画像(i)の違いに戸惑っていただろう。a「アプリケーション」の使用も不可解なようです。


1

個々のファイルではなく、CSSとJSにフォルダーを使用するかどうかは、プロジェクトの範囲に完全に依存します。

複数のスクリプトまたはスタイルシートがある場合、または必要になる可能性がある場合は、それらをフォルダに整理すると、サイトの保守と管理が容易になります。

フォルダを使用することにした場合、これらの長い名前または短い名前を付けることは個人的な好みです。

1文字の名前はバイトを節約し、少しすっきりと見える場合がありますが、私の経験では、サイトで作業している人が少数の場合、混乱する可能性があります。


1

このメソッドを実行することもできます。

最初の方法:

  • / i / common /
  • / i / layout /
  • / i / lib /
  • / i / misc / docs / pdf /
  • / i / misc / docs / csv /
  • / i / misc / docs / txt /

注:各ファイルをmd5サマリーで修正するのが最適です。

例:

  • /i/common/9df48e2cf2d25740e4ba54e8cd73b3a3.png、
  • /i/layout/2b33962041cb835c227bba27424a28af.css、
  • /i/lib/a8a2a48ddaa95527c6d3db763e2b7809.js、
  • /i/misc/docs/pdf/68aafcfe9aa1ab7d83a6ce8df302155e.pdf

2番目の方法:

  • / assets / common /
  • / assets / templates / template_name /
  • / assets / includes / js /
  • / assets / misc / pdf /
  • / assets / misc / csv /
  • / assets / misc / txt /

注:ファイルの名前をmd5文字列に変更する必要はありませんが、すべてのスペースはダッシュ/-で置き換える必要があります

  • /assets/common/uploads/2014/12/company-site-has-been-launched.jpg

3番目の方法:

  • / site / files /
  • /サイトのレイアウト/
  • / site / scripts /
  • / site / misc / docs / pdf /
  • / site / misc / docs / csv /
  • / site / misc / docs / txt /

備考:public_htmlの「common」フォルダサブディレクトリで、その後に新しいサブディレクトリを作成し、ワードプレスがアップロードを整理する方法と同じように、アップロードしたファイルに「uploads / 2014/12 /」という名前を付けることができます。


1
フォルダー構造の例が気に入っていますが、md5ハッシュを使用してファイルに名前を付けることはお勧めできません。画像ファイルを変更すると、md5が変更されるため、サイト全体を修正する必要があります。代わりに、覚えやすい名前を付ける方がはるかに安全です。
Richard
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.