2

代码示例：

无页面导航：

<body>
   <nav>
      // Navigation links to the parts of the site.
      // Clicking a link calls a javascript function to display the relevant <div>
   </nav>
   <section id="page1">
      // Page 1 content
   </section>
   <section id="page2">
      // Page 2 content
   </section>
</body>

页面导航：

// Page1.php:
<body>
   <nav>
      // Navigation links to parts of the site.
      // Act as normal <a> tags, redirecting the browser to the new page
   </nav>
   <section>
      // Page1 content
   </section>
</body>

// Page2.php:
<body>
   <nav>
      // Navigation links to parts of the site.
      // Act as normal <a> tags, redirecting the browser to the new page
   </nav>
   <section>
      // Page2 content
   </section>
</body>

链接导航的优点：

  • 浏览器不需要一次加载整个网站

  • 无需 javascript 即可使用该网站

  • 提供直接 URL 以便于导航

  • 似乎是标准的做法

javascript 导航的优点：

  • 对于具有大量服务器端脚本的站点（例如我的），最大限度地减少页面请求

  • 不需要在不同的地方使用相同的代码（<nav>例如元素）。在 PHP 中创建一个echo_nav_html()函数并不是一个好的解决方案，因为它使在 IDE 环境中的编码变得烦人

  • 初始加载后，站点速度超快，因为几乎没有任何新请求发送到服务器

哦，明智的互联网，对此有什么想法吗？

或者也许更优雅的解决方案提供列出的 javascript 导航的优点？

4

2 回答 2

2

最好的解决方案是两者都做。

在锚点上的 HREF 上具有有效链接，但包括加载 div 并禁用 HREF 进度的 onClick 操作。

阅读有关优雅降级和渐进增强的信息。

提供非 JavaScript 代码的原因有很多。并非所有浏览器都支持 JavaScript。许多企业网络仍然使用旧版本的 IE，它们的行为可能无法预测，或者它们可能会强制配置完全禁用 JS。

您希望您的网站可供所有人使用，但要为那些拥有支持它的技术的用户提供尽可能好的体验。

于 2013-02-16T19:50:09.607 回答
0

如果您使用大量服务器端代码（假设这意味着动态内容生成/填充），我可能会使用指向其他页面的链接，因为我无法想象加载您最初可能在网站上访问的所有内容负载是真正的资源效率，特别是假设不是每个用户都会访问网站的任何部分。

您仍然可以使用 javascript，但我只会在实际请求时生成内容；无论是通过 AJAX 调用（因此在那里调用 URL）还是加载新页面。在运行时加载所有内容对我来说似乎有点浪费......但这只是我。

于 2013-02-16T19:38:58.460 回答