设计网页的常见问题

  不断增加的网页功能会导致需求和交付之间的延迟，这会让设计逐渐变得臃肿，将各类新闻、链接以及图片塞进同一页面只会使其显得杂乱不堪，导致用户难以阅读及导航。下面济南天琥教育介绍设计网页的常见问题，希望对您有帮助。

  一、乏味无趣的加载页面

  随着技术的进步，时间对于人们来说越来越宝贵，为了一个20M的网页在浏览器前静静坐上1分钟等待加载，那大多数用户都会有关掉它的冲动，因为我们会在这个过程中无数次怀疑这个页面是不是卡住了。如今的网站加载需要的是速度和效率，这符合当前的真实用户需求。给用户提供即时的位置、时间和响应对一个出色的产品来说很重要。

  解决办法：

  如果你的网站在加载速度上有问题，首先应该加载页面中较轻的元素，以及整个框架，然后使用加载器将较大和较重的元素逐步填充进去。这样一来，用户就不会觉得页面卡在那儿，而是在逐步加载了。

  缓冲应该尽量避免，如果它必须存在，那就应该有趣一点。加载页面可以是一个加载进度条，一个为浪费用户等待时间的道歉或者是配有文案的简单动画。

  二、设计臃肿，内容杂乱

  不断增加的功能会导致需求和交付之间的延迟，这会让设计逐渐变得臃肿。将各类新闻、链接以及图片塞进同一页面只会使其显得杂乱不堪，导致用户难以阅读及导航。

  解决办法：坚持增加必要且有价值的功能，尽量避免内容混乱多余。

  三、对移动设备不够友好

  智能手机已经成为人们在互联网上获取内容的较佳途径。大家的多数出站流量很可能都指向智能手机或者平板电脑。如果各网页没有针对移动设备进行优化，那么可能会面对难以进行正常访问等问题。

  解决办法：让你的网页代码适应各种手机、平板等不同分辨率大小

  四、无限滚动

  无限滚动的出现，终于解决了移动端上查看繁复的分类页的问题。不过与此同时，无限滚动的设计，还为我们创造了不少从未遇到的新问题。举个例子，当你要访问一个重要的页面，而它正好在长滚动页面的底部，撇开加载页面的时间和流量不谈，滚到底部去找就已经是一个很头疼的事情了。

  解决办法：就像超大的导航菜单一样，想要让它发挥作用一样有合理的解决方案。将传统的移动端页面和无限滚动两种模式结合起来使用，让用户自己来选择更适合自己的模式，这有助于提升页面的可访问性。

  设计网页布局的原则

  第1条 尽量使用单列而不是多列布局

  单列布局能够让对全局有更好的掌控。同时用户也可以一目了然内容。而多列而已则会有分散用户注意力的风险使你的主旨无法很好表达。

  第二条 合并重复的功能而使界面简洁

  在整个网站开发期间我们会有意无意地创建很多模块，版面或者元素，而它们的功能可能有些是重叠的。此种情况表明界面已经过度设计了。时刻警惕这些冗余的功能模块，它无用且降低了电脑性能。此外，界面上模块越多，用户的学习成本就越大。所以请考虑重构你的界面使它足够精简。

  第三条 将不同区域的颜色区分出来

  颜色，层次及模块间的对比这些视觉上的设计可以很好地帮助用户浏览你的网站：他时刻知道当前所处的页面以及可以转到哪些页面。要传达这样一个好的界面，你就需要将可点击的元素(比如连接，按钮)，可选择的元素(比如单选多选框)以及普通的文字明显区分开来。在下图的例子中，我将点击操作的元素设置为蓝色，选中的当前元素为黑色。这样适当的设计可以让用户很方面地在产品的各模块间切换。但千万不要把这三种元素设计得混乱不堪。

  第四条 界面要有鲜明对比,让人容易区分

  把主要功能区从界面中突出显示出来效果会好很多。使你的主要口号醒目有很多种方法。经过明暗色调的对比来突显。经过为元素添加阴影渐变等效果让界面富有层次感来张显主题。较后，你甚至可以在色相环上专门选择互补色(比如黄色与紫色)来设计你的界面，以达到突出重心的目的。综合所有这些，较后得到的界面会使你的主要意图与界面其他元素有明显的区分，得到完美的呈现。

  第五条 把界面做得环环相扣要好过直白的排版

  一个平淡无奇行文无疑会让用户失去兴趣而继续阅读。是的，单列滚动的长页面是不错的，但是我们应该适当地设置一些小节，并且环环相扣，来提高用户的兴趣使其继续阅读。但需要注意的是节与节之间的留白不要太大。

  第六条 让界面平滑显示而不要死板地呈现

  用户进行操作过程中，界面上的元素会经常出现，隐藏，打开，关闭，放大缩小移位等。给这些元素增加些自然的动画，淡入淡出效果不但美观，也更符合实际，本来元素尺寸位置的变化就是一个需要时间的动画过程。但要注意动画时间不要设置过长，那样会让想尽快完成操作的用户不耐烦。

  第七条 过多边框会让界面四分五裂

  过多边框会喧宾夺主。不用说，边框确实在划分区域进行版块设置时有很大的作用，但同时其明显的线条也会吸引走用户的注意力。为了达到划分版块又不转移用户注意力的目的，在排版时可以将界面上不同区域的元素经过空白进行分组，用上不同的背景色，将文字对齐方式进行统一，还有就是为不同区域设置不同的样式。当使用所见即所得的界面设计工具时，我们经常在界面上方便地拖出很多区块来，这些区块多了就会显得杂乱无章。所以我们又会到处放些横线来分界。一个更好的做法是将区块垂直对齐，这样做不会让那些多余的线条来扰乱视觉。

  第八条 界面设计得一致

  界面设计中尽量保持一致性成了一个普遍遵循的准则。可以在很多方面下功夫来实现一个一致的界面，包括颜色，方向，元素的表现形式，位置，大小，形状等。不过在让界面变得一致之前，记住一点，适当的打破整体的一致性也是可取的。这偶尔的不一致性的设计用在你需要强调的地方可以起到很大的作用。所以世事无绝对，我们应遵从一致的设计准则，但适当地打破这种常规。

  第九条 具有层次的图形化展示优于直白的文字描述

  具有层次的设计可以将界面上重要的部分与不次要部分区分开来。要让界面层次分明，可以在这些方面做文章：对齐方式，间距，颜色，缩进，字体大小，元素尺寸等。当所有这些调整运用得适当时，可以提高整个界面的可读性。相比在一个很直白的界面上用户一眼就可以从上瞟到底的设计，这样分明的设计也可以让用户放慢速度来慢慢阅读。这样也使界面更有特色一些。就好比快速旅行，你可以乘坐高铁快速到达景区(从页面顶部瞟到底部)，但你也可以慢行以欣赏沿途风光。所以层次分明的设计让眼睛有可以停留的地方，而不是对着空白单调的一个屏幕。

  第十条 优化页面加载速度，不要让用户等太久

  速度很重要。页面加载速度和UI对操作的响应速度都直接关系到用户是否有耐心继续等下去。无疑地每多一秒种的等待都会失去一些用户或者项目机会。一个好的解决之道当然就是优化你的页面和图片。除此之外还可以运用心理学让这个等待时间显得不那么长。具体来说有两种技巧。一是显示进度条，二是展示其他相关或有趣的东西来吸引用户的注意力(就好比你沿着传送带走走总比傻站在原地盯着一个位置看要好得多吧)。

尊重原创文章，转载请注明出处与链接：http://jnthjy.5zix.com/news/104396/ 违者必究！ 以上就是济南天琥设计培训学校 小编为您整理设计网页的常见问题的全部内容。

---

• ← 济南天琥教育告诉你室内设计什么是软装
• 济南天琥设计培训学校告诉你学平面设计的前景如何 →