在网站中添加菜单的良好做法？

Question

我对网站建设很陌生。但是在LaTeX和其他一些编程语言方面确实有一些经验。

我真的尝试重用代码等。因此，在构建我的网站时，我想“包含”，例如其他页面中的菜单，而不是明确地将其复制粘贴。

我知道有几种方法可以做到这一点：

• 菜单是静态页面，您的内容位于iframe中。这是最糟糕的方式，因为它打破了很多东西，比如后退/前进......（我知道对某些人来说可能是个好听的，但在我的情况下却不是这样）。

• 这就是我现在使用的：每个网页都包含使用iframe的菜单：

  <iframe src="menu.html" class="menu" height="100%" frameborder="0"></iframe>
  

  此方法的缺点是：当人们重新访问您的网站时，菜单无法正确重新加载，除非您使用某些专门告诉浏览器执行此操作的脚本：

  document.getElementById('some_frame_id').contentWindow.location.reload();
  

• 这是我想到的，因为我的新主持人允许这样做：包括使用SSI的菜单。

  < !--#include virtual="/menu.html"-->
  

  可能的缺点是每个网页都必须允许包含，因此必须进行解析（这会减慢文件系统的速度）。安全对我来说不是问题。

你会推荐什么？是否有礼貌的规则应该做什么？ 是否与上述任何方法存在兼容性问题？有更好的方法吗？

例如：我怀疑第二种方法（我现在正在使用）打破谷歌索引，所以只有我的主页被索引。 （我不确定这是否属实）。

Answer 1

这样做的方法是使用像Server-side这样的东西。其他Web开发人员可能正在使用PHP或Python或某些模板系统，但最终设计模式是HTML输出是重复的，但模板系统中的HTML不是。

您对SSI放慢渲染的担忧是没有根据的。 SSI非常快，Web服务器将采用与呈现一页相同的优化;它可以将其缓存在内存中并动态处理。

鉴于您只是想避免重复的HTML，SSI听起来是一种很好的方式，特别是如果您已经让它适合您。它的缺点是缺乏高级编程功能。但速度基本上不是SSI的问题;它是那里最快的解决方案之一。它也不会影响谷歌索引; Google只会看到输出的HTML，而不是SSI。 SSI是服务器端。

Answer 2

为什么不使用JQuery菜单？ http://archive.plugins.jquery.com/projects/plugins?type=44

Answer 3

在HTML5中，您可以使用Object标签轻松完成此操作，例如

<object data=menu_page.html type="text/html" style="usual css..." ></object>

您必须使用css指定位置，宽度和高度。 因此，如果它是结构html而不是文本内容，您可以使用style="z-index:-1;position:absolute;top:0;left:0; width:100%;height:100%"

将其放在背景图层中

这似乎适用于最新的浏览器（在Safari和Chrome上进行测试）

优于SSI的一些优势：

• 客户端可以缓存经常重复的页眉页脚，减少带宽使用。
• 您可以在浏览器中离线查看您的页面，无需任何服务器。

Answer 4

1。）管理此方法的一种快速方法是使用DreamWeaver模板。任何HTML块都可以制作成模板。您可以在网站的任何页面中使用模板。模板作为DreamWeaver内的资源进行管理。编辑模板，DreamWeaver会更新站点页面中使用该模板的所有位置。该工具不是免费的。其他免费技术如下：

2。）Velocity模板引擎驱动apache.org网站上的大量页面。您可以使用ANT生成您的网站。 http://velocity.apache.org/engine/devel/webapps.html

3.。）如果您正在使用Java做任何事情......请查看JFS和Facelets。 http://www.ibm.com/developerworks/java/library/j-facelets/