网页设计案例分析：如何利用手机版UI设计增加消费者的购买意愿

如何利用手机版UI设计增加消费者的购买意愿?在智慧型手机的推进下，全球智慧型手机的普及率逐年上升，现在吃喝玩乐几乎都可以通过一部智慧型手机实现。那麽，消费者使用智慧型手机上网都在做些什麽事情?

据数据统计，85%智慧型手机使用者是因为从事与网络相关的工作;78%智慧型手机使用者则是利用手机浏览网络内容。由此可见，品牌网站的UI设计对智慧型手机使用者具有相当高的重要性。

因此，品牌网站若想提高浏览量继而增加转换，那就深入了解网页UI设计是否符合智慧型手机使用者。

品牌为什麽要制作行动网站?

行动网站制作的好坏会直接影响消费者使用手机购买的关键。

过去，受到智慧型手机的荧屏太小和行动互联网技术尚未成熟等问题，大於5成的消费者会从智慧型手机获取产品相关资讯後，会透过电脑购买或到实体店购买。但在这个过程中，消费者有可能因为种种原因而打消购买意愿。

因此，在制作行动网站时，我们必须基於介面空间有限问题，考虑如何解决消费者的疑虑和过程，并促使消费者使用手机直接交易。

可见，手机版网页设计对品牌线上营销非常重要!

如何利用手机版UI设计增加消费者的购买意愿?

响应式网页设计技术能自动侦测使用者上网的装置尺寸，针对不同荧屏大小而自动调整网页图文内容，让使用者在用手机浏览网站时，不用忙於缩小放大拖曳界面，就能给使用者最佳浏览页面体验。

除此之外，采用响应式网页设计技术的另外一个优点，就是你无需同时维护电脑版网站和行动版网站，就可兼顾使用者在电脑版网站和行动版网站的不同石旭耀需求。

无论使用者是透过何种装置浏览网页，该网页疑虑使用相同网址和程序码，但网页显示会依据荧屏尺寸进行调整。因此，Google官方也建议网站使用相响应式网页设计技术。

除了在网站制作时应用响应式网页设计技术外，设计网站时还要遵循以下十大原则：

▪ 网站Logo尽量置於网站显眼位置，有利於为企业品牌做宣传。

▪ 将用户需求量大的讯息放置在界面中重要且突出的位置。

▪ 网页首页讯息尽量保持简洁，最好用几句话概括网站核心内容即可。

▪ 页面标题或底部栏必须於手机宽度相符，否则将会影响网站的用户体验。

▪ 确保网站能兼容不同设备和浏览栏，即我们刚才一直强调的响应式网页设计。

▪ 网站导览地图尽量采用底部导航方式，导航选单数量以4-5个为佳，同时子菜单(层次选单)的使用也需谨慎，切勿过多。

▪ 不能完全使用手机的解析度进行版面布局的缩放，这可能与响应式设计有冲突。

▪ 设计网页使用可点击的内容列表时，必须保证手指能点击。

▪ 文本区域周围保持足够范围的留白，段落之间也要有一定的间距，增加界面的易读性问题。

▪ 网站版型布局要合理，操作上也要足够方便。

最後，我们就通过一些 案例来简单说说手机版网页设计的要点：

◆ Pinkoi

Pinkoi手机版网页设计有一个非常值得推荐的点，就是当使用者在往下滑动画面时，会中自动收合上方选单部分，而尽量空出画面显示内容。另外，网页设计重视商品而仅留下产品图片，而删除多余的文字信息，显得画面非常乾净。

但是，部分文字按钮略小，容易导致使用者误触，建议可以按钮的间隔加大或字级加大。

◆ Lativ

由於Lativ是贩售自家商品，所以在文字图片整体设计上非常统一。使用区块呈现网页讯息也没有使用过多文字说明，字级足够大而方便用户阅读。从整体观感来说，Lativ手机版网页设计非常乾净且整齐。

◆ Groupon

整体手机版网页设计的视觉效果非常整洁，让用户很容易理解与操作。不过，名称与说明文字的字级建议加大，更方便使用者阅读。另外，网站设计建议尽量不要使用弹窗设计，一来影响网站加载速度;二来，毫无预警的弹窗设计会让用户感到非常无奈。

◆ ㄇㄞˋ点子灵感创意志

整体网站设计布局层次分明、简单乾净。但保持在画面上的分享功能，经常会挡住界面中的按钮与文字，影响使用者的操作与阅读，建议必要时进行取舍或放置於界面的页头或页眉并收合。

如今智慧型手机已越来越普及，同时也成为大多数消费者日常生活中必不可少的装置，因此品牌为用户提供操作良好的手机版UI设计是非常重要的，也是未来的大势所趋!