Categories


Tags


体验提升小贴士:如何从PC页面重定向到移动页面?

有很多时候,用户在移动设备上会访问到PC页面的地址,这种情况下,我们需要以极快的速度跳转到对应的移动端页面,尽量减少用户的感知,给用户最好的体验。那么,如何从PC页面重定向到移动页面呢?本文将为你解答。

如何能快速地由PC页重定向到移动页面,我们按照不同站点的类型,给出了几种常见的实现方式。

1. 站点有独立的移动端站点和PC站点

这种情况下,我们需要进行服务端跳转。当在移动设备上访问PC站点时,需要服务端进行环境判断,然后重定向到对应的移动页面。

(1)环境判断

环境的判断,一般是通过判断请求的userAgent,以php为例,下面给出简单的代码实现

(2)重定向到对应的移动端页面

2. 站点没有独立的移动站点

这种情况下,我们可以采用前端页面响应式布局,以便在不同的分辨率和设备下都可以合理的进行页面展示。

关于响应式布局,关键的有几点:

使用media query(媒体查询),在不同尺寸、不同设备上进行不同展示,譬如

设置viewport(视窗)。如果没有设置viewport,在移动设备上将会使用桌面版屏幕宽度渲染页面,然后再进行缩放以适应屏幕。

布局方式。传统的固定布局方式,无法适应响应式布局,建议采用栅格化布局,可以参考Bootstrap的流式栅格化布局。

结语:提升用户体验,我们携手努力~!你还有哪些技术提升方面的问题呢?欢迎留言提问。

来源:百度搜索资源平台 百度搜索学堂


Public @ 2019-10-13 16:19:40

【院长帮帮忙】移动适配不稳定、不生效,可能是这些原因造成的!(第五期)

1. 未设置Viewport Viewport是指浏览器中用于控制页面布局和缩放比例的元标签,如果未设置Viewport,则移动端浏览器会将页面按照PC端浏览器默认的布局来显示,导致页面排版错乱。因此,需要在head部分加入Viewport的设置,例如: ```html ``` 2. 媒体查询错误 在进行移动适配时,我们通常会使用媒体查询来针对不同设备进行样式的调整。但是,如果媒体查询的

Public @ 2023-04-04 12:50:29

百度移动搜索落地页体验白皮书——广告篇3.0

本文是《百度移动搜索落地页体验白皮书—广告篇3.0》的梳理总结。 在移动搜索落地页的体验中,广告的体验是至关重要的因素之一。一方面,广告的质量直接影响用户对整个落地页的信任度和体验;另一方面,广告商的投放需求也是搜索营收的重要来源。 为了优化广告在移动搜索落地页中的体验,百度提出了以下几点建议: 一、广告质量是关键。 广告质量影响用户的点击意愿和信任度。百度建议广告主在投放前要进行广告质量

Public @ 2023-04-29 12:00:16

浅谈移动站点优化之痛——HTML5

作为一门新兴的 Web 技术,HTML5 在移动站点优化中扮演着越来越重要的角色。在移动端,HTML5 能够带来更好的视觉和交互效果,同时也能够提升页面的加载速度和性能。然而,在实际应用中,还存在一些问题,接下来就让小AI浅谈移动站点优化之痛——HTML5。 1. 兼容性问题 HTML5 中新增的标签和属性在一些低版本的浏览器中并不支持,这就会导致页面出现兼容性问题,从

Public @ 2023-04-15 13:00:35

移动落地页体验规范常见问题说明

移动落地页体验规范是指在移动设备上,为用户提供良好的页面交互、视觉效果和易用性的设计标准。以下是常见的移动落地页体验规范问题说明: 1. 缺乏响应式设计:落地页应能自适应各种屏幕尺寸,使用户无需缩放或水平滚动页面。 2. 页面加载速度慢:长时间的加载速度会降低用户体验,影响页面的转化率。需要优化图片大小、压缩代码等方法来加速加载速度。 3. 不清晰的导航:导航应该简单明了,能够快速将用户引导

Public @ 2023-04-28 22:50:17

更多您感兴趣的搜索

0.441682s