2015-06-21 47 views
3

對於一個基本的靜態網站,有幾個頁面和子頁面,我對HTML頁面的目錄結構的最佳實踐感到困惑。如何正確構建我的HTML文件?

說我有這樣一個簡單的網站:
一個索引(家)頁面,關於,聯繫和新聞頁面。在新聞頁面上,有兩條鏈接指向新聞頁面的兩個子頁面fizz.html和buzz.html

是否最好將所有的HTML頁面放在同一個根目錄文件夾中,如下所示?

Ex。 1

/foobar.com 
    /css 
    /js 
    index.html 
    about.html 
    contact.html 
    news.html 
    fizz.html 
    buzz.html 

或者,它最好能有在這樣一個單獨的目錄文件夾的所有子網頁?

Ex。 2

/foobar.com 
    /css 
    /js 
    index.html 
    about.html 
    contact.html 
    news.html 
    /news 
    fizz.html 
    buzz.html 

或者是它最好能有與子頁面的任何頁面都在它自己的文件夾也是這樣嗎?

Ex。 3

/foobar.com 
    /css 
    /js 
    index.html 
    about.html 
    contact.html 
    /news 
    news.html (maybe named index.html?) 
    fizz.html 
    buzz.html 

如果採用實施例1的方法, 3是最好的組織方式,你想離開news.html,還是改名爲index.html?在後者的情況下,有多個名爲index的html文件是不好的?有沒有由此造成的SEO問題呢?

我目前有我的測試網站按照Ex。 2,這導致了一個問題,例如:如果用戶在www.foobar.com/news/fizz.html,並且他們想要返回到新聞頁面,如果他們碰巧從清除「fizz.html」網址,它不起作用。

所以我猜測前。 3是構建網站的正確方法?我在這裏有點困惑。

回答

1

爲了簡化您的網站,我會說Ex。 1會爲你工作。如果你開始增加更多的複雜性和更多的頁面,像Ex這樣的安排。 3會更好。

要回答您的問題的後半部分,我會將news.html轉換爲Ex。中新聞目錄下的index.html。 3,只是爲了讓事情更有條理。如果您在沒有索引文件的情況下導航到新聞目錄,則很可能會收到禁止消息或訪問該文件夾。

2

沒有最好的做法,當我來構建它是什麼對你來說有意義/最容易管理。 「生根」一切可能是目前最簡單的方法。

這就是說,你正在試圖完成的一般稱爲'路由',即解決資源'漂亮'的網址。大多數服務器端框架可以默認完成這項工作,但是當你寫一些靜態的時候,實現類似目的的唯一方法是:

  1. 調整你的。htaccess文件
  2. 依賴於JavaScript框架

角具有路由作爲一個插件但是如果你想要的東西更輕量級的,你可以考慮reactJS(如demo'd):

https://enome.github.io/javascript/2014/05/09/lets-create-our-own-router-component-with-react-js.html

或者以下任何一種(mithril將是另一個不錯的選擇):

http://microjs.com/#routing

+0

謝謝!我也一直在忙着使用.htaccess。最終我會給Angular或試試看。 – MetalEscape

0

您應該在分層目錄中管理您的內容,以便您可以跟蹤您的內容。大多數開發人員在那裏管理這樣的內容。

/foobar.com 
/css 
/js 
/images 
/html 
     /news 
      /news_content 
       fizz.html 
       buzz.html 
      news.html 
     about.html 
     contact.html 
index.html