四川工业科技学院 四川 德阳 618000
摘要：随着科学技术的发展，手机上网成为人们的一种生活常态，在现代信息技术的支持下，网页浏览越来越便捷。但是，与此同时我们也会发现，一些网站的界面设计不佳，影响上网体验。针对于此，本文首先介绍了网站界面设计的视觉元素，然后指出手机网站设计的影响因素，最后阐述了手机网站与传统网站在界面设计上的差异，以供参考。
关键词：手机网站；传统网站；界面设计；差异
手机的使用，尤其是智能手机的使用，改变了人们的生活习惯，对于衣食住行等各个方面，产生了深远的影响。单纯从手机上网来看，网站界面和传统网站在设计上存在明显差异，这种差异的存在，就是为了满足用户的需求，提高浏览效率，优化上网体验。以下对此进行详细阐述。
1、网站界面设计的视觉元素
1.1 风格
网站风格的确定，是综合分析企业形象、性质、功能、工作内容后得出的结果。以Window8系统的网站设计风格来看，采用单色块为基础，配上简单的图文，凸显的是内容，削弱的是特殊效果。这种设计风格比较简洁，但是不具有统一适用性。纵观艺术类、音乐类、商业类网站，由于主打的需求不同，因此在设计上个性不同，最终形成不同的风格。
1.2 版式
网站界面的版式，直接受到内容的影响，尤其是综合类网站，内容多且繁杂，如何分配首页、次页的位置，成为设计工作开展的关键依据。一般情况下，绘制线框图，有利于掌握这些内容的逻辑分布。站在设计专业的角度，大到栅格系统设计、小到一个条栏设计，实质上都是方块的拼接。因此，版式设计可以简单理解为，对各种矩形的排列组合进行规划。
1.3 图文
图指的是图片，文指的是字体。对于图片而言，优质的图片能够给浏览者留下深刻的、美好的印象，因此当前许多网站首页均采用大幅图片，并设置成手动切换或自动切换的模式。而且，预览图概念的应用，能够增加浏览速度、优化上网体验。对于字体而言，具有画面装饰的效果。出色的网站界面，一定具备出色的字体设计，既满足阅读需要，又能够体现出网站风格。具体来说，设计时要考虑到字体、字号、像素大小。网站内容可以采用常规字体，但栏目、题目、按钮等部位，可以设计成特殊的字体，从而适应浏览器默认字体的标准。
1.4 交互性
统一交互性标准，有利于用户对网站的理解和操作，从而提高浏览速度。举例来说，当鼠标接触到新闻标题，具备一定的反应，才能够获得良好的操作体验。交互性设计要求遵循方便、实用、操作最少的原则。以用户注册为例，一般采用AJAX技术，输入用户名之后，会和系统中的数据库进行比对，以明确是否已经注册，并最终显示在输入框旁边，给人良好的交互体验。
2、手机网站界面设计的影响因素
第一，环境因素。手机在使用时，环境因素带来的影响小、局限少。但是，用户从一个环境进入另一个环境，此时对手机的关注会中断。因此，网站设计要考虑到功能、需求、环境三要素。以个人隐私为例，在公共场所操作手机会考虑隐私安全问题，此时往往单手操作，点击频率和精度降低。
期刊文章分类查询,尽在期刊图书馆
第二，用户因素。手机用户群体广泛，在网站设计上，要明确目标用户的特点，包括性别、年龄、工作内容、文化水平、生活习惯等。单纯从年龄进行分析，年轻人学习能力强，对于手机的操作适应时间短，而且操作灵活度高，能够适应小屏幕的点击需求。相比之下，中老年人在手机操作上存在困难，视力、手指灵活度均降低，容易出现错误操作，难以适应小屏幕的点击需求。
第三，技术因素。从智能手机的发展来看，屏幕尺寸增大、支持多点触控、操作更加流畅，不断优化操作体验。其中，3G、4G网络的应用，是智能手机的一大特点，具有速度快、掉线率低的优势，提高了用户浏览网页的效率。另外，内置感应器技术，改变了传统游戏的操作方法，用户可以通过重力改变、加速度改变，实现游戏的操控，带来了新的娱乐体验。
第四，网站类型因素。网站的功能类型不同，在内容设计上也会不同，体现在色彩、页面布局等方面。具体来说，主要分为门户型、展示型、内容型、商务型四种。以社交网站为例，网页设计的重点是个人信息提示、好友信息发布；用于购物的商务网站，重点则是明确不同商品的分类。
3、手机网站与传统网站在界面设计上的差异
3.1 屏幕尺寸差异
屏幕尺寸大小差异，是导致手机网站与传统网站在界面设计差异的根源。当前手机设备的屏幕尺寸在3-6英寸之间，笔记本电脑在13-17英寸之间，普通台式电脑的屏幕更大。因此，如果不对手机网站设计进行优化，而是采用传统网站的设计模式，导致的结果是：第一，网站的横向内容无法完整显示；第二，网站内容能够完整显示，但是字体明显缩小。
对此，手机网站在界面设计上，也会考虑到风格、版式、图文、交互性等视觉元素，但是会把并列的信息进行纵向排列。使用手机浏览时，信息逐层展开，必要时会舍弃一些无关紧要的信息。单纯以文字为例，传统网站每行汉子在40个以上，手机网站则在20个左右。也就是说，传统网站浏览需要横向扫描，手机浏览网站则属于渐进式体验。
3.2 使用习惯差异
第一，手机的使用环境复杂，在不同时间、不同地点均可能使用，而台式电脑、笔记本电脑做不到这一点。以淘宝网站为例，比较手机网站和传统网站，会发现手机网站更为简化，突出了搜索和导航功能，因此使用更加便捷。第二，手机操作多是单手拿着、拇指控制，因此主菜单会放在页面底部；传统网站则将导航放在页面顶端。第三，竖屏手机的应用，决定了手机网站的竖向排版模式。传统网站存在内容分栏现象，手机网站则不会出现。
结语：
综上所述，手机网站和传统网站在功能上具有一致性，但网站界面设计会存在明显的差异。通过以上分析可知，网站设计视觉要素包括风格、版式、图文、交互性。手机网站在设计期间，会受到环境、用户、技术、网站类型等因素的影响。手机网站和传统网站在界面设计上的差异，主要是屏幕尺寸、使用习惯决定的，提示设计人员加强对于先进技术的理解，在设计工作中做到有的放矢。
参考文献：
[1] 李江玲.扁平化设计在视觉形象中的运用[J].艺术科技,2015, (08):203-203.
[2] 宋茂强.移动多媒体用户界面设计[M].北京：高等教育出版社,2012.
[3] 匡文波.手机报的发展方向:3G网站型[J].传媒,2006,(09):50-51.
[4] 刘程程,张凌浩.移动互联网时代手机服务型APP产品设计研究[J].包装工程,2011,32(12):68-71.
[5] 尹立君.基于网站RSS技术实现手机APP的制作[J].邢台职业技术学院学报, 2015,(01):79-81,86.
论文作者:谭琦
论文发表刊物:《基层建设》2016年25期9月上
论文发表时间:2016/12/12
标签：网站论文; 界面设计论文; 手机论文; 手机网站论文; 操作论文; 差异论文; 内容论文; 《基层建设》2016年25期9月上论文;