用户服务统一性，虽然社招、校招求职者所关注的点不同，但归根结底，核心的用户需求依然是最关注企业提供的岗位信息；

　　在确定站点统一性之后，项目组进一步考虑了如何合理、清晰的进行在社会招聘、校园招聘的交互区分以及结构层级的区分，同时又不影响整体的统一性体验感。前后共手绘了多种交互原型，经过讨论，最终梳理如下：

社会求职、校园求职的需求同等重要，都是核心工作，在流程中分别是单独进行，所以社招、校招的网站结构都定位为一级栏目，职位都分别进行排列；

招聘网站首页建设中的社招、校招，类似于主站点法院、检察院等行业用户，逻辑上既需要有联系，同等，又需要进行明显的区分；

华宇的工作环境、培训、薪资待遇等等不论社会求职者、校园求职都是非常关心，所以独立设置一级栏目。

　　四、响应式设计，小屏，你好！

　　随着移动互联网的蓬勃发展，多屏互动已成为引领科技的潮流趋势，watch、phone、pad、PC、TV等等不同的设备都有各自的操作系统、屏幕分辨率、清晰度以及屏幕定向方式，而不断被研发着的各种新设备也将带来更多的屏幕尺寸规格。怎样才能做到让一种设计方案满足所有情况？so,响应式设计来了！

　　1.web产品响应式说明

　　移动端页面延续了PC端的简洁风格，使得用户在浏览页面时，更容易的快速获取信息。优化后的辅助图形菜单，在形象表达菜单含义的同时，用户也更加容易点击这些对比鲜明的色块。

　　PC端常用的是固定布局和弹性布局，前者设置一个绝大多数电脑能正常显示的固定宽度居中显示，后者则采用百分比。而现在的移动平台日新月异，为了让网页适应各种屏幕分辨率需要避免使用固定尺寸。

使用 viewport meta标签在手机浏览器上控制布局

通过使用媒体查询可以根据获取到访问者的设备类型和设备分辨率，我们为不同分辨率的用户提供不同的访问体验。

在服务器后台，我们通过分析用户请求的头部信息，将PC端用户和移动端用户分别导向不同的页面。

移动端的页面较之PC端页面使用的图片更少，最大限度的降低了网络流量，并在样式文件中大量使用了CSS3属性，使页面布局更加灵活。

　　2. 移动端响应式设计

　　1、抛弃传统的像素单位，采用全用单位值 rem，采用百分之数值，运用伪元素，让页面更加灵活，代码更加少

（百分数，伪元素运用）

　　2、响应式页面设计，让页面自动适应各种屏幕，视窗变动页面会随着变动，引入全新媒体查询的应用，让页面真正实现响应式

（大分辨率效果）

（小分辨率效果）

　　3、运用css3全新属性替代图片，减少http请求数，加速页面运转，同时降低用户访问页面流量，运用css3动画让页面更加绚丽。

（过度效果运用，渐变效果，旋转效果等的运用让页面更加生动）

　　4.运用全新HTML5标签，优化SEO搜索引擎，让页面运转速度更快，更稳定

　　5.引入jQuery mobile 框架，让页面更加稳定，性能更加优越，访问速度更快

　　6.移动端端，新型meta标签的运用，让页面可兼容各种移动端设备

　　项目成效：