发布日期:2020-11-29 07:52浏览次数:
每个人都希望自己的设计在每个屏幕上看起来都很漂亮。但在移动设备方面,过于炫目可能是危险的。高端的布局或功能,在桌面上看起来惊人的对手机而言可能没有意义。移动网站需要在适当的地方简化。如果一个特定的元素在小屏幕上显得太大了,可以删除它或者用更有效的方法替换它。
在排版方面,尺寸和对比度在手机上同样重要(如果不是更重要的话)。阅读长篇文章时,盯着高质量的手机屏幕还是有点无聊。确保文本大小合适,并设置行距和页边距,以帮助提高可读性。需要注意的是,桌面用户的可用性也应该与移动体验相结合。
多栏布局是普遍存在的,但是文本密集型的列通常不适合最小的屏幕。在这种情况下,简单地将多个列转换为一个列是有意义的。但当我们谈论平板电脑甚至是卧式手机时,这些布局仍然非常有效。关键是,我们值得付出额外的努力。大多数情况下,我们可以忽略这些中间分辨率,而只关注最小视图的解决方案。实现这种策略的最简单方法是使用cssflexbox。如果配置正确,通常可以为当前视口自动提供布局。您可能需要通过媒体查询进行一些微调,但结果值得进一步调整。
网站制作很容易陷入将每个设计元素放置在与移动视图和桌面视图相同的相对位置的陷阱中。这种方法有时是值得称赞的,因为它的方法更小,但不太一致。例如,许多网站在标题中放置搜索表单或社交媒体图标等项目。这在较大的屏幕上效果很好,但它经常干扰手机上的主要内容。在二级页面上尤其如此,用户可能只想阅读页面文本而不必担心所有不相关的垃圾。
除了坚持这些类型的项目的标题之外,还有其他几种方法让网站感到不舒服。您可以考虑将这些项放在按钮中,以便根据用户需求显示它们。或者它们可以是你实现的任何移动导航解决方案的一部分。同样的事情也适用于边栏之类的功能。其他元素可能完全隐藏。类似地,媒体查询(可能还有一些条件代码)可以将这些项放在移动设备上更合适的位置。尽量决定去哪里。
在考虑响应式设计策略时,您可以考虑添加一些小触摸,为移动用户带来更多便利。这些项目通常不需要额外的努力来实施。然而,它们可以极大地提高可用性。在触控设备上浏览可能会带来一些桌面用户不必面对的挑战。首先,为了返回主导航,移动设备从长页面向上滚动是一个主要困难。通过使用当检测到用户向上滚动时自动显示的导航,可以在一定程度上缓解此问题。
以上是在网站建设中提高移动用户体验的四个因素