使用AJAX的单页动态网站的设计和SEO

J.B*_*J.B 3 html javascript ajax seo sitedesign

我设计了一个网站,整个网站都包含在一个页面内(index.php).在页面内,<section>标签定义了网站的不同部分(家庭,联系人,博客等)

通过始终可见的按钮实现导航,单击时使用javascript更改部分的可见性,以便任何时候只显示一个.

更具体地说,这是通过使用url中的哈希并处理hashchange事件来完成的.这会产生诸如www.site.com/#home(默认情况下,如果没有其他哈希)和www.site.com/#contact等网址.

我想知道这是不是一个好的设计.它有效,但我觉得必须有一个更好的方法来实现同样的事情?为了澄清,我的目标是一次加载所有主要内容的网站,以便在初始加载后没有更多的页面加载,并且在各个部分之间移动会更加平滑.

除此之外,还引入了另一个关于SEO的问题.该网站在谷歌显示出来,但是如果举例来说,搜索查询中包含的特定部分的术语,它仍然加载默认#home页面点击后,没有特定的部分术语被发现.怎样纠正呢?

最后,其中一个部分是博客部分,它是唯一一次不加载所有部分的部分,因为默认情况下它会从数据库加载最新的帖子.当用户从列表中选择不同的帖子(其本身是使用AJAX加载)时,AJAX用于获取和显示新帖子,pushState更改历史记录.同样,为了给每个帖子提供一个可以在外部引用的唯一URL,菜单会更改由javascript处理的URL,从而产生诸如www.site.com/?blogPost=2#blog和之类的URL www.site.com/?blogPost=1#blog.

谷歌根本看不到这些帖子.使用Googlebot工具显示抓取工具将博客部分视为始终为空,因此没有任何博客帖子被编入索引.

我能改变什么?

(我不知道这是不是应该在网站管理员堆栈交换上,如果它在错误的地方就很抱歉)

Que*_*tin 5

建立一个普通的网站.为每个页面提供一个普通的URL.让Google为这些网址编制索引.如果您没有Google要编制索引的页面,则无法将您的内容编入索引.

使用JS/Ajax逐步增强站点.

当遵循链接(或执行其他操作,没有JS,将加载新页面)时,使用JavaScript将当前页面转换为目标页面.

用于pushState将URL更改为在未使用JavaScript时已加载的URL.(这样做而不是使用片段identifer(#)hack).

确保您收听历史事件,以便在单击后退按钮时可以将页面转换回来.

这会导致以下情况:

  1. 用户/foo从Google 到达
  2. /foo包含/foo页面的所有内容
  3. 用户点击链接 /bar
  4. JavaScript的改变页面的内容以匹配用户会从到会得到/bar直接将网址/barpushState

请注意,这里也是(不推荐)hashbang技术,它黑客单页网站成为一个形式,谷歌可以索引,而这是不稳健,不进行任何其他非JS客户端工作,几乎是一样多的工作做得好.