• 增强用户体验


    1.给图片加loading效果
    2.给ajax增加假的进度条,因为ajax只有0%和100%两种状态,可以随机到50%到80%随机的位置,成功后到达100%。
    3.上传文件加载进度条
    4.轮播图加过渡效果,明确当时显示的是第几张。
    5.单击和输入给一定效果,明确不是页面没有响应。
    1)按钮点击下陷的效果。
    2)输入表单获取焦点和失去焦点的效果。
    3)合理使用input的type类型,在移动端会根据type类型弹出不同的键盘。
    6.记住用户使用习惯。
    1)比如用户喜欢把某个元素放到固定位置。
    2)输入表单时的可记录信息。
    7.避免页面闪动
    1)图片没加载进来,父级没有高度,等加载进来了,突然有高度了,导致的闪动,可以给父级加高度避免。
    2)js控制高度的内容,后加载进来,突然产生的闪动,解决办法在页面写一个内联的script,由于是和dom渲染同步的,就不会有闪动了。
    3)尽量保证上面的渲染要比下面dom元素先渲染。
    8.在文章新闻列表有翻页功能的时候,可以给浏览器增加前进后退的功能。
    9.使用icon图标字体和svg可以减少体积,增加网站的高清体验。

    设计方面

    1. 加载状态的样式不要设置成模态框,那种情况会引起用户的焦虑感,可采用局部加载状态
    2. 选中态和非选中态要配色明确,突出重点
    3. 提示信息的展现方式,例如登陆成功,网络加载失败,不需要特殊强调的信息使用1.5秒在手机偏下位置弹出文字提示,不会影响用户使用;例如失败信息需要强烈的告知用户的可以使用模态对话框;支付信息提示需要更为强烈的操作结果页来反馈。
    4. 减少输入,输入提示信息,记录用户搜索记录操作习惯等,通过其他方式解决,例如输入银行卡号,获取地理位置信息等,为减少输入错误,可以增加拍照识别和获取地理定位等按钮。
    5. 输入框输入文字提示信息,输入文字颜色变亮,文字和边框留有一点距离。
    6. 按钮的样式要统一,要有圆角都有圆角,填充背景色,状态提示,通过控制透明度的变化表明那个是主要的信息,通过给不可点击的按钮设置灰色提示用户。
      7.提示文字尽量简单明确,防止不断重复操作,比如多项选择的问题,我们要求至少选择两个,但是用户没有选择,我们提示用户该题至少选择2项,而不是提示用户该题没有选择
      8.一些静态的轮播图设计,如果文案较少的话可以用大图,整屏滚动,视觉冲击力比较强;第二种希望用户把速度变慢,把一些较大的静态banner图,做成呼吸的动态效果,放慢用户节奏。
      9.增加适当的动画效果,例如页面滚动,翻转,缩放,弹出等常见效果。
  • 相关阅读:
    java笔记之日期相关操作
    Android笔记之察看网络状况
    Jsp之复选框的使用
    jsp之table美化
    JSP与servlet之间跳转传值
    request的get/setParameter和get/setAttribute()
    Jsp的button按钮
    使用request.getRequestDispatcher请求转发到一个页面中文乱码解决 【转】
    Servle与JSP之间的相互跳转
    java笔记之null与isEmpty()
  • 原文地址:https://www.cnblogs.com/bonly-ge/p/9339678.html
Copyright © 2020-2023  润新知