恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
提升移动端用户体验的7种方法
0.0°
2017-07-28 好文转载 经验/观点 原作者: 南隼互动 举报 2082 2 2 0

一项好的设计往往起始于内容。要想你的移动用户体验更充分的表达和符合实际的操作体验,在内容的设计上你可能需要经过一些调整和改变。

不过,你应该从哪里开始呢?内容应该如何适应移动设备并做到可以无缝地工作呢?我想,你可能需要从思考用户如何与小屏幕交互的方式开始,以及它如何能够影响(以及能影响的程度)他们想要去阅读。

1.你需要每一屏只保留一个主要信息(想法)

Image title


当移动设备的内容设计看起来一团糟的时候,试着重新计划和规划页面的元素(这一点在网站设计项目中是一样的),你需要保证每一个屏幕最多承载一个主要的的视觉或信息。即使现在的手机日益趋向于更大的尺寸和分辨率,也不要被诱惑在屏幕上塞过多的信息!

每一屏保留一个主要信息已经足够了,再多,你可能就冒着压倒用户的风险。

一般来说,习惯使用移动设备的用户更倾向于多任务处理。他们可能在看你的网站设计的同时,也在看棒球比赛,或者和朋友聊天。通过保持信息和内容的简单和直接,你有一个更好的机会来传达一个想法,同时,这个想法也更容易被用户吸收(因为页面上没有其他不先关的干扰)。

但这个想法具体是什么呢?它可以是一组文本、图像和可操作的元素。内容的组合应该让用户做出一个选择:你想要这样做吗?

2.优先级导航

Image title


当用户访问你的网站设计或者移动端(响应性)版本时,应该有一些可以使用户倾向于去做的事情,或者你希望他们做的事情。确保你的导航可以正确并且有效的引导用户,让用户快速地获得这些信息或者元素。

尽管像具有10个不同级别的导航选项菜单可能在你的桌面站点上运行良好,但移动端的用户通常在时间上更有压力。他们无意在网站上闲逛,他们的唯一目的就是找到一些他们需要的东西。

所以,移动端的导航需要尽可能的简单和精简。如果你不确定从哪里开始,可以在网上查找一些有关手机用户的行为分析来帮助你获得想法。弄清楚用户经常访问的前三、四页是什么?这些页面的访问量是否符合你的预期?通过这些信息,你可能会找到关键的导航元素,接下来就是相应地调整移动端的内容了。

3.以搜索引擎的角度来思考

Image title


无论你每天获得的页面浏览量是十个还是数百万个,你要像搜索引擎一样思考移动设备上的内容。每个单词、图像和内容都需要被快速找到和记录。不要过多的在意和规避搜索引擎的算法,你需要做的是创建用户想要阅读的高质量内容。

在移动方面,这可能意味着你需要减少一些内容元素。例如,在主页上有三张图片,选一张最重要的照片就足够了。不要在评估上失衡,网络速度和wifi技术一直在进步,但你不能保证所有的用户都在使用高质量的网络。

关于这点,你可以借助像谷歌提供的浏览器工具来检查移动页面的速度,这可以帮助你保持所有的优化。

4.使文本内容更大

Image title


小屏幕并不意味着你需要更小的文本。实际上,你应该增加点尺寸,使内容更容易被阅读和消化。看一看你的住文本内容,选择一种更适合的尺寸,并且保持每行30到40个字符(这个标准大约是桌面版网站设计推荐的一半)。

在小屏幕上也有其他的技巧可以让文字更容易阅读和理解。你可以在之前的Design Shack中找到那些有关于如何设计更好的移动端文本排版技巧的文章。

5.微内容需要有意义

Image title


微内容的好坏(内部元素如按钮)在网站设计上可以成就或者毁灭整体的设计,这在手机端是一样的。微内容可以帮助设计添加个性和焦点。它同时也需要能够传达一些有用的信息,帮助用户在设计中找到自己的目标。

特别是在移动设备上,考虑将微内容较平时的更大一点,并且总是用它来帮助引导用户。

你可以试着思考一下你在日常生活中在移动端遇到的常见问题,比如你通过移动端付费的时候。需要填写的表单可能会跨越多个屏幕或者以滚动的形式延长距离,而通过微内容作为指引,可以使用户在第一次进行操作的时候就可以正确填写所有的内容变得更容易。

6.剔除不必要的元素

Image title


在PC端的网站设计上,类似旋转的动画和视差滚动功能看起来很不错,但在移动版本这些效果可以直接去除。去掉所有你在移动端并不需要的设计效果。你希望所有的东西都能快速、无缝地加载,动效可能会阻碍你和用户之间直接有效的链接。

另一个你可能需要去除的效果就是悬停效果了。对于触摸操作,没有“悬浮状态”这样的东西。

将移动用户体验简化为容易理解的tap功能(替换点击)同样可以做到明显的反馈。你不希望用户质疑某个行为是否发生,它应该始终是显而易见的。

7.适应范围

Image title


没有什么比登陆一个在页面上所有的内容都很“mini”的移动端响应网站更令人沮丧的了。拥有独立的移动设计的目的是让用户可以在更小的设备上更容易访问你的网站。你必须使内容适应这种范围。

有时,调整内容只是部分内容的重新排版。

· 在PC端的屏幕上横向排列的按钮在移动端可能需要调整为垂直放置。

· 在移动端使用的主导方向(垂直)上,照片可能需要被裁剪得更偏向于方形或垂直的长方形。

· 为页面的简洁,你会需要重新编辑和修剪文本内容。

· 导航需要被重新定位,放置在一个不同的位置。

· 有关于呼吁行动的按钮或元素需要被做成更大的,可以适应移动端屏幕大小的元素。

· 基于用户持有手机的方式,所有的按钮和点击元素都需要被放置在很容易找到并触发的位置。

总结

Image title


你准备好重新考虑在你的网站设计上规划的内容了吗?如果你建立了一个响应式的网站,并且假设所有的东西都能转化为移动端的内容,那么就该评估一下移动端部分的设计了。很有可能,小内容更改的空间会改变用户与设计的交互方式。

这是设计过程中至关重要的一部分。如果你手上有关于网站的统计分析,看看你的用户群有多少百分比是在移动设备上访问你的网站的?如果你不调整以迎合他们的需求,你可能会疏远一个很大的用户群,尽管你并没有冒犯他们的意思。

更新:2017-07-28

收藏

2人已收藏

  • 44

    作品

  • 9

    粉丝

  • 0

    关注

  • 10个很棒的下载免费矢量图形的地方
  • 在网站设计中有效使用微文本的6种方法
  • 如何安装&应用Lightroom预置
  • 15种好看的极简风格Logo模版

    猜你喜欢

      2017-07-28 好文转载 经验/观点 原作者: 南隼互动 举报 2082 2 2 0

      提升移动端用户体验的7种方法

      0.0°

      你确定要举报提升移动端用户体验的7种方法

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年07月28日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      2
      2
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录