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. 响应式设计(Responsive Design) 响应式设计是现今最流行的移动适配方式之一,其通过使用CSS3媒体查询技术,让网站或应用程序的布局根据不同设备的尺寸自动调整,以达到最佳的用户体验。在响应式设计中,通常会使用流动网格、自适应图像和可伸缩字体等技

Public @ 2023-05-30 02:50:38

wordpress移动友好度大揭秘

wordpress是目前是在国内比较流行的轻量级的内容管理系统,拥有世界上最强大的插件和模板,在站长圈中十分的流行,这次我们请到了国内wordpress著名社区我爱水煮鱼的博主来为我们揭秘wordpress如何做好友好度。现在使用手机上网的用户越来越多,即使类似我爱水煮鱼这类一般应用场景为 PC 的技术博客,都有30%的移动用户访问了,所以移动网站越来越重要了,今天登陆百度站长,发现百度站长也推出

Public @ 2022-11-07 15:45:00

落地页广告白皮书3.0升级点解读

2018年1月,百度发布《百度移动搜索落地页体验白皮书——广告篇3.0》(后续简称落地页广告白皮书3.0)。落地页广告白皮书3.0首次公布落地页中广告面积的阈值要求,另外,落地页广告白皮书3.0补充了之前有外部强调但未落实到白皮书上的部分。一、新增的广告面积阈值要求1、在章节“广告位置以及面积”中,更新“3.2.1.      文章内容页或信息详情页,从标题开始到正文

Public @ 2022-09-19 16:18:56

移动时代下的站长都该做哪些工作

作为一个站长,在移动时代下,应该做以下几点工作: 1. 网站响应式设计:为了让网站在不同设备上能够展现出最佳效果,站长需要采用响应式设计,使网站能够自适应不同尺寸的屏幕,提高用户体验。 2. 移动优化:站长需要对网站进行移动优化,优化网页加载速度、减小网页大小、优化图片等。这些措施可以提高页面的打开速度,减少用户等待时间,提高用户的满意度。 3. 应用程序开发:随着移动设备的普及,应用程序已

Public @ 2023-04-10 19:50:42

更多您感兴趣的搜索

0.490807s