设置密码

验证码错误,请重新填写

免费建站旅程马上开始

开始建站
建站中

已有帐号?直接登录

问答咨询

首页 > 全部问题 > 企业网站建设 > 手机网站APP应用界面设计技巧分享

[ 手机网站APP应用界面设计技巧分享 ]

fubi:

手机网站APP应用界面设计技巧分享

回答:   

在平面设计印刷和网页设计领域,文本版面设计和前端制作都有非常成熟的经验和技术。随着移动网站和应用程序应用程序的广泛使用,越来越多的网页和应用程序产品追求完美的用户体验,并且需要更多的排版设计和文本显示效果以适应各种移动设备和变化。使用环境。移动设备上文本布局设计的变化带来了新的挑战。

 


  1,字体大小对比

 

  在桌面方面,我们可能会使用字体大小差异较大的单词组合。移动端的屏幕较小,屏幕中包含的文字较小。小屏幕上相同字体大小的差异将被放大。

 

  原因是我们在使用这两种设备时有不同的观看距离。我们的眼睛远离桌面屏幕,反之亦然,因此我们应该在移动端使用较小的字体大小对比度。通常,界面设计的电话版本使用的字体大小是Web版本的两倍。例如,界面的计算机版本通常是12px是最小的常规字体大小,那么移动版本上使用的最小常规字体大小应该是大约24px。这取决于项目的需求。

 

  2,字体粗细变化

 

  不要在PS中使用粗体文本。它不仅破坏了字体本身的美感,还改变了文本的原始字宽,并影响了段落内文本的对齐。合理的方法是使用字体本身的字体粗细来控制。例如,Apple,STHeiti和Helvetica Neue等字体提供Light,Regular,Medium等。当然,设计渲染中的字体边缘定义与实际设备中显示的字体不完全相同。

 

  3,字体颜色对比与背景对比

 

  使用移动设备的环境是复杂的并且不限于室内。它可能在室外,甚至暴露在强烈的阳光下。应该确保文本不能识别背景中的困难,即使是弱者也能正常阅读。WCAG 2.0中推荐的色彩对比度应高于4.5:1(AA级),以确保更多人和环境可以轻松阅读。Sketch中有一个插件,Color Contrast Analyzer可以轻松检测到这个比例,可以使用在线检测工具Color Contrast Check。

 

  4,文字间距设置

 

  除非您对布局有特殊要求,否则请勿更改字体的字体间距。字体设计者已经考虑了适合这种字体的字体间距。如果您不满意,可以更改字体。

 

  5,文本和光栅化系统

 

  在移动设备的小屏幕上,一些网页与不均匀间距(右对齐等)无关将变得突出。以Lofter为例,Lofter是一款优雅而优雅的网易应用程序,但其文章文本界面略有缺陷:如图6所示,文本在容器的左侧和右侧对齐

 

  “.所有元素都是立方体。但是在二十世纪使用标点符号之后,在现代桌面出版时代,许多排版工具直接应用了日本的”禁止处理“-也就是说,这个词的结尾;另外,与西方字符混合的情况正在增加,因此无法实现纵向和横向对齐的基础。但至少段落的开头和结尾仍然需要对齐。这就是为什么对齐对于e来说很重要-书和长篇文章。“

 

  上述所有技能和原则总结在各种移动移动网站设计项目中。移动平台,硬件设备和字体都在不断变化,相应的设计方法永远不会是静态的,而是一般的原则。它是相同的,也就是说,使内容更容易阅读。


(username511014回复)

我要提问>>