APP设计新知：左文右图和右文左图的差异在哪里

新闻资讯行业从传统纸媒体时代，到PC互联网时代，再到如今的移动互联网时代，用户阅读习惯和媒体转型、技术已有非常大的转变。企业若有计划制作新闻资讯类APP，就需要多留意市面上这类主流APP。

目前市面不少新闻资讯类APP设计的布局排版都是以左文右图或右文左图为主，这两种布局形式看似区别不大，实际存在很大差异。那麽，左文右图和右文左图的差异在哪里呢?

左文右图和右文左图的差异在哪里?

● 左文右图的特点

APP设计新知

左文右图是新闻资讯类APP设计布局中最常见的样式。按照用户长久以来的阅读习惯，即F阅读顺序(尼尔森的用户阅读视线模型)，用户浏览页面的顺序都是从左到右自上而下，因此左上角的信息是最触达用户的。

资讯类APP设计选择左文右图样式的理由是什麽?

APP设计新知

按道理，图片的易识别性远优於文字，将图片放在界面的左部分会更容易吸引用户的眼球。但为什麽大部分资讯类APP都会倾向於以文字为主，图片作为辅助信息的形式呢?

原因有四：

① 至文字诞生以来，人类普遍是通过文字来获取信息，因此从信息传递的准确性以及丰富性上来说，文字的优势远大於图片的。

② 根据大部分用户的阅读习惯，将文字放在界面的左边更利於用户获取信息。

③ 左文右图的阅读路径较短，不会有视线的折反。因此，基於效率和阅读习惯的角度来说，左文右图优势更明显。

④ 正因为图片的易识别性优於文字，因此即使图片放在文字後面，用户仍有机会将视线放在图片上。

APP设计使用左文右图的布局方式的好处有哪些

APP设计新知

大多时候资讯类APP为了展示信息的多样性，避免单一的信息流结构让用户感到单调，界面布局除了左文右图的样式，往往还会搭配三图、大图及视频等样式。在这这样多种穿插样式的情况下，APP设计使用左文右图的布局方式，能为用户提供一个扫读时的基准位置，极大地减少用户长时间阅读所带来的视觉压力和疲劳。

* 当界面布局出现多种样式穿插时，除了要考虑单个信息流样式的阅读体验，还要保持整体信息流阅读顺序的一致性，这样才能为用户提供较好的沉浸式体验。

另外，若在标题文字较短的情况，选用右图左文的样式，右上角有可能会出现视觉上的缺角，破坏界面整体的工整性。基於格式塔原理，左文右图样式能更好地避免这个问题。

* 格式塔原理对闭合的研究中提及到，人的大脑无论看见什麽东西，都会将它想像成一个整体，如果元素过於杂乱而无法归类为一个整体，会直接影响整体的视觉感受。

● 右文左图的特点

APP设计新知

从内容形式的吸引力而言，视频>图片>文字，因此高质量的图片往往能在第一时间触达用户并形成转化，但前提是一定要把控好图片的质量，否则效果将适得其反。因此左图右文的样式一般更适合PGC(Professionally-generated Content)类的APP。

PGC类APP大多是由专业内容生产者输出，他们对内容和图片的质量都有较好的掌控力，因此采用左图右文优先给用户展示图片信息，能更好提升用户对内容的兴趣。

APP设计使用右文左图的布局方式的好处有哪些

APP设计新知

在用户带有明确目的场景进行阅读时，用户往往对内容有一个大致的预期，所以如果让用户第一时间识别图片，能让用户立刻作出判断并大大提升用户操作效率，这比在众多文字标题中查找内容更为便捷。

无论资讯类APP采用的是左文右图样式，还是左图右文样式，在设计信息流时都要注意为用户提供图文阅读顺序一致的体验，以及注意以下几点APP布局事项：

资讯类APP设计布局的注意事项有哪些?

APP设计新知

① 文字颜色：根据Material Design设计语言推荐，在明亮光线下，浅色背景深色字比深色背景浅色字更容易识别;在较暗光线下，文字与背景的文本对比度应为7：1相对阅读更舒适。

② 文字大小与间距：如今不少APP都深有字体及字体大小设置功能，用户可根据使用场景与需要自定义字体及大小阅读，有效提升用户粘度。

③ 对齐方式：对於英文段落排版，通常使用左侧对齐，让右侧自然形成起伏边;而对於中文排版则使用两端对齐效果更佳。

以上就是有关资讯类APP设计布局的基础知识点，简单来说：若想让更多用户愿意长期使用你的产品，就必须深入了解用户习惯，选取最合适且最能满足目前用户体验的设计形式!