Question

让我们说我已经完成了包含所有CSS和JavaScripts的index.html文件，我想创建一些其他的文件，例如：＆＃34;联系＆＃34;，＆＃34;关于我们＆＃34 ;，＆＃34;音乐＆＃34;等

他们都必须进入与index.html相同的根文件夹。嗯，这对我来说没关系，因为那里没有那么多，但子类别怎么样？就像音乐一样，我希望有10种不同的genres.html，其中包括20多名artist.html等等。这将完全聚集我的根文件夹。将它们放入子文件夹也不起作用，因为所有到集中资源的链接（如：CSS文件，图像，JavaScript）都会中断。并且必须手动调整每个绝对路径也是一种痛苦。我试了一次<base>，但它搞砸了其他事情。

组织网站页面结构（最好没有CMS）的最佳和最简单的方法是什么？

Answer 1

如果有可能使用PHP，您可以使用这样一个非常简单的脚本：

{root}/index.php

<?php

if(!isset($_GET['route'])){     // If no route is given
    require_once 'pages/index.html';    // Load the default index page
}else if(!file_exists('pages/' . $_GET['route'] . '.html')){        // If an route is given, check if the page exists
    require_once 'pages/404.html';      // If not, load an 404 page
}else{
    require_once 'pages/' . $_GET['route'] . '.html';   // Or else load the given route
}

网址将是这样的：

www.yoursite.com/index.php?route=index（页面文件夹中的index.html）

www.yoursite.com/index.php?route=contact（pages / contact.html）

www.yoursite.com/index.php?route=catalog/category/something/list（pages / catalog / category / something / list.html）

这是一个非常简单和基本的PHP，使用所谓的$_GET变量（More about that here）

所有请求都将由您网站根目录下的index.php进行操作。

因此，您的JS和CSS文件的include链接将始终来自根目录。因此，您无需担心所有不同的路径。

如果您需要更多帮助，请询问。

<强>更新

你的文件夹结构可能是这样的：

root/
    css/
    js/
    img/
    pages/
        music/
            artist.html
        something/
            else/
                stuff.php
        index.html
        contact.html
    index.php

而不是$_GET['route'] . 'html'，您也可以只使用$_GET['route']并将文件扩展名附加到网址。这样您就可以使用所有不同类型的文件扩展名。（www.yoursite.com/index.php?route=music/artist.php）

或者您可以将.html更改为.php。这完全取决于你！

Answer 2

我用PHP在PHP的帮助下设计我的页面结构。以下是我将如何做到这一点：

模板页面

您可以制作自己的模板，只填写内容：

<?php
$root = "";
require_once $root . 'class/page.php';
$page = new Page();
?>
<!DOCTYPE html>
<html>
    <head>
    <?php
    $page->metaTags();
    $page->metaDescription("");
    $page->metaKeywords("");
    $page->defaultStyles();
    $page->addStyle("styleName");
    $page->title("your page title");
    $page->defaultScripts();  
    ?>
</head>
<body>
    <?php
        $page->navigation();
        $page->header();
        $page->openContainer();
        $page->openContentSection();
    ?>
    Your page content
    <?php
        $page->closeContentSection();
        $page->closeContainer();
    ?>
</body>
</html>

现在，网页课程将处理布局和链接，以便您可以在一个位置进行更改，但仍会影响网站中的所有网页。

Page class

class Page{

    private $db;
    private $root;
    private $terms;

    public function __construct() {
        $this->db = new db();
        ...
    }

    public function metaDescription($desc){
        echo '
        <meta name="description" content="' . $desc . '" />';
    }

    public function defaultStyles(){     
        echo '
        <link href="' . $this->root . 'css/bootstrap.min.css" rel="stylesheet" />';
    }

    ....
}

现在，页面可以放在您想要的任何位置，您只需将$ root设置为您的绝对网站网址，无论您的文件保存在何处，所有包含都将是正确的。

如何组织HTML文件结构？

2 个答案: