加载选项卡式内容的最佳方式

Question

我正在努力更改一个网站上的会员资料用户界面。项目页面：http://design.vitalbmx.com/user_menu/member_profile2.html

目标：

可用性：必须优化页面加载时间，尤其是活动标签中的图像 SEO：标签内的分页链接必须是可抓取的

假设：

• 默认情况下，大多数用户会转到“全部”标签
• 大多数用户很少点击“全部”以外的其他标签
• 大多数用户不会将链接发送到分页选项卡，只会发送到任何给定选项卡的第一页

实施方案：

1. 所有选项卡的内容一次加载到同一页面上。通过 Ajax 进行分页（为爬虫提供现有页面的 URL）。可能的问题 - 如果在页面 URL 中设置了第一个选项卡以外的选项卡的图像加载延迟（例如 #videos）

2. 首先加载的第一个选项卡（“全部”）的内容。仅在单击其他选项卡时才加载其他选项卡的内容。问题 - 额外的 HTTP 调用以及为第一个选项卡以外的选项卡加载图像的延迟

3. 所有选项卡的内容都加载到同一页面上，但在图像开始加载之前，图像源被替换为当前选项卡以外的选项卡的通用图像。单击另一个选项卡时（或加载当前选项卡图像后）图像源将恢复为原始并开始加载（有点像 Mashable.com，但没有烦人的淡入效果）

4. 无 Ajax - 每个选项卡的专用页面。搜索引擎优化比可用性更有意义。易于复制粘贴发送带有分页的 URL。

哪一个是最好的？还是我错过了什么？

Answer 1

我认为你应该拒绝。 4，因为这样可以减少服务器和客户端的负载。