响应式网站设计,你踩过哪些坑?

  近两年,微软、苹果、华为、三星等企业纷纷将网站转换为响应式网站,响应式建站逐渐成为行业主流。不过很多设计师对响应式网站的概念和交互并没有深入的领悟,导致在网站建设中,出现了响应式网站效果不佳的现象。在设计响应式网站过程中,你踩过哪些坑呢?

一、网站在所有平台的激活方式都一样?

对于所有设备,无论他们需要怎样的输入方式,都需要用户以某种方法来激活某个页面。对于鼠标,就是点击;对于触控设备,就是滑动;对于键盘,就是敲击。还有声音、在空中挥动手臂等激活方法。很多设备往往提供多种交互方式。对于各种设备,其共同点就是必须通过激活动作来完成某件事。

我们曾经假设所有人都使用鼠标。当鼠标移至上面时显示内容,移开后则隐藏内容。当内容只有通过鼠标操作才能显示的话,那对于没有鼠标的触控设备该怎么办呢?不同设备要有不同的解决方案。下面看看这个下拉菜单。

当鼠标停在主菜单项上,子菜单便出现。此外,你还可以点击它打开该链接。现在,你在触摸设备上敲击该菜单项,会发生什么?子菜单出现了吗?链接激活了吗?两者都发生了?还是发生了其他事情呢?在iOS上,其他事情发生了。你第一次敲击该链接时,子菜单出现了,即引发了鼠标停在主菜单项上的事件。但你需要再敲击一下这个链接,才能打开它。

我们可以针对不同的输入设备定义不同的交互方式但更好的办法是确保默认的交互方式适用于所有设备

二、一个网站布局通用所有设备?

直到最近,很多建站公司都是这样设计网站的:在顶部放上带有Logo的Banner图和导航,将子导航放在左边,右边放一些小部件,页脚放在底部。当所有这些完成后,我们再把内容塞在中部的小小空间中。这就好像我们对我们的内容很不自信,尝试提供一些用户可能会喜欢的其他东西。

我们应该专注于中间的部分,保证它正常工作,看起来美观、具有可读性。确保所有人理解它,发现它有用。

一旦你完成了内容部分,你可以自问一下,该内容确实需要一个Banner?Logo?子导航?它必须要有一个导航吗?它确实需要所有的这些小部件吗?显然最后一个问题的答案是“不”。我不理解这些小部件有什么用。在我看来,没有任何小部件更美观。

从内容开始着手,可以帮助我们找出很多有趣的解决方案。例如,Logo确实需要放在每页的顶部吗?在很多网页中,放在页脚部分效果可能更好,如在数字类型的导航中,或在注册页面中。子导航中的很多链接放在主要内容区域的效果可能更好。

当观看页面布局时,主要导航比主要内容更重要吗?大部分情况下,并不是。我通常认为导航属于页脚内容,在页面顶部放一个“跳转”链接可以把访问者引导至导航处,也可获得导航,并将其显示在顶部。

三、我们需要考虑更多的使用场景

在响应式Web设计时代,我们需要很多新的、聪明的解决方案。根据不同的屏幕大小和设备对它进行优化,之后再针对特殊属性进一步优化,如鼠标的使用,针对胖手指的设计。我们不仅仅为使用笔记本的CEO设计,还为在火车上或使用免费Wi-Fi的人设计。

现在的网站设计与以前已大不同。固定、单一的交互方式已不再适用。我们的设计过程需要新的起点。除了上文提到的,还有很多。就拿我们常用的表单来说吧,它足够用一系列文章来讲述。希望大家在设计过程中,可以创新出更多好方法。

说了这么多,那有没有一些简单的方法呢?有的,经过小编多次试用,目前国内拥有多年行业经验的北京万网正玉技术服务中心就专注于响应式网站研发,目前已经研发出很多套成熟的响应式网站设计搭建系统,一次设计建站自动适配所有屏幕。

 

支付宝转账赞助

支付宝扫一扫赞助

微信转账赞助

微信扫一扫赞助