hello,大家好，欢迎大家收听收看本期的咨道一课，今天爆老师继续和大家分享seo和ux做的不错的网站案例。这是一家外国卖轮胎的厂商叫做Bridgestone。介绍这个网站前我要先讲一种网站设计的理念，英文叫做parallax effects,中文翻译为视差滚动效果。
那什么是视差滚动效果呢？当我们看这个网站时候，把鼠标往下移，你会发现整个页面会显示不同的区域板块。随着鼠标往下移的过程中进行改变，从不同板块里推不同的产品。所以我们把这种视觉效果叫做“视差滚动效果”。
但是通常情况下使用parallax effect对seo是不友好的。主要的原因是它要使用很多的JS效果，APP插件，或是一些Ajax功能。所以说这些功能性的代码或是插件都是对seo不友好的。如果很多网站都使用这种parallax效果的话，对seo非常不利。但对于bridgestone而言，恰恰它在seo的顾虑点上是做的非常好的。
在我们分析这个网站前，首先给大家看另一个带有视差滚动效果的网站（money matter），这个网站做的是非常漂亮。我演示的主要目的是这类网站对于视觉表达非常不错的，最终给与用户所表述的信息或是产品记忆点非常深。但问题是看它代码时，所有的代码对seo不友好，搜索引擎无法抓取，有超多的样式代码。虽然能让用户兴奋，但是无法给搜索引擎产生辅助效应。
回到我们刚才的网站，虽然它用了很多的视差效果在里面，但在seo点上做的很周到。比如这里的英文内容，粘贴后看源代码，能在h1的标签里看能被抓取到。又假使我们打开这个版块下的4个链接，这链接的文本也是能被抓取的到的。看到吗？这些栏目文字在p标签里标注出来了。包括它上端对于浏览器兼容做了优化，做了配置，代码非常简明。大家可以借这样的模板和例子用到自己的网站上去。
我们再打开这个版块里的链接“fuel saving performance”省油版块。它会打开下一级页面，你看它的色彩和布局都是非常棒的。call to action感觉非常清楚，上面给到整个主题是能被抓取的，给到三个小插图，这些插图和fuel saving主题很相关。化学元素，绿色环境，加油界面，这都是体现省油的主题。
在回到主页，我们能看到它上端做的logo的返回做的也很不一样。它做的是融合，不是一点传统的单体。而且当我们页面往下拉的时候，它是悬浮在中间的，导航非常容易。另外随着版块的不同，颜色会发生变化。之前fuel efficient是绿色的，在越野的界面就是红色表示粗狂的感觉，冰天雪地就是蓝色冷色调。还有下面footer的导航，中端也是悬浮，拉倒最下面的时候就是固定在某个节点上。
所以我们可以参考一下这个网站，在做一些动态网站的时候，怎么把一些视觉效果融入进去同时不忘一些seo的元素在里面，让我们seo和ux可以共存。好了，这就是爆老师本节的课程，希望大家喜欢，我们下期再见啦！
