UE Design | 回顾官网3.0迭代-分析篇-样式分析-京东云开发者社区

<center>![](//img1.jcloudcs.com/developer.jdcloud.com/e1b40e38-6d6e-4a25-a1a6-4fd0423e67ea20210128145550.gif)</center>

#### 样式分析
banner、运营位、解决方案、服务市场、合作伙伴、footer不再详细阐述，基本是趋于雷同或是次要楼层，主要针对产品、数据中心地图以及导航样式来阐述。

**导航：——平铺**
阿里、腾讯、AWS的导航形式基本一致：
1. 所有产品平铺；

2. 阿里和腾讯均在导航上增加了热门产品的推荐；

3. 均设有“全部导航”，也支持响应式，值得点赞；Azure和京东云现有的导航样式更像，属于层级式的隐藏导航；
<center>
![](//img1.jcloudcs.com/developer.jdcloud.com/0bc74975-7401-48ec-bdd3-57775084f5c720210128145801.png)</center>

**产品楼层：——扩展强 直观**
阿里、腾讯、AWS的产品楼层形式基本一致，相较于京东云的产品楼层，此种形式扩展性强；Azure的产品楼层并无分类，更直观的展示了产品。
<center>![](//img1.jcloudcs.com/developer.jdcloud.com/342e4caa-578d-4e8a-a584-0fe9ca816fb220210128145912.png)</center>

**数据中心地图：——内容丰富**
阿里云的地图虽然展示的内容不多，但每个点都可点击进入单独的数据中心页，此页面有详细的介绍；

腾讯云hover在每个点上时，会出现此点的节点名称，另外有入口支持点击进入单独的数据中心页；

Azure相对比较简单，更类似京东云当前的形式；

AWS也稍偏于简单，在下方有节点的简单介绍，支持点击进入单独数据中心页；

#### 总结
阿里、腾讯、Azure的导航平铺式，一目了然且很好扩展；产品楼层，无论是阿里还是Azure的形式，都具有很强的扩展性，都可做参考；对于地图楼层，相比较而言，阿里云和腾讯云有独立数据中心页面的模式更具说服力。

<center>![](//img1.jcloudcs.com/developer.jdcloud.com/c299465e-fb24-462b-ac44-11d1165edea620210128150051.png)
</center>
<center>![](//img1.jcloudcs.com/developer.jdcloud.com/f0997eac-98fd-4ee7-b07b-8791e4419d7e20210128150102.png)</center>
<center>![](//img1.jcloudcs.com/developer.jdcloud.com/c299465e-fb24-462b-ac44-11d1165edea620210128150051.png)
</center>
<center>![](//img1.jcloudcs.com/developer.jdcloud.com/69d23779-70d3-4f46-aa19-b0f63551aa0f20210128150119.png)</center>