管理静态 HTML 网站中重复代码的最佳方法是什么
我正在管理一个遗留网站，其中有很多静态 HTML 网站，没有服务器端脚本，只有纯 HTML/CSS，最少的 javascript。 我发现在不同页面中多次更改同一段代码非常浪费时间。 例如，当菜单中的某些内容发生更改时，由于菜单只是每个文档中的静态文本，因此我必须多次进行相同的更改。
我想知道最小化这种开销的最佳策略是什么，换句话说，您会推荐什么来管理跨多个静态 HTML 页面的导航代码等内容。
我知道您可以使用：
- 服务器端脚本（如 PHP），但没有其他理由在该特定站点使用脚本。
- 框架（但这很糟糕，因为它..好吧，框架:)）
- 服务器端包括（似乎在更改服务器时可能会导致麻烦）
- javascript（不利于SEO）
您会推荐什么？
谢谢。
I am managing a legacy website with a lot of static HTML websites, no server side scripting, just plain HTML/CSS, minimal javascript. I found it a huge waste of time to change the same piece of code numerous times in different pages. For example, when something in the menu changes, since the menu is just static text in each document, I have to make the same change numerous times.
I was wondering what the best tactic would be to minimize this overhead, in other words what would you recommend for managing things like navigation code across multiple static HTML pages.
I know you can use:
- server side scripting (like PHP), but there is no other reason to use scripting at that particular site.
- frames (but that's bad because its.. well, frames :))
- server side includes (that seems like it could lead to trouble when changing the server)
- javascript (bad for SEO)
What would you recommend?
Thanks.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（17）
在所有可能性中，无论是您列出的还是我所知道的其他任何内容，我仍然会使用一个简单的基于 PHP 的解决方案来运行。 它既简单又干净，几乎不需要您付出任何努力。 我对我设计的所有小网站都这样做。
大多数情况下，您最终会得到相当琐碎的结构。 您写了一个完整的页面，然后对于每个后续页面，您只需更改内容所在中间的位即可。 在这种情况下，只需将内容上方和下方的所有内容保存在 header.php 和 footer.php 文件中，然后放入
位于每个内容文件的顶部（与页脚文件类似）。 完毕！这确实有一些小缺点。 其一，您依赖于脚本，但 PHP 是世界上部署最广泛的服务器端语言，因此这并不是真正的问题。 您甚至不关心它是 PHP4 还是 PHP5，因为您没有做任何花哨的事情。
对于两个，您在每个页面加载时运行一个脚本，以便提供本质上是静态文件的服务。 这会减慢您的响应速度，并对 CPU 造成不必要的压力。 这可能并不重要（延迟很小），但如果您发现它很浪费，有一些很好的 PHP 框架可以使用 PHP 生成的页面并为您生成静态 html。 （这也很容易自己完成，只需使用输出缓冲进行一些工作即可。）这样您就可以两全其美 - PHP 模板（以及完整的 PHP 语言，如果您最终想要一些更奇特的东西） ），但静态 html 页面可实现最少的 CPU 活动和最快的页面加载时间。
Out of all the possibilities, both what you listed and anything else I know of, I'd still just run with a simple PHP-based solution. It's easy and clean, requiring next to no effort on your part. I do this with all the small sites I design.
Most often, you end up with fairly trivial structure. You write up a full page, then for each subsequent page you're just changing the bit in the middle where the content lives. In that case, just take everything above and below the content and save it in header.php and footer.php files, then put
<?php require_once "header.php"; ?>at the top of each content file (and similarly with the footer file). Done!This does have some minor disadvantages. For one, you're depending on scripting, but PHP is the most widely deployed server-side language in the world, so that's not really an issue. You don't even care if it's PHP4 or PHP5, since you're not doing anything fancy.
For two, you're running a script on every page load, in order to serve what is essentially a static file. That slows down your responses, and stresses the CPU unnecessarily. This probably doesn't matter much (the lag is very minor), but if you find it wasteful, there are some good PHP frameworks which will take your PHP-generated pages and generate static htmls out of them for you. (This is easy enough to do yourself, too, with just a bit of work using output buffering.) This way you get the best of both worlds - PHP templates (and the full PHP language if you end up wanting something fancier down the line) but static html pages for minimal CPU activity and fastest page load times.
您可以使用静态站点生成器。 我推荐 jekyll。
You can use a static site generator. I recommend jekyll.
如果您打算维护静态站点，我建议使用静态站点生成器。
我过去使用过的一个是 webgen
从 webgen 页面：
If you are set on maintaining a static site, I would recommend using a static site generator.
One I have used in the past is webgen
From the webgen page:
您可以使用 PHP 预处理您的网站，然后上传生成的静态 HTML 文件。
You could preprocess your website with PHP and then just upload the generated static HTML files.
我已经很久没有使用它了，但 Dreamweaver 是一个很棒的工具使用静态站点。 它有一个模板/重复区域机制，用于此目的使用注释。
编辑添加：一点谷歌搜索唤起了我的记忆。 Dreamweaver 具有与 ASP.NET 母版页类似的模板。 对于其他内容，它使用 库和资产。 由于这是一个静态站点，因此您应该能够以便宜的价格购买旧版本的 Dreamweaver 来满足您的需求。
编辑 2：我对 Dreamweaver 情有独钟。 如果 StackOverflow 是 Experts Exchange 的反面，那么 DW 就是 FrontPage 的反面。 Adobe 就是 Adobe，目前他们可能已经添加了足够的功能来有效地削弱它。
It's been a long time since I've used it, but Dreamweaver was a great tool for working with static sites. It had a templating/repeating region mechanism that used comments for this purpose.
Edited to add: A little Googling jogged my memory. Dreamweaver has templates that are similar to ASP.NET master pages. For other content, it uses the metaphors of a Library and Assets. Since this is a static site, you should be able to pick up an older version of Dreamweaver on the cheap that meets your needs.
Edit 2: I have a soft spot for Dreamweaver. If StackOverflow is the anti-Experts Exchange than DW is the anti-FrontPage. Adobe being Adobe, at this point they've probably added enough features to effectively cripple it.
可能没有任何其他原因使用服务器端脚本，但减少编写的代码量肯定是使用它的一个很大的原因，您不认为吗？ 这将使网站的维护更加高效。
There may not be any other reason to use server side scripting, but certainly reducing the amount of written code is a pretty big reason to use it wouldn't you think? It would make maintaining the site much more efficient.
一般来说，我推荐 PHP - 它对包含的处理正是您所需要的，并且它使任何动态的东西都更容易管理。
找到安装了 PHP 的主机也非常容易。
In general I'd recommend PHP - its handling for includes is exactly what you need, and it makes anything dynamic much, much easier to manage.
It is also extremely easy to find hosting with PHP installed.
您可以使用 sed 批量编辑包含相同页面元素的文件。
You could use sed to batch-edit files containing the same page elements.
正如其他人所说，静态站点生成器是最佳选择。
DocPad 是新的静态站点生成器，使用 Node.js 和 CoffeeScript 它能够支持尖端标记，例如咖啡脚本，coffeekup、jade 和 stylus 以及通常的 markdown 和haml 支持等。
如果您对静态站点生成器概念完全陌生，并且想了解什么是模板引擎和元数据，读一下这篇文章。
As everyone else has said, a static site generator is the way to go.
DocPad is new static site generator, built with Node.js and CoffeeScript it is able to support cutting edge markups like coffeescript, coffeekup, jade and stylus along with the usual markdown and haml support among others.
If you're completely new to the static site generator concept, and would like to know what templating engines and meta-data are, give this article a read.
使用 PHP 的最大问题是什么？ 在我看来，使用简单的 PHP include 可以节省大量时间，而不是编辑大量文件。 这说得通。
除此之外，另一种选择是将其制作在一页上，然后将其复制并粘贴到其他页面。
What is the big problem with using PHP? In my opinion using an easy PHP include could save you a lot of time instead of editing numerous files. It makes sense.
Other than that the othe roption is making it on one and then copy and pasting it to the other pages.
每当我的客户向我展示此类网站时，我都会使用 PHP。 您可以轻松地将所有重复出现的 HTML 放入一个文件中并通过函数调用它，或者将其放入单独的文件中并通过 include/requires/what you have 调用它。
最重要的是，如果您为谁维护网站，希望有某种方式让他们自己添加内容。 您已经拥有足够的必要框架来使他们变得非常简单。
I would use PHP whenever my clients would present me with websites of this sort. You can easily put all of the recurring HTML in one file and call it via functions, or put it in separate files and call it via includes/requires/what have you.
Best of all, if whomever you are maintaining the site for, wishes to have some way that they can add content themselves. You already would have enough of the necessary framework in place to make it very simple for them.
我过去曾使用 Webby 来完成此任务，并且对它的简单性感到非常满意减少重复。
I've used Webby for this in the past and was very satisfied with how easy it made things and reduced duplication.
我想说，内联框架非常适合像菜单这样出现在每个页面上并且需要在每个页面上更新的内容。 只要去掉边框，调整大小就可以了。
I'd say an inline frame can be just fine for something like a menu that appears on every page and needs to be updated on every single one. Just remove the frameborder, size it properly, and it should be good.
我会将所有可抓取的内容放入 HTML 中，然后使用 javascript 生成重复内容。 就像这样：
所以您需要做的就是设置标题并在每个页面中编写主要内容。 其余的（无论如何，爬虫可能对此不感兴趣）是由 JS 生成的。
I would put all crawlable content into the HTML, then generate the repetitive content using javascript. So something like this:
So all you need to do is setting the title and writing the main content in each page. The rest (which is probably not interesting to crawlers anyway) is generated by JS.
我认为易用性和速度之间的合理折衷首先包括服务器端包含，然后是 PHP。
至于 PHP，我建议您使用 Apache2 模块的 auto_append_file 和 auto_prepend_file 指令来包装内容。
I think a reasonable compromise between ease and speed would encompass Server-Side-Includes first, then PHP later.
As for PHP, I'd suggest you wrap the content by using auto_append_file and auto_prepend_file directives for the Apache2 Module.
//你的内容放在这里
//Your contents are placed here
您可以不使用 php 而是使用 javascript 包含静态网页。
这是一个例子：
you can include static webpages without using php but instead bu using javascript.
here is an example :